Wireframes vs Mockups vs Prototypes

Summary

Wireframes are low-fidelity structure, mockups are high-fidelity static visuals, and prototypes are interactive simulations of the real flow — each fits a different stage of the design process.

• 1Find examples of each fidelity level for the same hypothetical screen.
• 2Learn when it's wasteful to jump straight to a high-fidelity mockup.
• 3Understand why prototypes are what you'd use for a usability test, not a mockup.