What is wireframe?

A wireframe is a design that is not yet beautiful. It provides a simple and structured representation of the layout of elements in a web page or application user interface. Its main purpose is to help the team lead meaningful conversations about its design in the early stages of the project, uncover potential problems, and make quick changes. It is also often used for the first rounds of user testing.

A wireframe can be very simple (low-fidelity wireframe). It is often created as part of brainstorming and conceptualization. It is based on text and simple geometric shapes. A more detailed (high-fidelity) wireframe, often already created in a graphics program like Figma, is a more credible representation of the final design. Its creation can be accelerated by using a UI Kit. An interactive prototype can also be created from it for user testing.