Years ago, a kid was trying to fashion a bow by cutting a twig with a knife. Upon seeing this struggle, his grandfather handed him a saw, saying, “Always use the right tool for the job!” As the kid in the story, I learned a valuable lesson in craftsmanship: When you’re picking a tool to solve a problem, there are many good tools, but some are better suited to the task than others!
In recent years, new prototyping tools have emerged, many for mobile design. The landscape is constantly changing, with some tools losing favor with UX designers (or UXers) and others taking their place. While this article will not serve as a complete paint-by-numbers manual for selecting a prototyping tool, we will discuss important factors that influence the selection process.
I will rely on my personal experience in using and researching various tools to explain how certain tools are a better fit than others. Near the end of the article, the “Resources” section will point you in the direction of more specific comparisons to give you additional context for decision-making.
You Need a Mobile Tool
Even though you have many tools to choose from for your mobile project, picking one does not have to be a daunting task. You can narrow the possibilities by answering questions to form selection criteria.
The project’s needs will give you good initial constraints. Are you testing usability? Will visual design be a part of the prototyping? Will the prototype capture a high-level concept or full-blown production work?
UX designers constantly assess the given problem and chart a course. So, why don’t we apply the same process to choosing a prototyping tool? Breaking down the choice into smaller factors will build your confidence in the direction you eventually pursue. Each of the following can play an important role in your decision:
- interaction fidelity,
animation and motion,
simplicity in demoing,
Technical Factors To Consider
The mobile prototyping landscape is growing every year with exciting new tools. Each tool has diverse features that allow the designer to tackle a variety of problems. Some tools are more valuable for one set of tasks than another. No single tool is best at everything!
Below is one interpretation of how suitable common prototyping tools and technologies are, given our selection criteria. Keep in mind that your selection will depend on the project. You might find that tools labelled below as a “Good fit” (rather than “Most suitable”) are a better choice for your project.
A rating of “Good fit” simply indicates that a particular tool is highly recommended but that another tool (indicated as “Most suitable”) has slightly higher functionality, making certain tasks easier to accomplish.
Prototyping tool breakdown
1. Interactive Fidelity
Interactivity comes in different flavors. You might only need to communicate flow; thus, clickthrough prototypes would be ideal (which are typical for conceptual and usability testing). Rather, the project might require you to illustrate multi-step conditional interactions (if you need production-ready and documentation-focused prototypes). Whatever the case, a prototyping tool exists to help!
Individual elements can interact with one another.
2. Animation And Motion
Animation plays a big role in communicating mobile interaction. At the onset of a mobile project, determine whether you are responsible for creating animations in the prototype or someone else is, like a developer or motion designer. Regardless of who will be handling this, it helps to know what level of control over the animation is required in the prototype.
3. Gestures Link
Mobile prototyping involves designing for gestural input, so consider whether your project requires this. Most UX-specific tools support this out of the box — one set of tools will have common gestures built in, while another set will support gesture creation and multi-finger input.
Mobile experiences require prototyping for gestural input. (Image: Nicolas Nova) (View large version)
4. Visual Design Link
When prototyping for mobile, identify the expectations for the deliverable’s visual fidelity. UXers are often tasked with visual design, a responsibility that is delegated to specialized designers in large organizations. The fidelity will be dictated by the project’s goals and the audience: high for pitches and production work, middle to low for usability testing, and low for proofs of concept.
Color has meaning.
Color can convey different emotion in prototypes. (Image: See-ming Lee) (View large version)
5. Simplicity In Demoing
Getting mobile prototypes in front of an audience is critical to validating a design. There are two main methods for demoing mobile prototypes: on a computer or directly on the target device. There are variations in between, such as mirroring from computer to device and vice versa. When kicking off a project, consider which method makes the most sense and which is supported by your prototyping tool.
Interestingly, mobile tools that allow you to create a prototype directly on the target device also offer one of the easiest ways to demo the prototype. AppCooker, Blueprint, POP and Marvel have built-in functionality to switch between editing and preview modes.
In this article, we’ve introduced practical considerations for selecting a mobile prototyping tool for UX, covering both technical factors and more strategic selection criteria. Keep in mind that there is no right or wrong decision — designers have different working styles, expertise and needs!
To make your choice even more informed, identify your strengths. Do you know coding? Are you an excellent visual communicator? How many requirements have you identified? Answering these questions and collecting information about the project will help you determine the right tool.
No one wants to be a one-trick pony. Therefore, we recommended having at least one of each of the following categories in your mobile prototyping toolkit:
- Full platform for tackling a variety of mobile problems: Axure, Justinmind
Code-based tool for controlling interaction and animation: Framer, jQuery Mobile
Cloud-based tool for collaboration and distributed work: Flinto, Proto.io, Pixate
On-device prototyping tool for quick concept mockups: Blueprint, AppCooker, POP
Strive to be the best in your discipline; stay curious about new interaction tools (such as Principle, InVision Motion and Adobe Experience Design CC); and continue prototyping great experiences for your business partners and end users. I look forward to hearing about your experience in picking prototyping tools for mobile!