What is a Prototype?

Prototypes are an interactive, navigable version of a wireframe. Rather than having only static design elements, prototypes bring the design to life and allow you to start to envision the user journey. Prototyping is a crucial phase of any design project, as it simulates (at a high level) how the final product will work.

Once website or product wireframes have been created and approved by stakeholders, the design team moves on to prototyping.

Benefits of Prototyping

Prototyping has many benefits and it’s recommended that you take advantage of it whenever you approach revisions or additions to your design. Here are a few of the benefits.

  1. Prototyping clearly presents design ideas and can bring to light strong and weak design elements.
  2. Prototyping highlights design elements that may have been accidentally omitted in the wireframing process.
  3. Prototypes can be easily shared with your team and stakeholders, and they provide everyone the opportunity to review, experiment with, and provide feedback on the design.
  4. Prototyping builds confidence in the success of the design. The more detail stakeholders can see and approve throughout the design process, the smoother the path to the end product will be.
  5. Prototyping can save time and money by identifying errors or oversights early in the design process before the website or product heads into development. The later revisions take place, the more time and effort required.
Types of prototyping

There are two common types of prototyping: Low-fidelity prototyping and high-fidelity prototyping (fidelity refers to the level of detail included).

Low-Fidelity Prototyping

Low-fidelity prototypes are simple, quick, and they allow for changes and updates to be easily made. Typically done using pen and paper or with a basic online design tool, they include the bare minimum of functionality and design and allow stakeholders to see the general idea and identify specific likes or dislikes. The drawback to low-fidelity prototyping is that it is far from the actual product, and it can be difficult for some stakeholders to visualize future functionality.

High-Fidelity Prototyping

High-fidelity prototypes are far more detailed and are typically done digitally with an online design tool. These prototypes are very close to the actual finished product and include a high degree of design aesthetics and functionality. Because of the added detail, high-fidelity prototypes require more time and effort to create, and it can be more challenging to make revisions to them.

Related Terms

Brand Strategy

Brand strategy involves translating your technical offering into a clear value proposition and backing it up with a messaging framework and brand personality you can own.

Anchor Text

Otherwise known as link text, a link title, or a link label, anchor text can be described as clickable words or phrases within a hyperlink that connects two web pages.

Search Engine

Database tools that help users find content on the World Wide Web. Once a user enters a keyword or search query, search engines curate a list of the most relevant webpage URLs, images, or videos, known as the Search Engine Results Page (SERP).