Phase turns Figma designs into advanced prototypes with real code export. Create multiple simultaneous interactions (impossible in Figma), build complex user flows, and export as React components. Dead simple to use - import from Figma and go. Features real-time collaboration, version control, and multiple export formats. Design prototypes that developers can actually build.
Subscribe
Sign in
Phase
Hey Product Hunt! 👋
I’m Fergus, I head up marketing here at Phase. We’re all so excited to share what we've been working on.
Our team is building a tool for designers and anyone who loves being creative that gives you end to end control of your creative work.
The problem we're solving with our launch today is: prototyping.
We built this because the back-and-forth between design and engineering kills momentum. Now you can ship exactly what you designed. Import from Figma → Add real interactions → Export working React code. The whole flow is simple and crazy fast to iterate on.
What's different:
• Multiple interactions can run simultaneously
• No timeline unless you want it, but the power of keyframes is there if you need them!
• Exports real code, not just specs
• Built for how designers actually think
(Alpha disclaimer): Code export is early, it’s super hard to roundtrip the canvas with html/css. It works great, but it's not perfect. We're improving it every week based on your feedback and shipping as fast as we can.
We would love to hear:
• What interactions have been hardest for you to prototype?
• What framework do you need exports for?
• How does your team handle design → dev handoff today?
Thanks for checking us out! Happy to answer any questions 🙌
The keyframe animations is something that I've never seen before and an interesting take! How is the Phase team tackling the learning curve to learn Phase compared to a designer taking their Figma design straight to Vercel v0?
Phase
@lienchueh Hi Lien! That's a really good question because it goes to the heart of what we are building. V0 and Lovable and all are great tech, super fun to play with, but we don't actually have control of our work. That's the way LLMs work, they aren't deterministic. So as a designer when we get into the details we're going to have to open up a text editor and change the code. This is not a happy outcome for designers. We're building Phase to make sure that designers have total creative control of their work without having to work directly on the code, even when we can reliably work with an AI to help us create the design and animations. Designers are artists, they need control of their work; the kind of control that you get from a static design tool like Illustrator or Figma. So that's what we're building but with animations and now interactions. It's super hard 😅 but a lot of fun 🥳
We're moving fast too so expect more launches soon..