Why Comprehensive Observability Matters? Read Now
Cubyts

What is Prototyping and how to do it right?

Prototyping is simulating a product / experience so that the user experience can be tested before building the product.

Duration

2-4 weeks, but could be more depending on the number of user stories

Complexity

Advanced

Contributors

UX designer, UI designer, User researcher, Product manager

Getting Started

Prototyping is the process of creating a preliminary model or sample of a product or system in order to test and evaluate its design, functionality, and usability. It allows designers to create and test different ideas and design concepts before creating the final design.


Why? 

  1. To test design concepts and ideas with users to identify potential issues and improve usability. 

  2. To validate the design before it is built.

  3. To iterate and refine design solutions based on feedback and testing results.

  4. To communicate design ideas and solutions to all the stakeholders.

  5. To reduce the risk of expensive design mistakes.

  6. To ensure that the final product meets user needs and requirements. 

Prototypes need not always ‘look’ like the final product. Depending on when and why the prototyping is used, it can be done differently.

What is the difference between Low and High fidelity prototypes?


Types of prototyping

 

Want to know when to create which type of prototypes?

Read What Kind of Prototype Should You Create? From IxDF


How to?

Here are a few important steps you can follow to create effective prototypes:


Do’s & Don'ts

Do’s

Don’ts

  1. Have a clear goal for creating prototypes.

  2. Stay focused on solving the user problems.

  3. Be aware of any technical limitations.

  4. Pick the right fidelity of prototyping.

  5. Use the right tools for creating prototypes.

  6. Prototype a list of specific user stories.

  7. Do keep your design simple and user-centered.

  8. Do collaborate with all the stakeholders.

  1. Don’t try to create a perfect design.

  2. Don’t start detailing designs before getting feedback.

  3. Don’t create incomplete flows.

  4. Don’t go on preparing forever.

  5. Don’t focus on aesthetics over usability.

  6. Don’t work in isolation.

  7. Don’t rely solely on your intuition.

  8. Don’t be afraid to reiterate and refine your design based on user feedback.


Templates 

Prototype Templates from Canva

Resources from Google Material Design


Suggested Tools 

For Low-fidelity Prototypes

  • Pen & Paper

  • MarvelApp

  • JustInMind

  • Balsamiq

For Medium & High-fidelity Prototypes

  • Figma

  • Axure

  • InVision

  • AdobeXD

  • Proto.io

For Coded Prototypes

  • Flutter


References 


Other Related Best Practices

  • Usability Testing

  • Wireframing