• How-to guides
  • ,
  • Useful resources

Why the prototype is the creative tool you never knew you needed

As the popular IDEO quote goes: “If a picture is worth a thousand words, a prototype is worth a 1000 meetings”. A prototype, a rough execution that shows how your product works, will help you refine your idea, force you to come face to face with any flaws in your original concept and will make it easier to gather feedback from potential customers. A prototype could be something as simple as a sketch on a napkin. The aim of the prototype is to firstly see for yourself how your idea would translate into real life, but also communicate your idea more effectively to partners, potential customers and investors. It will also help you evaluate different production routes, materials and/or technical solutions.

You may think building a prototype is not for you if you are not building an app or developing a digital product, but it actually is! A rough execution that brings your “aha moment” from the world of ideas to the reality around us, can save you a lot of time and money. For instance, best selling author Tim Ferris, used prototyping to ensure he was positioning his work for success. When it came to picking the title of his book, he experimented with Google adwords to figure out which title would make people more interested to take a look. When it was time to pick a book cover, he printed a couple of different covers, went to a bookstore, put it on different books and noticed which one was getting picked up the most. This approach helped him ensure in a timely manner and at a low cost that he was producing a book that would appeal to his market. If you are producing a movie, your prototype could be a short film, a trailer or a sketch board. For a service, prototyping could be role-playing or Lego —fun!

A prototype is the first step in your journey and a long way from your final product. You can create different prototypes, trying tweaks in production, taking into account lessons learnt from the earlier iterations. The next stop in your journey after developing a prototype

For example if you were to sell donuts, the prototype would be a sketch on a paper of a plain donut, the minimal viable product* would be a plain donut and the final product would be a donut filled with chocolate sprinkles on top, etc.

* Minimum Viable Product or MVP is a product with just enough features to satisfy early customers and provide feedback for future product development)

Once you have outlined your idea, value proposition and customer personas, you can list the core features of your prototype. Start with a low-fidelity prototype, sketching the different screens and outlining 3-4 important user flows of your product. Once you are happy with the low-fidelity prototype you can use one of the tools suggested below to develop a high-fidelity prototype, meaning an interactive digital prototype that you can test on mobile, browser and desktop platforms.

13 tools to build your prototype even if you don’t have designer experience.

  1. Invision enables you to create interactive prototypes in a collaborative way. The intuitive vector-based drawing and flexible layers make this tool accessible to all.
  2. Balsamiq with Balsamiq Wireframes, anyone can design great user interfaces, mobile apps, websites and more.
  3. Mockingbird enables you to mock up an application and show what’s important: the idea, the information, the interaction.
  4. Adobe Experience Design. With Adobe XD, you can draw, reuse, remix vectors and build artwork to create wireframes, screen layouts, interactive prototypes, and production-ready assets all in the same app.
  5. Origami A free tool for designing modern interfaces, built and used by designers at Facebook.
  6. Sketch offers fully vector-based workflow with reusable elements that can be automatically copied and pasted.
  7. JustInMind. Design from scratch, from clickable wireframes to interactive prototypes.
  8. Proto.io fully interactive high-fidelity prototypes that work and look exactly how your app should. No coding required.
  9. Marvel offers a variety of design and prototyping tools supporting the development of low and high fidelity prototypes.
  10. Principle makes it super easy to share your designs with the record feature: Export a video or an animated gif that can be shared on Dribbble, Twitter, and wherever else you’d like.
  11. Protopie is an easy-to-learn tool that allows to create sophisticated micro-interactions in your prototypes and makes it easy to test your prototype on smartphones, tablets, desktop and the web.
  12. Mockplus can create and analyze the work of a lo-fi prototype and promises to save you one hour per day!
  13. Voiceflow. Prototyping for voice apps. Collaboratively design, prototype and build Alexa Skills and Google Actions.

How about prototypes of physical products?

If you don’t have the budget to get a prototype done by professionals try doing a rough prototype yourself. First sketch out your solution.Think about materials that could work and are familiar with and focus on what works, not what looks good. Keep in mind you can use lower cost solutions like 3D printing, that can still help you figure out functionality. Even if some materials wouldn’t work for your final product they can absolutely work for a prototype. Don’t forget to write down a realistic budget and compare it with the budget you actually went for at the end. This will help you be more realistic about timelines and production costs moving forward.

Further Reading