A Wireframe is a visual schematic that conveys a basic level of communication, structure and behaviour during the design of a system. Wireframes are low-fidelity designs that bypass including a detailed user interface or visual design, conveying just enough to get across the core idea.
Wireframes are used in a design process to quickly agree on a direction before more time-intensive design processes are undertaken. Wireframes may take the form of hand-drawn sketches, visualisations made in software or coded pages.
In the case of a website, a wireframe might depict the navigation structure, page layout, content and calls to action. Using a collection of wireframes showing multiple pages in a website allows a simple prototype to be constructed to simulate navigation. In the case of a product, wireframes might convey a series of steps in a process, illustrate functionality or behavior of interface elements. With enough steps wireframed, one can create a simple interactive prototype that simulates the functionality of a user journey.
Wireframing may be carried out by any member of the design team, but is often the responsibility of someone closely connected to the planning, user experience, user interface design or development of the system being designed.
Synonyms
Schematic
Sketch
Blueprint