1. Home
  2. Docs
  3. Chapter 21. User Experience Design
  4. 1. Wireframe

1. Wireframe

Download PDF

What is Wireframing?

Wireframe, also known as a page schematic or screen blueprint, is a visual guide that represents the skeletal framework of a website or a screen of an application. Wireframing are used early in the development process to establish the basic structure of a page before visual design and content is added. The aim of wireframes are to provide a visual understanding of a page early in a project to get stakeholder and project team approval before the creative phase gets under way. Iterating the development of the wireframes to a final version will provide the client and the design team confidence that the page is catering to user needs whilst fulfilling the key business and project objectives. It is quicker and cheaper to review and amend the structure of the key pages in a wireframe format.

Image result for wireframing ux design visual paradigm

Wireframing for Different Purposes

Wireframes may be utilized by different disciplines include business analysts, information architects, interaction designers, user experience designers, graphic designers, programmers, and product managers. For example:

  • Developers use wireframes to get a more tangible grasp of the site’s functionality, while designers use them to push the UI design process.
  • User experience designers and information architects use wireframes to show navigation paths between pages.
  • Business Analysts use wireframes to visually support the business rules and interaction requirements for a screen.
  • Business stakeholders review wireframes to ensure that requirements and objectives are met through the design.