7 Quick 101 Lessons in UX/UI Design for Mobile Apps

March 28, 2017

So, you have a ground-breaking concept for a mobile app. You’ve worked out how it will function, what purpose it will serve, and why people will be clawing to get their hands on it.

But have you stopped to consider the design?

Strong UX/UI design is much more than simply looking good. It covers how users engage with the product. In order to effectively navigate your users around your app, it is vital that you employ best-practice design methods.

If an app is too confusing to operate, users will immediately ditch it. There needs to be a logical structure that not only points users in the right direction, but also gives them an enjoyable experience in the process.

To give you an idea of what works and what doesn’t in mobile apps, here are our top UX/UI design tips.

1. Bottom navigation is key.

Mobile users are thumb-happy. In fact, Steven Hoober, president of 4ourth Mobile, has found that 49% of people rely on just one thumb to get things done on their smartphones. The average person’s thumb will comfortably reach a little over half-way of the screen’s length; therefore app designers should place frequently-used actions at the bottom of the screen. Consider Facebook’s tab bar: all the important features are neatly displayed in a row in the bottom tab bar of the app.

mobile app design

Representation of the comfort of a person’s reach on a smartphone. Green = ideal reach; yellow = requires some stretch, red = requires users to shift the way they’re holding the device. Image source: uxmatters

2. Only show three to five top-level destinations.

App users don’t want to be bombarded with tap targets. Overcrowding your tab bar with too many features can make it difficult for users to select the one they want. It’s a good idea to keep under five, and to allocate your remaining destinations in alternative locations, such as a drop-down menu.

3. Keep things minimalistic.

This effectively ties back to the previous point. A stripped-back, clutter-free interface draws users’ attention to the most important options within your app – the ones that will keep them engaged or trigger a transaction to take place. The key ingredients to minimalistic UX design include:

  • One typeface throughout the entire app;
  • A colour scheme that’s either monochromatic (i.e. different tones, shades or tints that belong to a specific hue) or analogous (i.e. three colours that sit next to each other on the colour wheel);
  • Blur effects to overlay information whilst providing context and hierarchy;
  • Avoiding lines and dividers to delineate sections, and relying on elements and spacing alone.

4. Employ a familiar framework.

Sure, making your own unique mark on the industry is encouraged, but there’s a reason some apps have succeeded while others have flopped. As such, it’s important to seek inspiration from other apps. Take the time to consider a few of your long-term favourites, and thoroughly study their design – where is your eye drawn to? Which parts are easily reachable using your thumb? How clear and concise is the presentation?

5. Reduce information to bite-sized chunks.

Consider exercise apps. They break down volumes of data into easily digestible snippets – from distance of kilometres travelled to calories burnt and time taken. Similarly, most apps employ widely-used icons to indicate different locations within the app rather than spelling it out for their users. Simply put, the limited screen estate you’re dealing with means you need to get brutal with how you convey information.

6. Consider employing a dynamic interface.

With app technology evolving and newer operating systems trickling in, more and more app designers are climbing aboard dynamic UI. We’re talking things like location-based context, depth-of-field technology, button animations that resize and rotate, and moving particles. Though these aren’t essential elements to add to your design, they will almost certainly help you increase downloads, engagement, utility and repeat visitors.

7. Test your assumptions

You can put yourself in your user’s shoes as much as you like, but at the end of the day, you will never possibly know exactly how people will respond to your app. It’s vital that you get a second opinion (or several) – after all, when you’re dealing with a project on a continual basis, you start to become immune to it. Engage in user testing with real people, and be open to all feedback. You might need to take a moment to remove your emotions from the equation, but at the end of the day, getting a sneak peek of how your app will perform in the real world will save you plenty of headaches (and potential profit losses) later down the track.

Above all, remember: you’re designing for the subconscious mind

Your app should be designed in such a way as to spoon-feed only the essential information to your users. In doing so, you can effectively craft an app that quickly becomes an extension of your users’ lives – one they rely on to complete everyday tasks in a highly convenient and stress-free manner.