Handoff: A new UI design tool that works like Figma – but exports to React and Vue
Hi fellow Indie Hackers,
I wanted to share this really nice project I've been working on. It's called Handoff and it's a design tool that allows you to draw like you would in tools like Sketch and Figma – but export to clean, production-ready Vue and React components. My goal with this project is to solve the disconnect (or gap, if you will) between engineering and design teams, by allowing designers to create directly in the target medium: the web!
If you like to see how it works, I've just posted a video demo on YouTube: https://www.youtube.com/watch?v=C2CU7z6qQc0
Curious to hear what you think!
Hi Nick, congrats for building this tool! I'm in the web development/mobile dev ecosystem since 2013 so I've seen many things like this. I'm the co-founder of https://www.creative-tim.com/
Hi Alex, thanks for your reply. Creative Tim looks great. Seems you have a lot of knowledge about UI frameworks – would love to chat with you more about that.
About TeleportHQ... I've seen TeleportHQ before. It looks really nice. Seems we have a similar understanding of what the design tool of the future should look like.
I'm also aware of PageDraw. From reading the article it seems that user acquisition (and product-market fit) didn't work out. That could have a lot of reasons, and I think one of them might have been that they didn't invest enough time in thinking about the positioning of their product. There's a very delicate balance for these no-code design tools to get right, because both developers and designers need to agree on using the product. If one of the two doesn't like it, it's bound to fail. This means that the product needs to cater to two types of users, with totally different backgrounds, needs, priorities etc.
Add the above on top of the fact that it's already quite the engineering challenge to convert designs to code, and it quickly becomes clear why so many design tools have failed to fix the disconnect between designers and engineers.
That's not to be said that it cannot be done, though! Design and development are still two sides of the same coin. Design tools just need to have a clear focus on mutual goals, and nothing more than that. That means tools shouldn't try to change the workflow in a way that is irreconcilable with how developers or designers are used to work today. That's also why I chose to design Handoff in a way that feels familiar to existing design tools, but with code output that adheres to industry standards for front-end developers.
The long term vision for Handoff is for it to become part of an ecosystem of tools that allow people to visually build software . Someone in the no-code space has once said that currently only 0.3% of the world population has the knowledge to create software. Can you imagine what the world would look like if, say, 10% or 20% of the population would have the means to build apps? I think this really shows the importance of pushing the no-code movement forward, which is what I'm trying to do with Handoff.
Anyway, I would love to chat more to see where we can help each other! You can reach me on nick@handoff.design.