Haiku is a motion design app for creating production-ready UI components.
We're focused on:
- Design expressiveness (e.g. the timeline, plus the ability to respond to user input and live data) and
- Connected workflows with developers.
We think being able to create live, usable UI components trumps being able to just make pictures of them. We think developer hand off is a huge problem, not a feature. That is what sets us apart from other design tools. Some of them let you prototype using their screen interactions, others are great for making videos or Hollywood special effects, but it’s ultimately still a mockup that can’t be integrated with your codebase— a developer still has to re-create any designers work by hand.
The most fundamental difference between Haiku and those tools is that they’re built around the ‘hand off’ paradigm. With those you’re handing off specs, interactive mockups or generated code to a developer who then integrates it with your codebase. Some of those tools even advertise hand off as a feature, but we think it’s actually part of the problem.
- Everything is production ready, so you don’t waste time creating throwaway prototypes, as a designer you can author the actual UI that’ll be used by your website or app.
- It’s always-integrated, so you can iterate on your designs even after they’ve been integrated with a codebase.
The best example of that is here. There’s an animation authored in Haiku, embedded in a web app, and iOS & Android emulators, and you can see even changes made in the Sketch source file being pushed all the way through to the embedded animation in the apps. Unlimited iteration, without needing to constantly ‘hand off’ to a developer or, without a developer needing to re-create your work.
It really comes down to how closely you want to collaborate: if a designer is comfortable with "this is my silo; I will hand off this video [or export it to Lottie] and the rest is up to the developer" then Haiku probably isn't for them.
If a designer is interested in collaborating with the developer to build the UI together, this is what Haiku is all about. Every action in Haiku is backed by a line of code. Every visual change is automatically handled with a git commit. When the designer pushes
publish, they're doing a
git push, and their work is published to
npm (these are all literal, not figurative). Importantly, once the designer's work is part of the UI, they can keep on changing it, iterating, experimenting — because it's connected to the developer through code & version control.