Automating Figma-to-React-to-GitHub
There is a growing number of tools out there in the no-code and low-code space that claim to give you code from design tools such as Figma. Most of these are basically just inspect tools that lump code together for you to copy/paste snippets. Sure, this might sound ok for some. In real workflows, this can often lead to headaches, redoing things often and never getting to that full promise that the tool will make their life easier…
My philosophy for creating Quest is to build a product that truly augments workflows. Designers love Figma. I (a designer) love Figma. Developers love VS Code. I (a hobbyist developer) love VS Code. Neither designer or developer wants to learn some new clunky software but they do understand the process of translating design to code is always tedious. This is where other tools try and fail to go the full mile because without letting their users live where they want, a smooth workflow can’t exist. This is why we built the new GitHub feature for Quest.
In traditional workflows, designers design and then handoff that experience for developers to rebuild it based on the design and a whole bunch of notes. This is how it has been done since the dawn of time.
So new tools come out and say, we can let you better inspect design and get code to jump start your project. Great… Except if a designer changes something, all of the developer’s code needs to be carefully merged or redone. So as the design changes for the sake of improvement or product updates, the whole traditional workflow kicks in… We need to start a new task, figure out scope, etc. That seamless hand-off is gone and in fact, there’s more friction than ever. Don’t even get me started that most of the time the design to code tool doesn’t look pixel perfect because that’s a whole other problem….
In Quest, when a designer changes a component design, that change affects only the presentation layer/file. Developers simply uptake latest design and done. When they write logic for the component, it is saved in a hook.
Now the beauty of using GitHub to push your individual components or entire App from Quest is that we will intelligently merge any changes you’ve made in your files. Never worry about overwriting code that you’ve already been working on. Let designers work independently, iterating infinitely until they feel it’s done. Happy designers, happy developers. As we continue to expand capabilites of what Quest can do, we always keep in mind how teams would want to use it. Our goal is to modernize the way software gets built with less friction in teams & more time to build it right.
Read more about the GitHub feature in our docs.
— — — — — —
Quest is the future of frontend development. Build better. Build faster.
Convert Figma to React with the Quest plugin.
Check out how to get started.
