UX Glossary Process & Methods

Wireframe

Process & Methods

A low-fidelity blueprint of a screen or page showing layout, structure, and the arrangement of interface elements without visual design details. Wireframes communicate design intent quickly, facilitate early feedback, and allow structural decisions to be made before investing in visual polish.

Wireframing for UX: What it is and how to get better at it·UX Mastery·6:09

Common contexts

Use when

Use wireframes when structural layout decisions need to be made and validated before any visual design investment — they're the fastest artifact for getting specific feedback on hierarchy, content organization, and flow logic without stakeholders fixating on colors or typography.

Avoid when

Don't use wireframes when the design challenge is primarily visual or interaction-quality — testing whether an animation feels right or whether a data visualization is readable requires fidelity that wireframes can't provide. Low fidelity is only useful when the question being answered is also low-fidelity.

Wireframes fail most often when they're too detailed — the more effort visible in a wireframe, the more reluctant stakeholders are to suggest structural changes, which defeats the entire purpose of working at low fidelity.

Real-world examples

Related terms

Prototype Design Sprint Information Architecture Storyboarding Wireflow
← Browse all UX Glossary terms