Prototyping
What it is
A prototype is a clickable or coded draft good enough to put in front of real users. It is not a specification and not a demo: its only job is to answer a question that a wireframe or a conversation cannot. Fidelity is chosen from the question, not from the tool or the team’s mood.
Why it matters
Arguments about wording, order and behaviour are settled in minutes by watching someone attempt the task and in hours by discussion. A prototype is the cheapest artefact that produces that evidence. It also exposes what a static layout hides — a missing state, a dead end, a flow that takes seven screens — while the cost of change is still a redraw rather than a rewrite.
In this track
- Prototype fidelity (03-design-ux/40-prototyping/01-prototype-fidelity) — choosing what to build at which stage, from paper to coded.
- Testing a prototype with real users (03-design-ux/40-prototyping/02-testing-a-prototype-with-real-users) — running the session so the prototype produces evidence rather than compliments.
Prerequisites
- Wireframing (03-design-ux/27-wireframing)
Go deeper
- Wireframing (03-design-ux/27-wireframing) — the static structure a prototype brings to life.
- Usability Testing (03-design-ux/33-usability-testing) — the session technique, moderating and severity, in full.
- Interaction Design (03-design-ux/44-interaction-design) — what to decide about states and feedback before prototyping them.
- Framer (03-design-ux/36-framer) — one tool that publishes interactive prototypes close to production.