TE
科技回声
首页24小时热榜最新最佳问答展示工作
GitHubTwitter
首页

科技回声

基于 Next.js 构建的科技新闻平台,提供全球科技新闻和讨论内容。

GitHubTwitter

首页

首页最新最佳问答展示工作

资源链接

HackerNews API原版 HackerNewsNext.js

© 2025 科技回声. 版权所有。

Show HN: Makers.so – A website builder inside Figma

180 点作者 johnthemaker超过 3 年前
Founder here. Makers.so is a Figma Plugin to build and publish sites without ever leaving Figma. Here’s a demo [0].<p>As a front-end developer I constantly go from Figma to code &#x2F; site, but it’s tedious… I decided to automate the process with this plugin. It works great for simple projects like:<p>- Landing Pages<p>- Portfolio &#x2F; Personal sites<p>- Resume sites<p>- Careers &#x2F; Wiki sites<p>So, not a Webflow &#x2F; Framer competitor (yet). Webflow and Framer are amazing tools, but if you are in the Figma ecosystem, it&#x27;s boring to duplicate your work on a different tool. I&#x27;m trying to make life easier for Figma users. If this seems interesting, you can install it here [1] and give it a try.<p>—<p>For a bit of context, I&#x27;m a solo-founder and I started Makers after sharing my idea on the Figma subreddit about how awesome it would be to have a button in Figma to publish my designs. A good amount of people seemed to agree, and that was enough to start working on it. This is turning out to be a super fun project, and I’ve been working full-time for the last two months.<p>[0] - <a href="https:&#x2F;&#x2F;twitter.com&#x2F;joaodmj&#x2F;status&#x2F;1488216877511884805?s=20" rel="nofollow">https:&#x2F;&#x2F;twitter.com&#x2F;joaodmj&#x2F;status&#x2F;1488216877511884805?s=20</a><p>[1] - <a href="https:&#x2F;&#x2F;www.figma.com&#x2F;community&#x2F;plugin&#x2F;991438050654881175" rel="nofollow">https:&#x2F;&#x2F;www.figma.com&#x2F;community&#x2F;plugin&#x2F;991438050654881175</a>

19 条评论

roldie超过 3 年前
This demo is really impressive!<p>I&#x27;m a ux designer and keeping my portfolio up to date is so tedious. For better or worse, I do a lot of &quot;thinking&quot; in Figma these days, so this would shorten my workflow considerably.<p>I currently use Squarespace (and previously rolled own code because I felt like I needed to prove I could) and even though it&#x27;s about as easy as a WYSIWYG could be, I still find it a chore to use and struggle to get things just how I want.<p>All that to say, this is really exciting, and good luck!
评论 #30293802 未加载
评论 #30288331 未加载
tomhallett超过 3 年前
I know you try to couch this for &quot;simple&quot; projects, but <i>if done correctly</i> I believe that something like this can be useable for complex applications as well.<p>From a super high level, we have &quot;structure&quot; and &quot;components&quot;. Using anything computer generated for application structure is risky and a bad idea. BUT, for components, I believe there are certain contexts where a &quot;react component&quot; which is autogenerated, by makers.so for example, might work. While I acknowledge some components are foundational and need to be flexible, robust, interactive, configurable, and clean, there are some which don&#x27;t. There are some components which level in &quot;application space&quot; which are one-offs, experimental, and somewhat rigid in their usage. For these types of components, as long as the computer generated html&#x2F;css is encapsulated into the component, it <i>might</i> not matter what the implementation details are.<p>If you just need to set it and forget it, you can save time by using a &quot;Makers.so figma group =&gt; react component&quot; process. Later on, if you do need that component to be &quot;productized&quot;, then upgrade it to handwritten html&#x2F;css later.<p>Notes:<p>* I built a proof of concept single page application with this approach (Sketch + www.animaapp.com) and it looked promising. Most of the wrinkles in that workflow are being solved at the figma level with variants and &quot;flexbox&quot; support.<p>* Unless you use more advanced css approaches&#x2F;sandboxing, you need to make sure the css boundary between your application and the autogenerated components aren&#x27;t in conflict. This might mean that makers.so baseline css assumptions (reset, whitespace, etc) might drive the baseline css for your application. Which is a bit of the tail wagging the dog. Hence, the high level of experimentation with this approach.<p>* And yes, I have been around long enough to have &quot;created applications using Microsoft FrontPage&quot; and done a &quot;Photoshop export to HTML&quot; to be very disappointed with the results. :)
评论 #30294032 未加载
评论 #30288723 未加载
csmeder超过 3 年前
I tried this Figma plug-in a couple weeks ago. It is quite magical!<p>What previously took me hours in Webflow, now only takes 30s (+ the extra 10-20 mins to format things correctly in Figma).<p>I’m looking forward to using this next time I make a portfolio.<p>The feature set still has some gaps but I’m quite impressed for how far it’s come in a few months.
评论 #30287956 未加载
ddubski超过 3 年前
This seems awesome. Just this morning I discussed 2-3 projects at work where we’d want to do something like this to save engineering time, without even knowing this existed. :)
评论 #30289517 未加载
app4soft超过 3 年前
Cany You explain how does <i>&quot;free forever&quot;</i> works according your pricing?[0]<p>&gt; <i>$12&#x2F;month per site.</i><p>&gt; <i>Free forever for makers.so domains</i><p>And how does &quot;free forever&quot; site example looks like? Any example of &quot;free forever&quot; site already?<p>[0] <a href="https:&#x2F;&#x2F;makers.so&#x2F;pricing" rel="nofollow">https:&#x2F;&#x2F;makers.so&#x2F;pricing</a>
评论 #30298462 未加载
detritus超过 3 年前
This is the nudge I&#x27;ve needed to look into Figma, so thanks! :)<p>(I&#x27;m an ex-webnik who always coded by hand and I&#x27;ve fallen behind a bit where responsive layouts are concerned, so Figma&#x27;s always looked partially-interesting to me... up until the point it apparently falls short).
评论 #30288626 未加载
skilled超过 3 年前
This looks interesting.<p>Can the designs be exported or are they locked-in to your platform? I looked at some of the demo pages on your website and they all seem to pull website content only through JavaScript.<p>In fact, I didn&#x27;t see anything inside &lt;body&gt; tags at all. But maybe I am looking at it wrong?
评论 #30289941 未加载
CitrusFruits超过 3 年前
Noticed something that could be reworded: &quot;Use dozens of pre-built components fully responsive.&quot; would probably read better as &quot;Use dozens of fully responsive pre-built components.&quot;<p>That aside, this looks like a super fun idea and I&#x27;m curious to see how it develops.
评论 #30291227 未加载
mdrzn超过 3 年前
Seems interesting.<p>I&#x27;ve always seen Figma as an Illustrator alternative, but being able to instantly turn a sketch into a website makes it so much more. This is like having a button to turn a PSD mockup into a website, very cool!<p>Loved the demo, will definitely give it a try in the next days.
评论 #30287989 未加载
chrisfrantz超过 3 年前
This is great. How do you handle updates?<p>How are menus and links handled?<p>Do you allow exporting of code if users wanted to migrate away or self-host?<p>Thanks and congrats, this is a slick implementation.
评论 #30288919 未加载
paul7986超过 3 年前
Why don&#x27;t more UX Designer know how to code mock ups (html&#x2F;css&#x2F;jQuery or Javascript) if their focus is building web apps?
评论 #30290491 未加载
afsardo超过 3 年前
This is great for fast prototyping saves so much time! And done right has the potential to grow to much more for sure ^^
评论 #30288944 未加载
youssefabdelm超过 3 年前
Someone needs to integrate AI into these Figma&#x2F;Sketch conversion tools so it just makes a phone version of the site or takes care of the responsive end of things... it&#x27;s really a hassle to deal with that stuff.
t2hv33超过 3 年前
Good, I will bookmark it
评论 #30287928 未加载
higgsbozo超过 3 年前
Wow, looks awesome. This is certainly something that is needed.
评论 #30291943 未加载
Graffur超过 3 年前
How does it work technically?<p>I would like to see the output code example.
评论 #30298479 未加载
freediver超过 3 年前
<a href="https:&#x2F;&#x2F;github.com&#x2F;gorhill&#x2F;uBlock&#x2F;wiki&#x2F;uBlock-Origin-works-best-on-Firefox" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;gorhill&#x2F;uBlock&#x2F;wiki&#x2F;uBlock-Origin-works-b...</a><p>It would be good to have a way to reproduce these results on modern versions of browsers.
评论 #30289846 未加载
RadixDLT超过 3 年前
I am switching from adobeXD to figma &#x2F; sketch
aemadrid超过 3 年前
looks like the site is down - HN can be a DOS nightmare...