Why wireframes are becoming obsolete

March 30, 2020

A couple of weeks ago, I posted a short excerpt from Basecamp's Shape Up called Wireframes are too concrete. It highlights something that I've been experiencing over the past years, but never really got round to writing about — do wireframes still serve a purpose?

Wireframes are the middle ground. They're not sketches, but they're not high fidelity designs either. They're intentionally designed without color. A wireframe simply attempts to be an accurate representation of layout and information architecture while intentionally avoiding high visual and content fidelity.

The argument around wireframes

So why do we still keep planning for a phase of wireframing in so many projects? The purpose and argument for wireframes often fall in one of three buckets:

  • Wireframes focus attention on usability instead of aesthetics. They prevent stakeholders from derailing meetings over irrelevant details like button color and allow user testing to focus on interactions instead of visuals.
  • Wireframes are faster to create. They keep things conceptual and avoid the risk of getting too invested or attached to a particular design direction.
  • They're a tool for detailed documentation of interactions without the additional overhead of visual design. (for enterprise level users)

Let's we break these arguments down one by one:

1. Wireframes and stakeholders

I think most stakeholders over the past years have evolved a ton when it comes to reviewing and giving feedback on digital products. It's extremely rare nowadays to be in a meeting where the conversation derails over things like button color. And even if they do, any good designer should be able to shift the focus to more relevant discussions.

2. Wireframes are faster to create

When there's a design system available, I find that creating high fidelity designs is faster than creating wireframes. Most of the elements are already created so dragging and dropping them is, of course, more efficient than creating ones from scratch, even if they are just black and white.

With collaborative tools like Figma, the matter is even further simplified. In most projects I'm working on these days, I'll give my client access to Figma and, within days, I can see them trying stuff out. This makes collaboration fundamental in the relationship and takes a lot of pressure out of the meetings and presentations when you've created something together.

3. Wireframes are a simpler tool for documentation

The argument that wireframes serves as a tool to disregard visual design might be true, but that doesn't really make it a valid one. During my 20+ years in this industry, I'm not sure I've ever worked on, or even seen, wireframes that detail documentation of interactions — unless you're talking about 'links', but a high fidelity design absolutely do that.

First of, I don't think I've ever worked on wireframes that transferred truthfully into a visual design without moving or at least slightly re-arranging some of the elements. And if you're moving things around from the wireframes - and hence, breaking the structure and hierarchy that the wireframes were supposed to communicate - then what's the point in the first place?

I’ll give a wireframe to my designer, and then I’m saying to her: “I know you’re looking at this, but that’s not what I want you to design. I want you to re-think it!” It’s hard to do that when you’re giving them this concrete thing.Shape Up

What do I do instead of wireframes?

Instead, try sketching. I know what you may say, I can't draw. That's completely fine! If you'd see some of my sketches, you'd understand that you don't have to be able to draw. What you should be able to do, is communicate.

Here's something I shared with my SuperFriendly team. You can see that this is very rough, but you probably get the idea of roughly what I'm trying to communicate. This is arguably much faster than wireframing, and more importantly, it allows the team to focus on their expertise.

Work in the shaping stage is rough. Everyone can tell by looking at it that it’s unfinished. They can see the open spaces where their contributions will go. Work that’s too fine, too early commits everyone to the wrong details. Designers and programmers need room to apply their own judgement and expertise when they roll up their sleeves and discover all the real trade-offs that emerge.

No designer likes to get a wireframe, only to apply color. No developer wants to get a design that doesn't leave room for their own judgement and expertise. Teams that collaborate flourish. When you intentionally leave room for discussion, that's when magic happens.

It’s honest, authentic, and accessible.

I love sharing my experiences working in design and what’ve I’ve learned along the way. Join a community of thousands of designers, developers, and product professionals by signing up to my newsletter!

Not quite ready to sign up? I totally understand! Why not start by reading some of my past issues?

Great! Just “one more thing”...

You need to confirm your email to confirm your subscription.

  1. March, 2024

  2. February, 2024

  3. January, 2024

  4. December, 2023

  5. November, 2023

  6. October, 2023

  7. September, 2023

  8. August, 2023

  9. July, 2023

  10. June, 2023

  11. May, 2023

  12. April, 2023

  13. March, 2023

  14. January, 2023

  15. December, 2022

  16. November, 2022

  17. September, 2022

  18. August, 2022

  19. July, 2022

  20. June, 2022

  21. May, 2022

  22. April, 2022

  23. January, 2022

  24. December, 2021

  25. November, 2021

  26. October, 2021

  27. September, 2021

  28. August, 2021

  29. July, 2021

  30. June, 2021

  31. May, 2021

  32. April, 2021

  33. March, 2021

  34. January, 2021

  35. November, 2020

  36. October, 2020

  37. September, 2020

  38. August, 2020

  39. June, 2020

  40. May, 2020

  41. April, 2020

  42. March, 2020

  43. February, 2020

  44. January, 2020

  45. December, 2019

  46. November, 2019

  47. October, 2019

  48. September, 2019

  49. August, 2019

  50. July, 2019

  51. June, 2019

  52. May, 2019

  53. April, 2019

  54. March, 2019

  55. February, 2019

  56. January, 2019

  57. December, 2018

  58. November, 2018

  59. October, 2018

  60. September, 2018

  61. August, 2018

  62. July, 2018

  63. June, 2018

  64. May, 2018

  65. April, 2018

  66. March, 2018

  67. February, 2018

  68. January, 2018

  69. December, 2017

  70. November, 2017

  71. October, 2017

  72. September, 2017

  73. August, 2017

  74. July, 2017

  75. June, 2017

  76. May, 2017

  77. April, 2017

  78. March, 2017

  79. February, 2017

  80. January, 2017

  81. December, 2016

  82. November, 2016

  83. October, 2016

  84. September, 2016

  85. August, 2016

  86. July, 2016

  87. June, 2016

  88. May, 2016

  89. April, 2016

  90. March, 2016

  91. February, 2016

  92. January, 2016

  93. December, 2015

  94. November, 2015

  95. October, 2015

  96. September, 2015

  97. August, 2015

  98. July, 2015

  99. June, 2015

  100. May, 2015

  101. April, 2015

  102. November, 2014

  103. April, 2013