Skip to content

Fidelity grows with understanding

The wireframes at this stage start rough — boxes for content, labels for buttons, no icons, no real copy, no spacing decisions. The discipline is about resisting the pull toward full fidelity before the flow has been validated. But "rough" does not mean ugly or disposable. Modern design tools make it fast to produce clean, mid-fidelity screens — and there is no reason to avoid that if the team's design system is in place. A clean screen built from design-system components communicates flow just as well as a hand-drawn box, and it is closer to what will ship.

What matters is not the visual polish — it is what is decided. Full fidelity means every in-between state is drawn, every micro-interaction is specified, every content variant is accounted for. That level of detail early is expensive to produce and expensive to change. The discipline is to decide the flow and the states first — which screens exist, what transitions connect them, which edges matter — and let the visual detail fill in as the understanding deepens.

The deliverable of design shaping is a prototype, not static screens. Static wireframes show what things look like. A prototype shows how they flow — the transitions, the states, the moments where Gal pauses, decides, and moves forward. A developer who clicks through a prototype understands the activity. A developer who reads a set of static PNGs understands each screen in isolation.

Fidelity grows in steps, aligned with the shaping conversation. Initial flow exploration can be rough boxes. Once the flow is validated in the trio conversation, the designer builds it up to mid-fidelity — design-system components, real layout, placeholder content. Full fidelity — real copy, final spacing, interaction details, all edge states drawn — comes after amigos, for release-1 stories only. Release-2 stories stay at whatever fidelity they reached when the conversation paused.

Next — The design system and stories →

200apps · How We Work · NWIRE