Fake it Till You Make it

The Rise of Prototyping

--

Exploring how mankind started to develop prototypes for almost everything helps us as designers to understand the importance and impact of this habit in our day-to-day life.

How everything began

Before we actually were aware of the fact that we are producing prototypes, humans always learned from failure and improved on that learnings. We always tried and tested and evaluated. From the first tools that were created by our early ancestors or even the invention of the wheel.

But also great scientists were using prototypes to prove and to showcase their innovative ideas. People like Leonardo da Vinci also needed to meet the expectations of their commissioners.

And while they did not have a broad array of tools for that, this task was even heavier to accomplish. But in the end, the exercise saved money and time, two essential aspects everyone knows and the most important factors in professional life to this day.

Let’s Talk About Aviation

Despite many setbacks, early aviation pioneers impressed with their enormous courage to keep on experimenting while risking their health.

Aviation Prototype

And just by looking on the progress made in aviation throughout the last 100 years, the impact of prototyping and learning from failure is impressively unmissable.

Coming from clumsy tinkered apparatus to the final extent of what we call high-end technology, actually overcoming the physical barriers of human transportation, and enabling us to fly around the globe in just a few hours. This is quite sensational.

Similarities

Of course, not every project can be compared with the invention of a plane. But surely you can compare yourself, as a digital product designer, with early aviation pioneers. You are not risking your own life but rather taking a big risk for your career, your budget, or your image. And still, taking a risk is a big challenge for most of us. Broken down, you could say: Launching a product is like jumping from a cliff.

Jump From the Cliff

You’re taking the risk of blaming yourself in front of a big audience. But also of successfully showcasing the break-through you’ve been working on for a long time. And as aviation shows, it’s absolutely worth it. Just keep it scaled down nicely and in a secure environment so that failure cannot ruin the entire project. But also, think when choosing your battles, as oftentimes you only have one shot. And the risk should seldom be so big that it endangers the business.

It’s all about failing cleverly and keeping the overall target in mind.

Success is only the destination which requires failure to get there.

—Henry Ford

Knowing that you can build up a mentality of embracing failure. Be open for being challenged and keep challenging your teammates. The chances for your business through an atmosphere of thoughtful failing are apparent. As long as you keep failure survivable it will soon become normal and as a consequence, the entire productivity will increase.

Million Ways to Prototype

The first question about prototyping is about its purpose. Do you want to visualise? Do you want to test? Or do you want to evaluate and iterate? Depending on this you want to pick your prototyping method.

But we’re lucky: there are tons of tools and methods available to pick from that can easily be used for your very own purpose.

While Paper Prototypes are a nice tool for creating quick visualisations, Storyboards might be a good idea for social interaction topics. If you need to simulate complex behaviours, you might want to use the Wizard of Oz technique. And just like that, the list is constantly growing. More recently by adding tools for low scale Expanded Reality prototyping, e.g. with the Google Cardboard or the Mira AR prism.

Which Tool to Use for Digital Prototyping?

Of course, such a big array of possibilities comes with the agony of choice. What we learned is that it can be risky to fall in love with one specific prototyping tool. They develop incredibly fast, new tools pop up even faster and your project’s requirements can change in the speed of light.

So it’s always a good thing to try to be up to date in concerns of available tools and to be open for new ways to your destination. This article can’t provide you with an everlasting recommendation either. But we want to give you an estimate of the current situation and how we currently tackle the selection of tools.

Prototyping Tool Comparison

Our Top Five

At the end of this story, we want to share our thoughts on five tools that we frequently use for different tasks. This is not meant as a rating but rather to provide insights on our workflow and how we try to get the most of our tools.

Marvel
marvelapp.com

Marvel is a nice tool, following a similar approach than many other web-based clickthrough prototyping applications. It became very interested when Marvel acquired Pop — a company that virtually invented the digital paper prototype. Since then, you could easily create interactive click dummies with your smartphone. This has proven to be a big time saver as well as an impressing showcase for people outside of our industry.
👍 free, easy, practical
👎 limited in functionality, no animations

InVision
invisionapp.com

InVision began its rise a few years ago when it continued to grow and include more and more features which transformed it into an impactful tool for design workflows. After InVision introduced Studio, it saved its spot in the design tool space — it’s impossible not to have heard of it. We are excited to see if the final product keeps up with its promises!
👍 growing fast, big ecosystem, good support
👎 not always stable, no animations

Flinto
flinto.com

A light-weight tool for Mac that allows creating fluid animations and transitions, combined with simple click flows, yet keeping a steep learning curve. You don’t need coding skills and the output feels very native as it uses the device’s hardware. Also, it’s nicely integrated with Sketch.
👍 easy, native, highly flexible
👎 sometimes buggy, only for smaller projects (or project parts)

Origami
origami.design

Facebook’s prototyping tool, which also gets along without code and feels similarly native as Flinto. For logical coherence, you are working with nodes that are connected with each other, which turned out to be a nice intuitive interaction. Also, Origami is free to use.
👍 free, native, flexible
👎 sometimes buggy, steep learning curve

Framer
framer.com

Certainly one of the most flexible and customizable frameworks which can be used in either a more code heavy-mode or a design-heavy mode. Once, you mastered Framer and CoffeeScript, the possibilities are endless, and you can build entire ready-to-use applications only using Framer.
👍 extremely flexible, code and design interfaces
👎 difficult if you’re not into coding

Conclusion

Instead of getting lost in details or a single tool, it’s important to keep the overall goal in sight. We try not to stumble across failure and detail every day. And we are certain that this is the right attitude for improving our personal skills as well as our productivity as a team.

We know that creating prototypes and experimenting with software is big fun to do. But prototyping for its own sake might also not be the way to go. In the end, it’s just a tool for gathering insights and learnings that will be used to progress and keep the project going.

We are Hiring!

Take a look at our current vacancies:
merck.design/career/

Thanks for reading our story! We’ll be continually posting new stories here that you hopefully find valuable for yourself. For more information about us, have a look at our Instagram, Dribbble or Behance accounts.

If you have questions or anything else you want to share with us, just send over an email.

--

--