Guest Post by Nick Babich

The average US user spends 5 hours per day on mobile. The vast majority of that time is spent in apps and on websites. The difference between a good app and a bad app is usually the quality of its user experience (UX). If you want your app to be successful, you have to consider UX to be not just a minor aspect of design, but an essential component of product strategy.

To make the task of improving mobile UX simpler, I’ve summarized the top 12 most common problems that lead to bad mobile user experience. I also provide practical recommendations on how to overcome each challenge.

1. Not prioritized features

How to make an app more desirable to potential users? Add more features, right? Wrong! Adding too many features in the app rarely results in better user experience. On the contrary, this leads to the opposite effect – over-complication known as feature creep. Feature creep is terrible for mobile design because:

  • It’s almost impossible to create all features with an equal level of quality.
  • The first-time user experience becomes a complete nightmare – just imagine a user who launched an app for the first time and has to learn how to use dozens of different features.

Featuritis Curve
Mobile designers have to find a sweet-spot for features. Image: headrush

The most successful apps available in the market are highly focused. They have a limited set of refined features. Here is what designers should do to find a sweet-spot for features:

  1. Identify your target audience. Start with researching and creating user personas. It will help you better understand who are your users, how they will interact with your app and which features of your app are the most valuable for them.
  2. Prioritize each feature requests. Focus on improving the experience around your core objectives. Prioritize what’s important for your users and trim nice-to-have features.

2. Cluttered user interface

Visual clutter is a lot of information presented to the user at once. Clutter overloads users with too much information and makes the experience more complicated. Clutter is terrible on a desktop, but it’s way worse on mobile where users have much less available screen space.

Macy's App

A previous version of Macy’s app for iOS. Cluttered, busy user interface

 

Macy's App

A current version of Macy’s app for iOS. Fewer objects on a page, more whitespace between objects.

To beat the clutter, designers need to do the following things:

  1. Honor minimalism. It’s worth remembering that every additional button, image, and line of text makes the screen more complicated. Designers should trim all the fat (remove all unnecessary UI objects and styling elements that do not directly support user tasks) and add more whitespace for each mobile page.
  2. Prioritize one primary action per screen. The rule ‘one primary action per one screen’ implies that each screen should have no more than one primary call-to-action. This significantly reduces the cognitive load (amount of brain power required to use an app) and makes the app much easier to use.

3. Unclear and unpredictable navigation

It’s possible to establish a direct connection between the quality of an app’s navigation and the app’s usability — the clearer navigation is, the more usable the app will be. Remember that no matter how good the content of an app, it becomes useless if people can’t find it. That’s why helping users navigate should be a top priority for every mobile app.

Designers should strive to make the navigation self-evident by following a few simple rules:

  1. Craft good information architecture. Well-designed apps provide a clear path for their users — users feel almost like they are guided to the content they’re looking for. It only happens when designers invest in information architecture. Good information architecture will help app creators organize information in a way that requires users to make a minimum number of actions to reach a target destination.
  2. Make the navigation feel familiar to your target audience. Most probably an app you design has direct competitors — an app that provides the same features. Conduct competitive analysis, find apps that are similar to the one you’re designing and apply the same navigation patterns in your app. By doing that you’ll create navigation that doesn’t require any explanation and meets users expectations right from the start.
  3. Communicate the current location at a glance. People should always know where they are in an app. This knowledge will help them navigate successfully. If you use a tab bar as a primary way of navigation, make sure that an active tab has a contrasting color.

    App Navigation

    Image: Ramotion

  4. Make navigation consistent. Don’t change the location of primary navigation controls or hide them on individual pages of your app.
  5. Don’t use custom gestures as a primary way of interacting with an app. It’s okay to use gestures as a supporting mechanism for existing navigation (e.g., using gestures as navigation shortcuts), but it’s better to avoid using gestures as a replacement for primary navigation. Unless your app is a game, people rarely appreciate being forced to learn a new way to do things.

4. Illegible and unreadable text

Content is the reason why people use your app. Users appreciate good readability and legibility. That’s why improving typography should be a big part of your design strategy. Making text legible and readable is a mandatory requirement for each mobile interface.

Here is what designers need to do:

  1. Use legible font size. Small text often causes a lot of troubles especially for users who suffer from low-vision— such users will have difficulty reading the small print. To solve this problem, designers should make the text at least 11 points so users can read it at a typical viewing distance without zooming.
  2. Use sufficient color contrast for text. If you have excellent vision, it’s easy to assume that everyone perceives text legibility the same way you do — but of course, that’s not the case. Insufficient contrast makes text blend in with the background, so it becomes unreadable for people who have low vision. Strive for a minimum contrast ratio of 4.5:1 for body text.
contrast ratio

The difference in the contrast ratios. Image: Google

5. Tiny touch targets

Smaller touch targets are a common source of frustration for mobile users. A lot of mistaken taps happen because of small touch controls.

Touch Target Size

Image: Apple

Simplify the interaction with your app by making all touch target big enough, so they’re easy for users to tap:

  1. Provide ample touch targets for interactive elements. Create UI elements that measure at least 7–10 mm. This size guarantees that elements can be accurately tapped with a finger. To simplify the task of measuring touch targets on the actual mobile device you can use Mobile Touch Template.

    Android Touch Target

    48 dp (Android) is a minimum touch target size. Image: Google 

  2. Ensure that there is a right amount of spacing between touch targets. Interactive elements shouldn’t be located too close to each other – touch targets should also be spaced about 8 pixels apart, both horizontally and vertically, so that a user’s finger pressing on one target does not inadvertently touch another.

If you want to learn more practical tips on designing finger-friendly touch targets, be sure to check the article Mobile UX Tip: Touch Targets.

6. Lack of feedback on interactions

Each human-computer interaction is based on two fundamentals — user input and system reaction to it. When users don’t receive any feedback from the system after the input, they quickly assume that the system didn’t receive their request. As a result, they try again. Such behavior usually results in a lot of extra taps.

To make the interaction predictable, it’s essential to provide visual, audio or any other feedback in response to every user action. Feedback acknowledges user actions and helps them understand the results of operations. Based on the type of UI element or current state of the app, designers can use different forms of feedback. For example, for interactive elements such as buttons, it’s possible to use visual feedback – a button can change color on tap.

Submit Button

Submit button. Image: Colin Garven

7. Dead-end pages in the user journey

Dead-end pages are pages that don’t provide any valuable information for users; they don’t help users solve the problem or find a way around. The most common example of a dead-end page is an error state that just states a fact that an error occurred. Such pages act as blockers for user flow — they create confusion and lead to additional (and often unnecessary) actions. Since users don’t know what to do, they will experiment to find a solution themselves.

Dead End Page

This error state doesn’t say too much to users. When users see such error state they wonder “Why is this happening and what can I do about it?”

A well-designed app doesn’t have dead-end pages. Each error state in such app provides information and instructions that allow users to solve the problem and move forward.

Error State

This error state helps users understand what’s happening.

8. Taking users to a system browser

Mobile app developers are notorious for invoking a system browser to complete a specific task (for example, allowing users to reset a password). By doing that mobile developers increase the chance the users will abandon an app — when users are redirected to the browser they might easily forget that they interacted with an app just a few minutes ago.

Facebook App

When a user taps on the “Forgot Password?” button in the Facebook app for Android, the app tries to invoke the smartphone’s browser.

Even if your app lacks a specific feature it’s better not to invoke system browser; use an in-app browser instead. By doing that you will ensure users stay in your app.

9. Asking for a lot of data

Filling out forms is an everyday activity for mobile users. Every second app available on the market today asks users to provide some information. An app might ask users data during the signup, or it might be a request for shipping and billing information.

When it comes to collecting user data, it’s vital to remember that typing on a mobile device is a slow and error-prone process. And the more an app asks users to provide the data, the less enjoyable the experience becomes for end-users.

Designers should strive to minimize the need for typing by following a few simple rules:

  • Ask only what you really need to know. Keep forms as short and simple as possible by removing any optional fields.
  • Make the procedure of data input as efficient as possible. Try to pre-fill fields with smart default (app uses the information about users to make intelligent guesses and pre-fill the field with a data). In some cases, it’s also possible to use device capabilities such as a camera to collect the required information.
ID Scanner

Let users scan their identity card, instead of having to fill out their credit card information manually. Image: blinkid

10. Asking for permissions right at the start

Quite common the first thing users see when they launch a just-downloaded app is a dialog box with a permission request (e.g., “Allow app X to use your location?”) When an app asks for permissions right up front users often deny such permissions requests. Why? Because at this point, users don’t have any information that allows them to understand why an app needs those permissions.

To reduce the risk of permission denial, it’s better to ask for permissions in the context of a feature that needs this permission. Users are more likely to grant permissions if asked during a relevant task. The only exception for requesting permission at launch is only when the core app experience requires this permission.

app permissions

Hangouts ask for access to your contacts right from the start because app’s core experience requires this permission.

Learn more practical tips on permission priming from our article Mobile UX Tip: Permission Priming.

11. Designing a mobile app as a stand-alone experience

Mobile apps are no longer independent experiences. A typical user might own a variety of different devices such as a desktop, mobile phone, and tablet, and expects to have a seamless experience across all those devices when using a product. For example, when users browse items in an e-commerce app on mobile, they might want to switch to the desktop to complete a purchase. According to Appticles, 37% of users follow this strategy. They expect to continue a journey right from the place they were on mobile.

That’s why mobile app creators should synchronize user’s progress and allow them to re-engage with a product on a different medium.

12. Skipping the testing phase

No matter how much time you spend designing your app, even the most well-crafted UI and well-thought-out UX will ultimately contain some hidden flaws when put into the real world. That’s why it’s vital to test your app with real users on a variety of mobile devices to make sure it both looks and works great.

Here are a few specific tips for testing:

  1. Test early, test often. Don’t postpone testing until the end of your product design cycle. Test as soon as you got the first usable prototype.
  2. Ask real users to complete regular tasks in your app. The tasks should be the same as you expect your regular users to do. Based on results of testing you’ll be able to see how well the design really performs.
  3. Constantly measure your app. Testing shouldn’t stop after the product release. Treat your app as a continuously evolving entity — use data from analytics and user feedback to improve the experience.

Conclusion

People expect a lot from mobile apps today, and app developers need to work hard to meet these expectations. The app should be not only valuable and usable, but it also should delightful. Improving the user experience isn’t a one-time task, it’s an ongoing experience.

 

Nick_BabichAbout the Author: Nick Babich is a developer, tech enthusiast, and UX lover. He has spent the last 10 years working in the software industry with a specialized focus on development. He counts advertising, psychology, and cinema among his myriad interests.