Stop Making that Shiny Mockup!

Mockups are amazing. Mockups are great! But that shiny mockup of yours lacks one very crucial aspect: functionality.

I know I am swearing in church. I am an Industrial Designer by education and UX Designer by practice. And my argument addresses both disciplines. In Industrial Design, mockups served one very important purpose for almost a century. They showed us how the final product will look and in — limited cases — how they will feel in the end. Before the profession of design emerged, the apprentice craftsmen simply learned how to make something from their masters and made minor improvements whenever possible. Always on the final product.

With Industrial Revolution, the planning process (instead of the making process) became the core of developing a product. Since identical copies of something was going to be made over and over again, there was a dire need for making an ultimate “prototype” of the product before expensive tooling investments were made. (The original meaning of prototype is literally ‘the first example’)

The mockup is a distant cousin of prototype, maybe more beautiful but not very bright. It emerged in Industrial Design as a way of confirming the outer shape, color and sometimes the feel of a product before the mass production and before even a prototype is made.

In User Experience Design, mockups show us how a product’s certain aspects will co-exist and intermingle. They show us transitions, they show us visual fluidity and even a glimpse of the actual experience if we are lucky. The terminology of mockup has been adapted by the UI/UX community almost naturally after its ID counterpart. Now the dominating search results for ‘mockup’ return a plethora of digital tools for mocking up interfaces. We have seen a flurry of discussions about this both on Medium and elsewhere recently.

So what is the difference between these two common terms and why am I making such a fuss about it?In the olden days, where prototyping was a godly gift that was bestowed upon only the mighty engineer, a prototype was something the designer got to play with only a few months before the launch of a product. Sometimes even after the public announcement! Today anybody, even with limited technical knowledge, can make prototypes. None of you need any proof for that. If tools like Arduino or InVision have not changed your outlook, you are seriously missing out.

Why Shiny Mockups Suck

A mockup sucks when it is made only for its looks. It is a waste of money, time and energy. A physical mockup that is revealed in a board meeting, kept in a cupboard and found in pristine shape after months. That is a real shame. I experienced this first hand for many years at Sony where majority of the ID mockups did not have moving buttons. These shiny, super slick pieces of glass, metal and plastic were not even tested in pockets. Sometimes, we treated them as the ultimate visual expression for the vision of a product. In some cases we even put them on an actual pedestal and admired them behind a glass or a screen…

We also made several AfterEffects animations that displayed beautiful screens and transitions. A digital mockup that is produced with much effort only to test 25 versions of a menu transition is also a waste. Especially if it does not lead to any learnings about the experience. If you have time to mock it up, you have time to prototype. Both in the digital and physical domains.

If you have time to mock it up, you have time to prototype.

A mockup is also that piece of code, that little foam that you shaped yourself or an Arduino with ugly cables sticking out. If it serves a functional improvement, it is a prototype. When we were designing SHFT, we went to extra lengths to prototype the real-time voice coaching experience instead of focusing on look and feel and this approach proved to be extremely beneficial at the end.

My beef is with shiny and expensive mockups that lead to no usability or actual experience learnings. These are typically ideal tools for marketing, product management and line management who like playing with things that give them the feeling of something final. So let’s see what is actually wrong with this:

1- That shiny mockup which looks final is faaaaaar from final.

It will give you a great impression of a feature but that feature might be very hard to build, expensive to ship and a shiny mockup of it will depict a vision that is misleading. Make a prototype instead.

2- That shiny mockup is expensive.

The time spent on polishing that corner or that transition is better spent on the actual experience instead. The design solution has zero value until proven in action with people and technology. A prototype has a much better return-on-investment.

3- That shiny mockup is false hope.

Spend your focus and energy on discussing how that beautiful corner or transition can be realized with engineers instead. Learn the ins and outs of your platform or the limitations of your production system. This is better achieved by — yes you guessed it — making a prototype instead.

Today, with the rapid advances in tech, we are coming closer and closer to simulating a final user experience of a product or service, earlier and earlier in the process. Whether you are in Industrial Design or User Experience Design, any second that you spend on prototyping an experience is much better spent than polishing up the appearance of the product. Please spread the word if you agree. I’d love to hear from you if you don’t.

Happy hacking!