// 01
Product & UX design
Research to wireframes to hi-fi: we work out what the product has to do and how it flows before any pixel is polished, so the screens solve the problem instead of just looking finished.
research · figma · rive · flutter handoff
Product design that ships into Flutter
Most design handoffs die in Figma: a beautiful file nobody implements faithfully, redlined by a team that never has to build it. We design the product the way we build it - research to wireframes to hi-fi to a real design system - then hand it off straight into Flutter on the architecture we ship on. The screens you sign off on are the screens that ship, because the people who design them also know how they get built.
why this exists
A design is only as good as the build it survives.
A pure design shop hands you a Figma file and walks away. What lands in the app is whatever engineering had time to approximate - spacing drifts, motion gets dropped, the system erodes feature by feature. The design was never the problem; the handoff was.
We close that gap by being the same team on both sides. We design in Figma, build motion in Rive, and the handoff lands in real Flutter on utopia_hooks in Screen · State · View - the same architecture behind our own production apps. paper.design carries the design into code, so spacing, components, and motion land as designed rather than being rebuilt from a spec.
We close that gap by being the same team on both sides. We design in Figma, build motion in Rive, and the handoff lands in real Flutter on utopia_hooks in Screen · State · View - the same architecture behind our own production apps. paper.design carries the design into code, so spacing, components, and motion land as designed rather than being rebuilt from a spec.
what we do
What we design.
// 02
Design systems
Components, tokens, and rules - not a pile of screens. A system your team can extend after we hand over, mapped to how it gets built in Flutter so it holds together past the first ten features.
// 03
Figma → Flutter handoff
The handoff engineers actually implement 1:1. We carry Figma into real Flutter through paper.design, so spacing, type, and components land as designed instead of drifting in translation.
// 04
Motion & micro-interactions
Transitions, loading states, and the small moments that make an app feel built, designed in Rive and shipped into Flutter as the real thing - not a video the engineers reverse-engineer.
// 05
AI-accelerated ideation
We move faster with tools like paper.design and claude.design - exploring directions and getting to a working handoff sooner. An accelerant on the craft; a person still makes every call. We are also exploring agentic design-to-Flutter mapping - turning a design straight into structured Flutter - as an emerging direction, honestly labeled.
concept to ship
From research to running Flutter.
- 01
Research
We work out who the product is for and what it has to do - the flows, the constraints, the platforms - before any screen gets drawn.
- 02
Wireframe
We shape the structure and the flows in low fidelity first, so the hard product decisions get made before visual polish hides them.
- 03
Design & systematize
Hi-fi screens and a design system together - components, tokens, motion in Rive - designed against how it gets built.
- 04
Hand off to Flutter
The design lands in real Flutter through paper.design, on utopia_hooks - implemented as designed, reviewed by the people who drew it.
- 05
Ship & iterate
It goes live as a running app, and the system carries the next round of changes instead of being redrawn from scratch each time.
common questions
Questions we get asked.
Do you also build the Flutter implementation, or just the design?
Both, by default - the same team designs the product and builds it in Flutter, which is the whole point of the offer. If you only need the design phase, that's available too, but the handoff is strongest when we carry it through.
How does the design actually survive implementation here?
Through paper.design, which carries Figma and Rive directly into real Flutter code - spacing, components, and motion land as designed because the same people who drew them review the build.
Can you work inside our existing design system instead of building a new one?
Yes - we design against how a system gets built in Flutter either way, whether that means extending what you already have or building a new system from research forward.
Is AI-accelerated ideation a real deliverable, or just a pitch?
It's real but bounded - tools like paper.design and claude.design help us explore directions and reach a working handoff faster. A person still makes every design call; the tools accelerate the craft, they don't replace it.
talk to us
Show us the product. We'll design what we can ship.
Send the brief or the existing Figma file. A founder reads it and replies within 24 hours.
Read our case studies