What is a prototype and why do we use them?
Simply put, a prototype is a tool that helps to simulate a desired final outcome. Prototypes come in all shapes, sizes, and fidelities, from a paper sketch to a coded proof of concept. They are powerful because they allow us to learn fast, make changes and then create a new one to test again. In order for us to learn what’s working and what isn’t as quickly as possible, they need to be lightweight and fast to make.
Prototypes aim to remove questions about interactions, flow, and behaviour by allowing the whole team to experience an approximation of the final product. Even more importantly, prototypes allow us to test our assumptions with real users and make sure our designs are intuitive.
Apple's Chief Design Officer, Jony Ive, best describes why prototypes are important when he says “...a remarkable thing happens in the process... It’s when we give form to an abstract idea... it really galvanises and provides a focus to an entire team. It won’t become the final design... but what it does do is describe what we are trying to do.”
You can read up on how we approach prototyping at Kin + Carta in more detail in this post.
The tools of the trade: if you only have a hammer, everything is a nail.
There are several core prototyping tools and methods we use here at Kin + Carta, to get our designs into the hands of users as soon as possible to start improving them.
When exploring large flows and wanting to move quickly, we typically use Marvel. It’s incredibly fast and you can create a prototype in a matter of minutes using a plugin for Sketch.
Marvel does, however, lack subtlety, interaction, and animation. When we want to dig a little deeper into a specific detail, we often jump into Flinto or Principle. These tools allow for more specific interactions: for example if you wanted to finesse a screen transition or explore how an animated illustration might look.
Iain shared a number of questions you should ask yourself when considering the right prototyping tool to use, which include:
- What are you trying to validate?
- Is it a flow from A to B?
- Is it a specific interaction?
- Are you looking to test live data/logic?
- Is connectivity critical for the test?
Two further questions could be:
- What fidelity do you require?
- How much time do you have?
Each of these questions and constraints logically lends themselves to a different tool.
When should you prototype? Introducing Shakira’s Law
You can probably remember Shakira’s catchy song ‘Whenever, Wherever’. Iain likens prototyping to the smash hit, and advises that there is no right or wrong time to prototype.
Iain’s final point is to ensure you are not looking at prototyping as an arbitrary item on an imagined checklist. Your aim is to learn something and make the appropriate changes. Leaving it too long between testing prototypes can allow you to become too attached to your product and resistant to feedback. As designers we need to be keeping feedback loops short, testing and learning incrementally to keep you close to what users want.
Adobe XD: takeaways from Jay Meissner’s talk
Adobe XD is positioned to change the way we not only design, but how we build prototypes. Currently, we design in Sketch and then upload to a prototyping tool like Marvel, whilst assets are exported to Zeplin. The ambition for Adobe XD it to empower us to do it all in one place.
Jay’s team started from scratch, looking at their favourite pieces of existing products. They wanted to build something modern, futureproof and allow people to design at the speed of thought. This means that the tool gets out of the designer's way, and allows them to instantly create what they are thinking, as opposed to wasting cognitive effort on how the tool works or waiting to share designs between several other tools.
