Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Figma to React

figma-to-react.vercel.app

Post reply on HN
Print view View original

31–40 of 121 posts

Re: Figma to React

#31

Post by preommr »

jack_riminton wrote: post #27
preommr wrote: post #18

Earlier quoted context omitted.

Won't work. It's a cool proof of concept, but practically, 0% chance of it being really useful. Converting figma layouts to code is fairly trivial. Converting it to code that's usable is a whole other story. There's the actual design related concerns such as nested layouts and dynamic behavior, as well as code base management concerns. At best this is a possibility for some tools like webflow, or framer. With figma,…

Interesting I hear what you're saying about nested layouts and dynamic behaviour but do you think this would be good for individual components (even if these are large components such as page layouts?)

No, because components implies inputs (props), and things like conditional rendering, or slots (props.children), or even life cycle hooks. You'd have to make code style decisions like what kind of code style to use (functional vs class in react e.g.).

Even if somebody did do all of this, merging the file from the app into a real project would be difficult. There'd have to be rules about merging, and diffing, and command line tools, etc. Maintaining and documenting all of this would be an absolute nightmare. And that's not even getting into engineering or marketing difficulties because you'll have people confused about the product identity, or say that it's too complex, or that it's buggy because it has so many more features now. And all this for pretty much nothing.

Because figma already has css exports (even if it's iffy, they're working on it). You export the styles, the padding, the colors, and that's what people really want to get from their figma files. So you get most of the way there for a much, much smaller fraction of effort.

Re: Figma to React

#32

Post by ggregoire »

fermienrico wrote: post #20
ratww wrote: post #15

Earlier quoted context omitted.

Two things: 1) React also didn't have any of that when it started. 2) The "ecosystem" is a fallacy. It's merely used as propaganda, to win popularity arguments and to dismiss new technologies. 99% of the packages on the so-called ecosystem are badly written, unmaintained shit, and most projects don't really need third-party packages other than React/Redux anyway. Especially projects that have a dedicated designer usi…

I was mostly mocking how fast JS ecosystem moves. Evidently, HN didn't find it funny. Just about the time we have a matured React framework, we've got another framework to jump to.

People are not moving away from React.

Re: Figma to React

#33

Post by auggierose »

partlysean wrote: post #26
camjw wrote: post #5

I'd be interested in hearing a designer's view on this sort of tool? It seems really appealing for me as a developer (and I've thought about building something like this in the past) but I wonder where it fits in the designers workflow?

I think a good parallel of this is Webflow, which I find to be an incredibly powerful tool and gives design teams a lot of freedom to build and deploy their designs, however it’s incredibly cumbersome if you’re using it to mock up options and explore iterations. That work still happens in Sketch for our team, and when it’s approved that same team brings it into Webflow and “does it for real.” I expect exporting from…

What can you do in Solidworks that does not work in Rhino? Do you have a list of top five points, maybe?

Re: Figma to React

#35

Post by celim307 »

preommr wrote: post #31
jack_riminton wrote: post #27

Earlier quoted context omitted.

Interesting I hear what you're saying about nested layouts and dynamic behaviour but do you think this would be good for individual components (even if these are large components such as page layouts?)

No, because components implies inputs (props), and things like conditional rendering, or slots (props.children), or even life cycle hooks. You'd have to make code style decisions like what kind of code style to use (functional vs class in react e.g.). Even if somebody did do all of this, merging the file from the app into a real project would be difficult. There'd have to be rules about merging, and diffing, and comm…

Agreed with this, the tooling for pumping out presentational only components is already there.

Re: Figma to React

#36

Post by weego »

camjw wrote: post #5

I'd be interested in hearing a designer's view on this sort of tool? It seems really appealing for me as a developer (and I've thought about building something like this in the past) but I wonder where it fits in the designers workflow?

This'll generate the kind of code you'd expect to get from a $60 themeforrest template. If you don't care to or never need to dig into it or reuse anything out of context of the prefab template you'll be in an 'OK' place, but anything more than that and you'll likely be not much better of than if you just started from clean.

Re: Figma to React

#37

Post by partlysean »

auggierose wrote: post #33
partlysean wrote: post #26

Earlier quoted context omitted.

I think a good parallel of this is Webflow, which I find to be an incredibly powerful tool and gives design teams a lot of freedom to build and deploy their designs, however it’s incredibly cumbersome if you’re using it to mock up options and explore iterations. That work still happens in Sketch for our team, and when it’s approved that same team brings it into Webflow and “does it for real.” I expect exporting from…

What can you do in Solidworks that does not work in Rhino? Do you have a list of top five points, maybe?

It’s not necessarily a feature comparison, but I’ve found it much easier to just “try” things in Rhino. Solidworks is best when you already have a clear idea of what you’re building. In that way, our industrial design team would use Rhino and then hand it off to the mechanical engineers to rebuild it in Solidworks.

Re: Figma to React

#38

Post by mwcampbell »

preommr wrote: post #18
camjw wrote: post #5

I'd be interested in hearing a designer's view on this sort of tool? It seems really appealing for me as a developer (and I've thought about building something like this in the past) but I wonder where it fits in the designers workflow?

Won't work. It's a cool proof of concept, but practically, 0% chance of it being really useful. Converting figma layouts to code is fairly trivial. Converting it to code that's usable is a whole other story. There's the actual design related concerns such as nested layouts and dynamic behavior, as well as code base management concerns. At best this is a possibility for some tools like webflow, or framer. With figma,…

Another concern is accessibility. How accessible would the generated components be with a screen reader

Re: Figma to React

#40

Post by debaserab2 »

celim307 wrote: post #35
preommr wrote: post #31

Earlier quoted context omitted.

No, because components implies inputs (props), and things like conditional rendering, or slots (props.children), or even life cycle hooks. You'd have to make code style decisions like what kind of code style to use (functional vs class in react e.g.). Even if somebody did do all of this, merging the file from the app into a real project would be difficult. There'd have to be rules about merging, and diffing, and comm…

Agreed with this, the tooling for pumping out presentational only components is already there.

Is the output suitable enough for a decent UX testing prototype?
Post reply on HN