To a product designer, the choice of design approach impacts the success of the final product. Designing an application that is visually appealing won’t matter if the deliverable is functionally lacking. But how does a designer know which approach to choose? Whether it’s investing time in low-fidelity wireframes first or jumping straight into high-fidelity design, here are some tips to help choose the best approach for your project.

What is the difference between low-fidelity and high-fidelity design?

In low-fidelity design, you’re looking to create a visual that describes the story you started with the user journey and workflows. The emphasis is on the function, such as:

• Does this data belong on this page?
• Is it ranked correctly?
• Does the flow make sense?

Low-fidelity wireframes are rendered in grayscale, with no branding, and with only critical text included. Noncritical text is usually replaced with a solid bar or lorem ipsum, so that users can focus (or refocus) on the function and not get sidetracked by elements that are not important at this stage, such as the color of a button or which word appears in a dropdown. 

Because low-fidelity design does not focus on the details of content or style, it can also be executed more quickly than high fidelity. Of course, low-fidelity renderings, like hand-drawn sketches on paper, are not a final design but rather the start of a conversation.

High-fidelity design is neither the opposite of nor the complement to low fidelity. Instead, it is the next iteration, marrying form and function through the addition of color and style to the wireframes. That does not mean, though, that low fidelity is a required stepping stone to high-fidelity design. 

For mature products or new products in organizations with clearly defined design libraries, user experience designers can move directly to high-fidelity design with the understanding that style elements are an already approved standard and therefore will not be evaluated in either stakeholder reviews or the user testing process.

When would a designer start with low fidelity rather than moving straight to high-fidelity design?

There are two considerations that might impact a designer’s decision to start with low-fidelity design. First, low fidelity helps designers begin to explain the solution. Even for an established organization, if the complexity of the product and features requires a strong focus on function, choosing a simpler initial approach through low fidelity can ultimately increase speed to development by ensuring the data and the flow remain the primary focus.

The second consideration is that stakeholders might need help in understanding the design process. Whether for users who need to disconnect from expectations of a process in which they’ve “always done it this way” or those who might have no experience with product design, product designers can bring stakeholders along in the process by starting with low fidelity and then adding style through an iterative process.

When starting with high-fidelity design, what should designers be mindful of? 

Jumping straight to high fidelity might be the right decision for a given project. However, there are factors to consider when doing so, to avoid costly design errors. 

If the design library is still being developed, consider how elements currently under development might affect the page layout once finalized. On these types of projects, you might need to collaborate with visual designers and work in parallel.

If there is no design library, check with the development team to see if the front-end framework they’re using might have existing libraries that you’ll need to take into account in your designs. Material Design or Ant Design have defined components for menus, forms, and so forth. Many of these mature frameworks have corresponding Figma or Sketch files of their components, so you don’t have to reinvent the wheel.

In both of these cases, maintaining good communication is an important part of a successful design process.

Choose the approach that makes sense for the project.

Every project is different. Whether working with a new company or a longstanding organization, the choice between starting with low or high fidelity depends on more than an established design library. Every Stride user experience designer considers a project’s specific needs when determining which approach to take, to provide the best design process for a successful final product.