You have your idea, you’ve done your research and now you’re ready to build your mobile app or web app. Prototyping is an important part of the product design process and you prototype mainly for two reasons:

1. To show people what you’re about to build. This may be your clients or your team or even your friends - a prototype is a visual, tangible version of what’s in your mind and what you’re trying to build. It allows others to understand your product and also to identify improvements/changes. It’s also a great way to incorporate your creativity and know what branding direction to take.
2. To test your product with customers before investing a lot of time and money into writing code. From how visually appealing your app is to how customers interact with it, a prototype allows for rapid testing before committing too much to the product. User Interface (UI) and User Experience (UX) design can both be tested at this stage - the idea is to fail fast and learn quick with your prototype instead of failing with an actual product.

You don’t have to be a designer to use prototyping tools (but being a designer will help) and picking the right prototype tool will go a long way in making things easier for everyone! The following are things to consider before you pick a tool:

1. Cost: If you’re a startup its in early stages, chances are you wont be willing to spend on costly prototyping tools. Fortunately, there are many free prototyping tools available that produce great results and will have all the basic features you require at your stage of product design.
2. Ease of Use: How quickly one can learn how to use the tools, how user friendly the interface is and how well a tool fits with the design tools you’re already using are all considerations you need to make before picking the tool you’re going to use.
3. Sharing: A great thing about prototyping tools is that they allow sharing between multiple people. The same prototype can be shared with the entire team, clients or other stakeholders to gather real time feedback instead of doing a back and forth in meetings. Being able to quickly share and communicate the designs is an important consideration in picking the right tool. 4. Fidelity: Your prototype can be either low, medium or high fidelity. This basically means that a prototype will either contain bare minimum features or could contain complex features/interactions or be an in-between. Different tools will suit different kinds of projects and you may require them at different stages of product development.

1. Cost: If you’re a startup its in early stages, chances are you wont be willing to spend on costly prototyping tools. Fortunately, there are many free prototyping tools available that produce great results and will have all the basic features you require at your stage of product design.
2. Ease of Use: How quickly one can learn how to use the tools, how user friendly the interface is and how well a tool fits with the design tools you’re already using are all considerations you need to make before picking the tool you’re going to use.
3. Sharing: A great thing about prototyping tools is that they allow sharing between multiple people. The same prototype can be shared with the entire team, clients or other stakeholders to gather real time feedback instead of doing a back and forth in meetings. Being able to quickly share and communicate the designs is an important consideration in picking the right tool.
4. Fidelity: Your prototype can be either low, medium or high fidelity. This basically means that a prototype will either contain bare minimum features or could contain complex features/interactions or be an in-between. Different tools will suit different kinds of projects and you may require them at different stages of product development.

With these guidelines covered, here’s a roundup of our favorite prototyping tools! We’ve used these to create both low fidelity and high fidelity prototypes at different stages of product design and to also collaborate with our clients in providing real time feedback from a development perspective.

Single project — Free
3 projects (starter) — $15/month
Unlimited Projects (Professional) — $25/month

Web

Android
iOS
Web

InVision is by far the most commonly used prototyping tool we’ve come by. Both corporations and small startups are using it for their UI/UX design and we highly recommend it!

“With InVision’s project management page, you can organize design components into a status workflow. You can set columns for To-do, In progress, Needs review, and Approved, and drag and drop your design components into the appropriate column.You could add interactions and animations to static images. You can upload multiple file types, including JPG, PNG, GIF, AI, and PSD. It has push and pull integrations with apps like Slack, Dropbox, Box, Trello, JIRA and much more.”

InVision is here to simplify your prototyping process while keeping your business needs in mind!

Free

OS X
Windows
Android
iOS

Android
iOS
Web

With Adobe XD, you can draw, reuse, and remix vector and build artwork to create wireframes, screen layouts, interactive prototypes, and production-ready assets all in the same app. You can switch easily from design to prototype modes viewing the prototype on both the web app and on the Adobe XD app on your phone. You can also integrate XD with other Adobe products which makes it a designer friendly tool. It also allows commenting from clients and getting feedback as you work on your prototype!

30-day Trial — Free
Pro — $29/month ($495 to purchase)
Team — $49/month ($895 to purchase, per user)
Enterprise (includes on-premise solutions) — $99/month

OS X
Windows

Android
iOS
Web

Axure allows users to create interactive prototypes and diagrams so you can test and evaluate your applications, and at the same time, receive and gather feedback. You can do this without the need of writing a single line of code. The software is equipped with powerful features such as the capability to use conditional logic and math functions, work on dynamic content, and apply animations. You can also share the prototype with your team in a single click to allow for feedback!

And there you have it. Above are three prototyping tools you can use when designing products. While these tools are extremely effective, it’s always great to start with the easiest prototyping tool of all: paper! Not only can you easily scribble down your ideas visually but you can easily discard what doesn’t work and keep what does. Starting on paper will later make it easier for you to prototype in the tools we mentioned above!

To read more on prototyping, here’s two resources we think could help you out:

Until then, happy prototyping!