Wireframe the screens and map the flow between them
Device frames, form controls, content blocks, dialogs and toasts — plus the user flows, sitemaps and dashboards that hold them together.
Product designers
Three layouts before lunch, none of them precious enough to defend.
Product managers
The flow, annotated, living in the spec instead of in a screenshot pasted into it.
Researchers
The journey with the drop-off marked where it actually happened.
Why grey, and why now
Because a wireframe's job is to be wrong quickly, and polish makes that impossible. The moment it looks finished, the review is about the corner radius and nobody says the flow is broken.
Grey boxes buy you the honest conversation. A field is a box with a label, a card is a box with a line, and the only thing left to argue about is whether the sequence makes sense.
Keeping the flow on the same board as the screens is the other half: move a screen and the path follows it, and a stakeholder's comment lands on the screen it is about instead of in a chat thread three days later.
Start from the screen you need
Every card opens a board with those controls ready to go.
Every control, named
Screens & Navigation
Forms & Inputs
Content & Data
Feedback & Overlays
Also on the same board
Wireframe your first screen
Free, no install, no credit card. Bring the team when you're ready.
Start diagramming — free