A visual guide that represents the page structure, as well as its hierarchy and key elements. Useful to discuss ideas with team members and clients, and to assist the work of designers and developers.
The purpose of any particular wireframe varies slightly by the people creating or using them in any company. Whether sketched, “grey boxed”, wireframed in a graphic editor or in a dedicated wireframing and prototyping tool like UXPin, the same information can be conveyed. Therefore, it’s less about the tool and more about how fast you can convey the information you need to others.
Interaction & UX Designers and Information Architects use wireframes to show user flows between views or pages. Typically, a combination of flowcharting, storyboarding and wireframing are used to achieve this.
Graphic Designers use wireframes to push the user interface (UI) development process. It can inspire the designer, resulting in a more fluid creative process. And is ultimately used to create graphic mockups, interactive prototypes, and the final design. Typically, a combination of sketching, storyboarding and wireframing in low or high-fidelity are used to achieve this.
Developers use wireframes to get a more tangible grasp of the site’s functionality. It gives the developer a clear picture of the elements that they will need to code.
For back-end development, wireframes can be low-fidelity the way a ux designer or information architect might produce them – they care more about product structure, functionality and behavior.
For front-end development, it’s more helpful to have high-fidelity wireframes a designer would produce – they care about content and information hierarchy as much as the structure, functionality and behavior.
Business Analysts use wireframes to visually support the business rules and interaction requirements for a screen.
Depending on the business, industry or the analyst’s specific role, they will care more about only one or two of the following – structure, content, information hierarchy, functionality and behavior. For example, an advertising or content analyst probably cares more about content, functionality and behavior whereas a regulatory analyst may care more about information hierarchy or structure. However, it varies too widely to say.
Internal Business Stakeholders (ex: Product Managers, Project Managers and Executives) review wireframes to ensure that requirements and objectives are met through the design. This fits into their overall product strategy and scope of a specific project or set of projects. It gives managers an early, close-up view of the site design (or re-design).
External Business Stakeholders (ex: Partners and Clients) also review wireframes to ensure that requirements and objectives are met through the design. It gives managers an early, close-up view of the site design (or re-design).