Web Solutions Blog: How to Pick the Best Prototyping Tool for Every Project

“If a picture is worth 1000 words, a prototype is worth 1000 meetings.” – David Kelley, Founder IDEO

Every prototyping tool has its own particular strengths and weaknesses. Without having tried them all, it’s hard to know which are the best for your needs. Most articles tend to just list many different tools and make you do the work to decide which one you should choose. Not very helpful! Instead, in this article, we discuss a range of different scenarios and how choosing the right prototyping tool for each scenario. Read on and find out how to communicate your ideas in the most effective way!

Prototyping evolved as a means for designers to show off concepts cheaply to a wide audience of consumers. Since then it has progressed to allow communication between any two teams or groups. Each conversation needs a different type of prototype and your choice will depend on a number of factors:

Your goals (what do you want to achieve?)
Your audience (who are you talking to?)
Your team (where are their strengths?)

What are the goals of the project?

The objectives of any prototyping project will vary significantly. Prototypes can help in a wide range of different scenarios – from pitching a quick idea to a developer, to gathering user feedback, winning approval for a proof of concept or pitching fully fleshed out design to senior management. Before you begin a project you will need to decide which of these are the primary objective of the project.

Each goal will have different timeframes and quality standards that are expected. Finishing a wireframe for a startup weekend is totally different to spending a month on a detailed user flow including all the error cases. These will restrict or guide how you approach the project. The first decision you must make therefore is to understand what your goal is and how long you have to achieve it.

Who is the audience for the project?

It is important to be aware who your audience is when designing a prototype. Getting your idea across to a designer is very different from communicating with developers or getting feedback from users. In some cases, interviewing users may be a big goal for your prototype (if so, see our article on interviewing users). If you are a startup which is not yet live then you may be aiming your prototype at potential investors. Obviously, there will be an overlap. Each of these factors are key to deciding on what tool you will use.

What are the strengths of your team?

Looking at the strengths of your team will help you decide which tools will work best for you. If you work with or are a professional designer then you will probably already be familiar with tools like Illustrator or Sketch. You can probably start with graphics from those tools which can be uploaded to create a clickable prototype. If you do not have a designer on the team, then choosing a tool with built-in component libraries can help you design a good looking prototype without too many design skills. Either way, the more representative the prototype is, the better the feedback you will get.

So how do I pick the right tool?

To conclude, let’s look at some example projects and which tool would be best suited to each:

Fast and friendly: Pitching an idea (hackathon, startup weekend, accelerator)

I spend a lot of time mentoring startups and product teams and I’ve found that one major obstacle that trips up a lot of early-stage teams is detail. Here, you must getting bogged down in questions that should be put off till later. Sure, you need to give some thought to branding or UI design. But, the objective is to be able to pitch your idea to a group of strangers in 90 seconds. You could, and many startups do, just work on an elevator pitch. However, you don’t have much time and you need to get the basic concept across. In this case, a simple prototype with a few screens that look good that allow you to communicate a single concept well is the best outcome.

You want a tool that is easy to use and which will help you to pitch your idea. You could use a tool like Justinmind or wireframe.cc which is fast and easy to use but Fluid UI wins out with its broader range of built-in libraries and the ability to show off a mobile app on your phone with no code needed.

Selling an idea (investor/ co-founder/ first hire)

If you have already pitched your idea and have some interest, the challenge becomes to show something that will get people excited about what you are doing. For this stage, you need to have a prototype that impresses people but doesn’t take weeks to build. Justinmind, wireframe.cc and FLuid UI remain good choices here, but if you are looking more even greater interactivity in your prototypes, then tools such as UXPin or Axure will be options.

User testing

If you are prototyping for the purpose of user testing, then you will need to be able to communicate quickly and easily with users. You will also need to be able to gather feedback from those users. It is also important to be able to place your prototype in the hands of those users so that the feedback is relevant and specific and will provide data which you can then implement at the next stage of the process. Online tools which are strong in terms of sharing ideas and gathering feedback are a good fit for this type of project. Invision, Proto.io, Fluid UI and UXPin all fit in this category.

Doing production design for developers

If you need pixel perfect looking designs, sketchapp.com is the most popular tool on Mac, but it is a tool with a very steep learning curve and you have to be a designer to get the most out of it. If you are going to turn your images into a clickable prototype then you will need a second tool too. There are a few choices at this stage with tools such as Invision, Marvel and Mockplus all offering Sketch integrations. The downside is that you may need to pay for them too. Other design tools include Invision Studio, Adobe XD, Illustrator and Photoshop.

Zeplin is also worth mentioning as a good tool for this type of project as it generates animations, specs, assets and code snippets from designs and allows the designer and the developer to communicate effectively.

Conclusion

There are a lot of options to choose from when you are selecting a prototyping tool. Hopefully, this article has helped you to ask the right questions so you can understand what type of tool best suits your needs. Once you know this, picking the right tool becomes a lot easier. Thanks for reading, would love to hear any feedback on Twitter!

Author Bio

Dave Kearney is the founder of Fluid UI, where he shares a passion for bringing designers and developers closer to the users they serve. His collected writings can be found on the Fluid UI blog.

The post How to Pick the Best Prototyping Tool for Every Project appeared first on SpyreStudios.