Is wireframing necessary?
Back in the day, we were all using wireframes. Schools taught it, and we used it. But is wireframing necessary today? Opinions differ a lot. Here’s what I would say after working in UX for years.
To determine whether or not wireframing is still necessary, we’ll look at what are wireframe is and, most importantly, the main reasons to use one. Once we know that, we can figure out if wireframes still serve a role in today’s world of UX.
Table of Contents
Is wireframing necessary?
Wireframes are a necessary step in the early stages of your design project, where the scope and concept aren’t fully defined yet.
In that phase of the project, creating a few quick wireframes can help you and your stakeholders go from multiple unsorted ideas to one concept to further validate and develop.
Once you’re past that phase and more focussed on UI and UX, creating more wireframes isn’t necessary. It is optional if you want to. In some teams, developers only need wireframes to understand what to build, for example.
Remember that your design will change, and you will need to do revisions, even once you go past the wireframing phase. However, there’s often insufficient time and budget to do both wireframes and UI design for every project iteration.
So, should you use wireframes? Are they necessary? Let’s take a closer look at reasons for and reasons against wireframes.
Reasons to use wireframes
After working in UX for years and recently talking to dozens of UX designers on Reddit about the necessity of wireframes, you can conclude that there are two main reasons for using wireframes.
One of the biggest advantages of wireframes is the speed at which you can create them. For example, creating a user flow with multiple screens in wireframes can be done in just a few hours.
This comes in handy when you’re in the early stages of a project. During that phase, requirements are unclear, and spending a lot of time making a high-fidelity is risky.
Chances are that you have to do a lot of rework, which is a waste of your time.
Wireframes help you focus. More importantly, it allows stakeholders to focus. The main characteristic of a wireframe is the lack of color. You use greyscale instead.
Imagine showing your stakeholders a full-color design during the early stages of your project. While a lot of requirements are unclear, your stakeholders might start to ask questions about the colors or fonts you use.
As a designer, however, you are just sketching and trying to figure out the main patterns and navigation. If you use a greyscale wireframe here, the question changes from “why do you use blue here?” to “what color could we use here?”. The second question is more valuable and shows one of the reasons why wireframes are necessary.
The main reason not to use wireframes
Years ago, before most designers started to use Figma, we used separate tools for prototyping and wireframes.
You would work on wireframes in Omnigraffle or Balsamiq, for example, and once you were done, you would start over in Photoshop, Adobe XD, or Sketch.
This takes a lot of time. Imagine getting a lot of feedback during a sprint review or user test. Would you go and start over again in your wireframing tool?
In theory, that would be the best way to do it, but who has the time for that? In practice, there’s no time to do such things. The best-case scenario is that you’re allowed to create wireframes once and move on.
Working on wireframes for too long used to be too expensive. However, this is no longer the case. Today, most designers use Figma. As a result, you can do entire design projects within Figma.
This eliminates the discussion of whether or not wireframing is necessary. Instead, we should ask ourselves what a wireframe is and to what level we need to utilize this skill.
What is a wireframe?
In this article, we’ve so far found out that there is a need for creating something that’s focused and quick to make. It helps you and your stakeholders ideate before spending a lot of time and money working on high-fidelity pixel-perfect designs.
And that’s where wireframes come in. But what is a wireframe? The main concern here is the level of detail you should put in. In UX, we call these low-fidelity and high-fidelity wireframes.
- In case you’re in the early stages of your product, working on low-fidelity wireframes is the way to go. There’s no need to add too much detail yet.
- However, going for a high-fidelity wireframe makes more sense when you’re close to the development team. The level of detail helps developers get started.
One thing’s for sure; you design a wireframe using a greyscale color palette. That way, you can focus your attention on interaction, navigation, and user flow.
Do you use wireframes as a UX designer?
Recently, I’ve asked designers on Reddit if they thought wireframes were necessary. With over 17,000 views and close to 70 comments, it is a hot question within the UX community. Here’s a list of the best takeaways.
- If you have a design system, see if you can use a greyscale version of it to create a quick wireframe. That way, it is easier to transition from wireframe into pixel-perfect design later.
- Wireframes are the quick and dirty first version of your design. It is a great way to work on the first flows, layout, and navigation. Colors, fonts, and other details aren’t so important yet.
- There are a lot of design roles where creating wireframes is a very large part of your daily work.
Wireframing is an excellent way to get started on a project. In today’s UX world, creating a quick first version of your ideas is necessary as it helps you get started. It helps you communicate your ideas with stakeholders as well.
Are you working in design? Or looking to learn about UX? Learning about wireframes is something I would include on my list of necessities.