There are best practices for mobile usability as there are best practices for usability on other platforms. These best practices are not a substitute for user research and usability testing; they are intended as a “quick start” guide to get your designs moving in the right direction. There are no absolute rules in usability design and your users should shape your design decisions as much as best practices do.
In their paper, Mobile App UX Principles, Google’s mobile team offers some best practice guidelines for mobile app usability. These guidelines should form the basis of your design for usability in mobile apps, however, as always best practices are no substitute for user research and testing to find out what works for your users.
General Mobile App Usability Best Practices
- Content and all text should be easy to read. This should be true in any setting, including where bright sunlight is affecting the legibility of the screen. Fonts should be set at a minimum of 11 points and be consistently used throughout. Contrast between text and background is key to legibility in bright lights.
- Content should be available even when the internet is not. While it is not possible to maintain all content on the device, core content should be available even when an internet connection (both 3/4G and Wi-Fi) is not.
- Control spacing and size matters. These should be easy to tap and control by the user.
- Android apps – 48 dp target size
- iOS apps – 44 x 44 px target size
- Multi-step tasks that are not contained within the normal interface should be presented in modal views.
- The most important CTA (Call to Action) buttons in your app should be “sticky” or permanently in view.
- On screen content and transitions should be delivered quickly and painlessly to avoid frustrating users with long wait times.
Author/Copyright holder: Wufoo Team. Copyright terms and licence: CC BY 2.0
Form Guidelines for Usability in Mobile Apps
- Form labels should either exist above the fields or be created as floating labels to make certain users know why they are completing a form.
- Forms should attempt to communicate what is necessary in a field to avoid user error.
- Forms should be validated as each field is completed and not at the end of the process.
- Forms should begin with the cursor already placed in the first field and with the correct input keyboard displayed.
- Forms should ensure that CTA below the fold is automatically scrolled up when a user completes the form.
- Forms where lists are presented as options should display these horizontally above the keyboard rather than vertically. This ensures that the screen real estate is used effectively when a keyboard is present on screen.
- Forms which require numeric entry should display a numeric dial pad style keyboard when required.
- Forms can benefit from stepper controls when users need to edit quantities. This is also true for shopping baskets.
- Forms and search facilities should offer slider controls to set maximums and minimums.
- Forms that require date/time input should offer picker controls to make this process easy on the user.
- Forms that require calendar entries should consider displaying a visual calendar – this is particularly important in travel/hotel booking style apps.
- If an app crashes whilst a user is engaged with a form it should auto-recover any data entered and return the user directly to the point in the process when the crash occurred.
Author/Copyright holder: Qtguy00. Copyright terms and licence: CC BY-SA 3.0
The Four Big Don’ts of Mobile Usability
In addition to what to do, Google also turns their attention on what not to do. They’ve identified four areas in mobile app development that cause either user confusion or user distress. This reduces the overall appeal of the app and the user experience dramatically.
- Don’t copy UI elements between platforms. It may seem like a good idea to ensure that your iOS and Android and Windows apps all look exactly the same but each platform has a defined look and feel. These lead to users developing clear pictures of the conventions associated with that platform. If you change the UI to resemble a different platform; it doesn’t benefit the user it leaves them unclear as to how to proceed.
- Don’t use underlined URL links. The underlined URL is part of a different model of online interaction – it belongs in websites that are accessed via browsers. Mobile apps don’t work that way, they rely on buttons to signify a change in screen as opposed to a link which takes you to a different page. Google adds a corollary to this rule too – don’t hard code links because they need to be manually changed and broken links spoil the user experience.
- Don’t take users to browsers. You want to keep an app user inside your app and not send them elsewhere. Sending them to a browser risks them not returning to the app and provides a “clunky” user experience. If you must call their attention to some content online – use a browser within your app to deliver that content; don’t send the user elsewhere.
- Don’t demand an instant rating in the app store following download. If you want good ratings for your apps, you have to give the user some time to get used to it and to appreciate the experience. You should be asking regular repeat users for ratings not those that have just installed the app. They’ll be certain to give you better reviews and reviews with a higher level of content.
Author/Copyright holder: George Thomas. Copyright terms and licence: CC BY 2.0
The Take Away
Mobile app usability isn’t that much different from usability for other platforms. Following the guidelines above should get you pointed in the right direction; however, it’s no replacement for actual user research and usability testing. Every set of users is unique and you want to cater for your user groups preferences first and foremost.
Google’s 48 page paper on Mobile App UX can be found here - https://storage.googleapis.com/think-emea/docs/article/Mobile_App_UX_Principles.pdf
For those looking at usability testing for mobile apps a great quick reference guide infographic can be found here - http://www.userzoom.co.uk/resources/mobile-usability-testing/infographic-mobile-ux-research-methods-tools-2/#content-read=true
Hero Image: Author/Copyright holder: Paul Veugen. Copyright terms and licence: CC BY 2.0