Before you are quick to judge, hear me out. I’m not saying that wireframes are a waste of time–they do have its place–but after working in this industry as a UI/UX designer for over 9 years, I no longer believe that wireframing should be a mandatory process.
- Tools are advanced enough these days to quickly go from sketch to high fidelity comps.
Tools are good enough these days that it’s not an issue of time to go from a sketch to a more high fidelity comp. Prototyping tools such as Figma, Invision, Axure, Balsalmiq, etc. as well as design tools like Sketch, Adobe Photoshop, Illustrator, In Design, Omnigraffle, etc. make it so much easier to take a concept and develop something more concrete with higher fidelity. Most are intuitive enough that it doesn’t require a huge learning curve to start mocking up a quick concept.
The whole point of wireframes is to help people stay focused on the content and not so much of the style. But the challenge of using it for that purpose is that ultimately, as soon as you bring style in, everyone will still have those opinions. At some point, you’re going to have to discuss layout, structure and design so it’s better to just get that out of the way sooner and iterate on that as opposed to thinking of UI/UX separately.
2. Wireframes are not complete solutions
Design is not just about painting the wires. A lot of the functionality and structure may change in the design phase. In some companies I’ve worked at, they asked me if development can start after the UX is done or whether they have to wait for UI to be done. In their minds, design is just the look&feel whereas UX is about functionality and flows (e.g. how you click a button and where that takes you). But from my experience, there’s a lot of evolution that happens in the design phase.
Design is not the icing the cake–it is the cake. Designers don’t just take the wires and apply color and styles to it. They actually rethink the strategy, explore options and play with the layout to arrive at the best solution. UI Design is all about creating meaningful and delightful experiences and every decision is intentional and functional.
There are some people who think wireframes should only be black and white, but sometimes it is necessary to use color to indicate an error state, or call out something. For example, I wanted to display traffic in a text and needed to use color (green, yellow and red) to visualize this. I could use black text and just annotate it but using color was a faster and more effective way to communicate this. Another reason why designing earlier in the process in tandem with wireframes is great is that it gives you the advantage of seeing the final product in pixels. Wireframes are not scaled properly and sometimes would have more information than the real estate allows. So the client may love the wires and sign off on it, but as the design gets tested in real pixels, the layout may change. It could end up looking very different from the original wires.
3. Process model is flawed
This is common especially in agency world, but there seems to be separate departments and roles for UI and UX. They hire certain roles for Strategists, IA, UX, UI, developers, and they usually work with specific tools. UX designers would work with Axure, for example, and UI designers turn that into Photoshop or Sketch comps. And although they may all collaborate, from a work process perspective, wireframes still often sit at the very beginning and design does not start until wires are done. This model to me, is flawed. Dividing design and wireframes is not necessary. You can find a lot of people who can do both. I am one of those hybrid designers and I often alternate between sketching and designing, using the right tool for the problem at hand. Diogenes Brito, Product Designer and Engineer at Slack talks about this perfectly.
“The big thing for us is not whether we do a wireframe, mockup, or high fidelity prototypes. It’s about thinking about the question and using the best tool to arrive at the answer with the least amount of work… Sometimes we go right to design from sketching because we know our product so well. We use whatever tools we are the fastest in–and that varies from paper, Keynote, HTML, to collaborative design platform depending on the project.”
Especially in an agile workplace environment, if there are several iterations on a similar project, it doesn’t make sense to start from scratch when the design was already done. Doing wireframes AFTER design is not logical (I have seen this happen).
4. When to do wireframes
There is definitely a place for wireframes and I do wire for certain things. For example, when I’m working on a new concept or feature that doesn’t exist in the current product, I would always start by sketching and wireframing using Axure. But when I’m working on a project that is a continuation of previous sprints, I find it doesn’t make sense to revert to wireframes when UI designs already exist. It actually confused people when things were wired out–it made it look like a new thing. So in those cases, using screenshots or the latest design made more sense.
So when are wireframes more suitable? Several key factors must be taken into consideration: time and budget, project phase, complexity and audience sophistication level. Is there sufficient time and budget available? UX takes time and is not free. There will be rounds of reviews. What is the best way to communicate the story/idea? User flows? Sketches? Depending on the level of complexity and scope, you may need low or high fidelity visuals. And finally, consider who the audience is. Typically, clients or CEO or exec levels are more visual and when they see detailed wires or user flows they get lost. But if it is someone who is close to the day to day project, they may understand more deeply.
It’s time to reconsider the conventional model of Strategy › IA › UX › UI › Development › Launch/Release. Every project is different and depending on the questions above, the level of fidelity should be tackled on a case by case basis.
Noah Levin on why he no longer believes in wireframes: https://spec.fm/podcasts/design-details/53776
Garett Dworman. (2014). When to Prototype, When to Wireframe–How Much Fidelity Can You Afford?
Joseph C Lawrence. (2013). Wireframing is Out, Prototyping is in: Here’s Why
UX Pin. (2016). UX Design in Action