An icon representing paper prototyping

Wireframing

Visualise your interface, focusing on structure and layout

Project Stage:
Develop

Who:
Customer
Decision makers
Service Providers

Design Principles:
09. We will build, test, learn & iterate  10. We will work to make things simpler 



Wireframing is a method used to create low-fidelity, schematic representations of a digital service or interface. It focuses on the layout and structure rather than the design’s look and feel. This helps teams quickly iterate on the service’s functionality.

Use it to

  • Visualise the basic structure and layout of a digital service or interface.
  • Identify potential usability issues early in the design process.
  • Iterate on the service’s functionality before committing to high-fidelity design.

Top Tips

  • Keep wireframes simple and focus on functionality, not aesthetics.
  • Use wireframes as a communication tool between designers, developers, and stakeholders.
  • Iterate based on feedback before moving to more detailed design work.

How – to

  • Sketch the layout of the interface or service, focusing on key elements.
  • Review the wireframes with stakeholders or users to gather feedback.
  • Iterate and refine the wireframes based on feedback.

Related Methods

An icon representing stakeholder maps

Stakeholder Maps

An icon representing Wizard of Oz

Wizard of Oz

An icon representing dot voting

Dot Voting

Add your title here

Lorem ipsum dolor sit met conjectural