Wireframes provide the opportunity to address problems early in the design phase, placing full focus on the User Experience apposed to spending valuable time iterating full colour visuals. Wireframes should be used at the beginning of the design phase to create the basic structure of the pages or screens.

Banner image that represents wireframing

What is a wireframing?

Wireframing is a way to design a product, service or application at a structural level. It should be used to lay out content, design complex functionality. The wireframes should be guided by understanding user needs through research and strategy.

Wireframes should be void of colour, using only white space and black lines to indicate form and layout. They should include written content, and very in terms of fidelity and level of detail.

Why use wireframes?

  • Clarify website features and functionality
  • Display site architecture visually and avoid the abstraction site maps
  • Place a focus on website usability
  • Support a iterative design process where products can be amended quickly
  • Quickly experiment with multiple ideas
  • Save valuable project time, with calculated designs that provide guidance for developers
  • Quickly turn wireframes into working prototypes
  • Provide a solid foundation and guidance for User-interface design and UI design toolkits
  • Building a website is evolutionary process. Wireframing is one of those parts of process that should not be skipped and doing so can have a detrimental effect on the end product, the live website or app.

    Looking to improve your UX?

    Whatever the challenge, whatever the stage. I’d be happy to discuss about how I might get involved in your project.