There is a nearly endless amount of good you can do with a great prototype. You can use your mobile app mockup to drive new business with eye-catching marketing assets, as a tool for crowdfunding backers and, of course, an accurate sense of what the user will get when they download the full app. You can also use your interactive app prototype to avoid untold mobile UI design disasters, from knock-down drag-out fights in the creative room when communication between teams breaks down or serious usability errors that would never have happened with adequate A/B testing and QA.
But the power of great prototypes is limited by the power of the prototyping tools used to make them, and there are plenty of tools out there — from simple pen and paper to static layout programs to full-fledged digital mobile app prototyping software, like Proto.io.
Assuming, though, that you’re looking for a tool that takes you from concepting to a fully interactive, animated prototype that feels like the final product (for an idea of what that looks like, check out these digital prototypes of popular apps), what should you be looking for from your investment?
In the spirit of going above and beyond, like all great prototyping tools (and great apps) should do, this list of must-have features goes to 11:
1. Robust, frequently updated UI libraries.
Prototyping tools with great UI libraries, how do I love thee? Let me count the ways:
Avoid OS design fragmentation.
UI libraries allow you to make sure your app’s look and feel is consistent with the overall UI you’re designing for, whether you’re making an Android prototype or an iOS prototype, whether you’re building for smartphones and tablets or creating an Android Wear smartwatch prototype.
Think of all the time you spend looking up device specs, OS style guidelines and Apple and Android best practices, or the hours you sink into digging up the latest version of a particular icon set. Now, in terms of building expertise, nothing can replace getting to know the guidelines of your operating system backwards and forwards. But in terms of quickly launching an app? You can save a ton of precious bandwidth by having readymade UI sets to quickly drag and drop into your digital prototype.
Your prototyping tools keep current so you don’t have to.
The makers of top prototyping tools know that they have huge user bases of mobile app designers, developers and entrepreneurs accessing their UI libraries on a daily basis, so it’s important to keep their libraries updated when, say, Android rolls out yet another OS version named for delicious junk food.
This is especially important when you design both Android prototypes and iOS prototypes, as designing apps for different platforms is complicated enough before you have to worry about two sets of OS updates. Apple has a slightly different looking new hamburger menu? Google made tweaks to its Roboto font? The best prototyping tools already got you covered.
You can design a great-looking mobile app in mere minutes.
Perhaps the best part about today’s prototyping tools is that they make designing mobile apps a simple drag-and-drop affair with powerful WYSIWYG editors backed up by great UI libraries. This way, you can create a gorgeous mobile app prototype even if you’re an entrepreneur with no design experience whatsoever, or an account manager communicating a client’s idea to your team.
Even if you’re a veteran designer who prefers to work from scratch, having the ability to quickly prototype a new idea before you crack open the tools you use to do your layouts can seriously level up your overall process. With a better idea of how all your UI elements will work together in the final mockup, you won’t have to keep playing around with your image editor to figure out the correct balance. Additionally, having the interactions and animations done in the mobile prototype can give you an easy way to communicate gestures and transitions to your development team.
2. The ability to implement gestures.
Speaking of gestures, they are non-negotiable in any mobile app prototyping tool worth its salt. It’s been a long time since we lived in a world where people interacted with their phones (or their computers or their watches) simply by pressing buttons. UI elements can be tapped, doubled tapped, held, pinched, and, of course, swept left or right. (Or up, down, and diagonal, but that’s unlikely to impact your dating life in any meaningful way.)
But remember that input is only half of gesture-based UI design. Your prototype should be able to react to these inputs in a predictable way. Maybe a button seems to move backward inside of a device when you press down on it, or a certain element has a specific speed and inertia when you swipe it off of the screen. The most sophisticated prototyping tools not only make sure that the inputs and outputs of gesture-based UI design are crossed off on, but that they translate well to whatever device you’re demoing the prototype on, whether it’s a smartphone or a desktop browser.
3. Seamless integration with industry-standard file formats and programs.
We’ve all run across tools with this problem, not only in mobile app prototyping, but in any sort of digital creative field: you’re working in one program, and have to port in a file format from another program, and there’s no native option to allow you to use that file. You then have to minimize your window, go through a few extra steps to convert from one format to another, hope that nothing is lost in translation, and then resume your work.
There are certain tools whose file formats are so ubiquitous that there is no excuse not to support them. And yet, even today, there are suites of tools that don’t support seamless opening and editing of tools from a different program in the same suite (again, we won’t name any names). While there are great business reasons to support proprietary file formats, and it’s impossible to make everybody happy, prototyping tools should play nicely with at least the heaviest hitters in the industry. If you love using tools like Sketch or Photoshop, for example, you’ll have no problem flowing those assets into Proto.io.
4. Ways to prototype wearables.
“Smart” is getting smaller and smaller. Not only do the Apple Watch and the gaggle of devices running Android Wear beg attention from mobile UX designers, but crowdfunded startup darlings like Pebble (which runs apps from both ecosystems) and wearables that go beyond the wrist — from Yono, an in-ear fertility tracker to First Run, Under Armour’s fitness-tracking smart sneakers — are giving the “mobile” in “mobile app UI” brand new meaning.
As small gets smarter, prototyping tools need to get both smarter and smaller. That means UI libraries that stay up-to-date with elements of both Apple Watch and Android Wear, from typefaces to tiny scrollbars. It also means templates that look fantastic once you’ve wrapped the project up (here at Proto.io, we take care to polish your Apple Watch so that it shines spectacularly). Finally, it means documentation, blog posts and support that show your prototyping tool knows the ins and outs of prototyping wearable UIs.
All of this leads to better looking mockups, better looking final apps and, of course, better looking wrists.
5. Autosave and version control to prevent saving SNAFUs.
Think of all the pet peeves and minor league disasters you encounter on a regular basis on the job. While the Apple app store approval process (try saying that three times fast!) might have your head swimming with its serpentine obstacles, and Android fragmentation has you saying, “How did they not fix this five years ago?” almost daily, it seems no tragedy befalling design and development gurus alike holds a candle to the software crash that comes before a save.
Yes, anyone born this side of Apple’s 1984 Superbowl commercial has had “save early and often” drilled into their heads by teachers since their formative years. With that said, to err is human — to autosave, divine. Even the most experienced designers at the most prestigious agencies run into saving and versioning issues, especially when multiple members of a team access the same project file via the cloud.
Nothing is more frustrating than receiving feedback on a version of a document you thought you had canned days ago, and there really is no need to waste that kind of time when prototyping tools have your back with autosave and version control features.
6. Collaboration and feedback features.
Of course, while proper version control can potentially spare even your most high-pressure teams from getting at each other’s throats, the features necessary for proper collaboration don’t end there. Especially now that offices are becoming more and more virtual, with multiple workers clocking in remotely (sometimes from across the globe), mobile app prototyping tools need to keep pace with collaboration and feedback features.
What does this look like? With Proto.io, you can share your mobile app prototype with friends, family, beta testers, clients, team members and just about anyone whose opinion you think is valuable, and they can mark up the digital prototype with comments as easily as they could take notes on a physical, printed out markup. Of course, digital commentary right inside the app allows you to keep all feedback organized and visible, so no crucial suggestions are lost in a flurry of files (or deeply imbedded in your inbox).
While some prototyping tools may use this opportunity as a quick cash grab, requiring you to register new accounts for commenters above a certain threshold, Proto.io doesn’t put a limit on how many people can comment on your app — so go ahead and show it to everyone you know. The more testers, the better! Which leads us to our next point…
7. Easy, data-rich A-B testing.
One of the best ways to get maximum ROI from your prototyping tools is to use your prototype to A/B test specific features, functionality and UI design choices. After all, why go through the trouble of coding two separate menus when you can use a simple drag-and-drop editor to create two different interactive app mockups? From there, you should be able to gather both the quantitative and qualitative data you need to make the best design choice for your users.
8. Security features, including encryption.
One of the easiest things to overlook when shopping for design tools is data security. However, you don’t need to be a Chief Security Officer of a major IT organization or a white hat hacker to be concerned about the privacy and security of your intellectual property. You don’t want the software you use to build your apps to be a potential vector for attack, whether it be from hackers trying to get your credit card number or even morally “flexible” designers looking to steal your best ideas. That’s why Proto.io uses 128-bit encryption to lock down client-server communication in its cloud-based environment, on top of other security best practices.
9. Plenty of helpful documentation.
Some prototyping tools are heavy on features, giving you everything you need to whip up a lifelike facsimile of the final product, but have such a steep learning curve and so little support that you feel like it would be easier just to code the full app by hand. On the other side of the coin, some tools are incredibly intuitive and easy-to-use, with great user onboarding — but they lack the power to create prototypes that really wow your stakeholders.
The best prototyping tools combine rich functionality with plenty of tutorials, support and a great onboarding experience to help you get off the ground fast. But great support shouldn’t just end there…
10. Stellar support for both the product and your account.
If you build apps for a living, you know that customer support can make the biggest difference when it comes to user loyalty and word-of-mouth buzz. The same goes for prototyping tools: like any other software that powers your business, you should look for a fantastic customer support experience, whether you’re changing the email address on your account or encountering issues with the actual app.
11. A free trial, so you can decide for yourself whether the product is worth it.
Granted, it’s one thing to see a list of features on a landing page and it’s another thing to experience them firsthand, and sometimes, the only way to know for your whether you’ll fall in love with a product is to take it for a test drive. Many prototyping tools offer free trials, but it’s important that the trial be long enough for you to get cozy with the software and make a few mockups, as well as give you access to all the features you’ll get if you end up purchasing it.
We’re not shy about the amazing prototypes you can make using Proto.io — that’s why we love showing off our users’ creations on Proto.io Spaces. It’s also why we make sure you get the most out of your free 15-day trial by taking you through our seven-day tutorial series, which gives you everything you need to create gorgeous prototypes right out of the gate. What other features do you think all prototyping tools should have? Let us know by tweeting us @Proto.io!
