Wireframes: Your Product’s Blueprint

Why wireframes are important in your product’s success

Navid B.
VMware Design
Published in
4 min readMay 3, 2018

--

We have all heard countless times how important wireframes are for designers, but low fidelity designs are just as important for all the other stakeholders (developers, product managers, and executives, to name a few). In this article, I will highlight the importance of using wireframes, especially for non-designers, and how getting past the challenges of using low fidelity designs can help benefit organizations (the terms wireframe and low fidelity design are used interchangeably here).

Let’s start by defining what a wireframe is. A wireframe is an illustration (hand-drawn or digital) of a product’s interface that focuses on the layout, available functionalities, interactions, users paths, and information architecture. They typically do not include any styling, color, or graphics.

In a sense, creating a product is similar to the construction of a building. Before pouring concrete or laying the first brick, or even thinking about the colors of the walls, you need a blueprint. In the construction industry, this blueprint (a.k.a. floor plan) shows the relationships between rooms, spaces, traffic patterns, and other physical features at one level of a structure. In the design context, wireframes serve as the blueprint, while the high fidelity screens are analogues to the interior and exterior design of the building.

Just like you wouldn’t build the walls or try to put a coat of paint over them before deciding on the floor plans, you shouldn’t move onto higher fidelity screens before finalizing or at least discussing the wireframes with your team.

The importance of low fidelity design

Efficiency is the most important aspect of using low fidelity designs. It’s much more efficient and easy to iterate and change ideas while they are still on paper or a whiteboard. Starting your project this way will help everybody to catch problems early on and revise until all [or most of] the stakeholders feel confident about the proposed solution.

It will be much more costly (time, money, and resources) down the road to make additional changes or completely change direction if we didn’t start with wireframing. Design and development cycles take time and are not free. Multiple rounds of reviews are normal in a typical project, and it’s almost impossible to get the design right on the first attempt.

In short, low fidelity designs offer a small upfront investment with a high return on investment.

Challenges of presenting low fidelity designs to non-designers

Oftentimes, stakeholders, especially those who are decision makers, see wireframes as incomplete and unpolished. To them, the idea of something being presented that looks rough and full of caveats seems wrong (e.g. “Why does everything look so gray? Can you give it a little more pop?”).

The other challenge is that some developers take wireframes too literally and start poking holes in the design, by bringing up style related issues (e.g. “Is this the font we are going to implement?”)

Sometimes, the issue lies within the wireframes themselves. Executive levels are more visual and when they see very detailed wireframes they get lost. Thus, it is important to keep your wireframes simple and save the minute details for later on.

How enterprise companies like VMware are benefiting from low fidelity design

At VMware, we use the power of low fidelity design to help us iterate and improve on our designs and reach consensus faster. Enterprise software oftentimes involves complex technology, which in turn leads to complicated interfaces. By starting with low fidelity sketches or mockups, we have been able to considerably cut down on the amount of time that is needed to prototype and test our design ideas.

Additionally, this approach gives the stakeholders a chance to be involved early and often in the design process. They get to see how projects evolve, especially when they become concerned about the progress and timelines. With this approach, stakeholders are able to understand why and how decisions are being made. This visibility into the design process and the opportunity for involvement has increased their confidence and trust in the value of design thinking [in general] as well as in the value of low fidelity design.

Once stakeholders are happy with the direction and our rationale at the sketching phase, higher fidelity prototypes are then the next step, which can be used to get a better ‘feel’ for the interface.

By the time we get to the high fidelity stage, we have done many low fidelity iterations to solidify the design direction. That way we don’t end up ripping apart (or demolishing) the finished building in case there is a need for major structural changes. Instead, we simply go back to the drawing board and make changes to our blueprint. 😉

--

--