Wireframing and Prototyping
Overview
Wireframes and prototypes are thinking tools. The goal is learning and alignment, not pixel perfection at every stage.
When to Use
- Exploring layout and flow options quickly
- Aligning product, design, and engineering on structure
- Preparing interactive prototypes for usability tests
- Reducing expensive rework later in the cycle
Fidelity Guidance
- Low — Structure, hierarchy, flow (fast, disposable)
- Mid — Key interactions and content priority
- High — Visual design + interaction detail for final validation or handoff
Principles
- Match fidelity to the question you’re answering
- Prototype the riskiest or least-understood interactions first
- Keep early artifacts easy to change
- Annotate intent when static wireframes hide behavior
- Don’t polish work that hasn’t been validated
Verification
- Artifact answers a specific design or product question
- Stakeholders understand what is decided vs still open
- Prototype is sufficient for the planned test or discussion