Wireframing
Design Processes
The initial visual representation of a design, focusing on layout and structure, typically devoid of detailed design elements, to outline the basic framework. Wireframes serve as a blueprint for the overall design and help in early planning and communication of design ideas.
In practice
Focuses on creating basic, low-fidelity representations of a design's structure and layout to establish a foundational framework. Wireframing is particularly useful in the initial stages of web or app design, providing a visual guide for the project team and stakeholders. It serves as a starting point for collaborative discussions, helping ensure a shared understanding of the design's layout and user flow.
Questions
What is Wireframing?
Wireframing sketches the structure of an interface — what goes where, at what priority — without colour, imagery or final type.
Why do you use Wireframing?
Stripping the visuals keeps the conversation on structure and content, which is where the important decisions are.
How do you use/apply Wireframing?
Keep the fidelity deliberately low, use real content rather than placeholders, and move on once the structure is agreed.
When do you use Wireframing?
After information architecture and before visual design.
Who uses Wireframing?
Product and interaction designers.
