Principle

Top Mobile Prototyping Tools

So many prototyping tools…so little time

Joanna Ngai
UX Collective
Published in
4 min readDec 2, 2016

--

There’s no shortage of new tools in the prototyping space lately but I’ve been wondering, rather than searching for the ultimate be all end all prototyping tool, what if one were to find the best tool for the given job?

Thus I set out on this journey, to test drive different mobile prototyping tools and see how they fared in the following areas:

  • Ramp up — How easy is it to learn? And how much complexity is involved per project?
  • Speed — How quickly can a project be put together once you get the hang of things?
  • Fidelity — What is the quality of the final outcome?
  • Sharing — Can it be shared for user testing? Shared with a team?

Here’s a few of my favorites:

1. Principle

PROS: end result is high fidelity, simple to learn and intuitive
CONS: Mac only

I really appreciated the timeline/driver features of this tool. Motion in this tool looks great (even at default settings).

Getting started was incredibly fast. Overall, dead simple and recommended for making cool animating interactions!

2. Flinto

PROS: Speedy, syncing feature with Dropbox (making updates is easy)
CONS: Only basic animations available

Flinto just works. That’s what you need in a good design tool. When you are putting together a flow and under a time crunch, Flinto will get the job done fast.

3. Axure

PROS: Complexity, lots of support forums and widget libraries
CONS: Fidelity, ramp up

Axure has a lot of advanced motion features — things like dynamic panels to make widgets, lots of interactions styles and widget libraries as well as a vast library of support forums with an active community.

The one things that bothers me is the final outcome of the project never comes out as polished as I would like. So depending on whether you are working on an early stage concept or final demo, choose wisely.

4. Invision

InvisionApp

PROS: Team features (commenting, sharing) are cool, inspecting features, new motion features, synced with Dropbox
CONS: Interface

Invision has matured over the years, gather new features galore.

With Motion (a feature coming soon), you can add animations or transitions from our library of pre-made effects, or customize your own animations (Adjusting things like the timing, duration, and easing).

It’s also important to note that the speed of creating a prototype is not as fast as Flinto. But then again, it has real time collaboration. That’s pretty cool.

5. Proto.io

Credit: Proto.io

PROS: UI Libraries, sharing options, lots of mobile gestures/transitions
CONS: Being a web based tool = slow performance depending on your machine

My machine runs like a slug when I was trying this out, so unfortunately I can’t use this tool on a consistent basis. However, the thing that drew me to this tool in the first place was that it has launched native iOS and Android apps that let you view your prototypes in the most realistic manner possible.

I really enjoyed having the ability to see my prototype on my device, going back to make changes, then testing it out again.

Conclusion

Try and see what tools works best for you. If all else fails, try this.

You can also learn how to create beautiful mobile app icons with my course — now available on Skillshare!

Learn more

Did you find this useful? Buy me a coffee to give my brain a hug 🍵

Feel free to check out my design work or my handbook on UX design, upgrading your portfolio and understanding design thinking.

--

--