To me (non-technical), Figma building something to directly convert Figma components into React components or equivalent seems like a no-brainer. What makes it harder than I think it is?

Makes sense! But if Figma built the translation layer, wouldn’t you be able to set those parameters and identify what the component is using the Figma UI?

My thing though is that it’s literally a 1:1 representation of the UI most of the time, at least for design systems — and pretty much everything is a known fixed value on both ends. Even autolayout settings directly translate to code, there’s no interpretation needed typically

Product requirements -> Mockups is a *much* harder problem to solve, because there’s so many ways to approach meeting the requirements — going from Figma components to React components is essentially doing duplicate work that I feel could be automated

For me, this is sort of like a PM saying figma should let you convert product requirements into design mockups. Figma mockups are a description of intent, they don’t fully encapsulate what the final product is.

Good question! In theory, it should be easy, since it's the same "material" — HTML/CSS. In practice, it's hard because Figma doesn't know intent: how can it know the difference between a rectangle with text and a button? React components wrap HTML tags and require parameters.

Posts