Tip-top tips for your mobile app UI design

Photo by bonneval sebastien on Unsplash – design in progress

Unless you’ve been in the app game for a while or have some previous design experience, it can be a challenge to create an intuitive mobile application.

We all use so many apps on a daily basis, it’s easy to forget that it’s somebody’s effort that goes into deciding where a button goes, or which shade a menu is. Think of an app that you use often – do you remember where all the navigation elements are? Is the menu tab on the top or bottom? Is the settings button in the left or right corner?

If an app is intuitive, you probably won’t have the answers to all these questions. You use it automatically, wasting no effort on remembering the positions of the commands.

However, creating an intuitive app can be incredibly difficult. This is why we’ve compiled a list of tips to help you check off each aspect and make sure your app is so intuitive nobody will remember anything about it (that’s a joke, fyi).

⦁ Home screens are not the first thing a new user sees

Too often, great designers forget that a home screen, while important, is actually not the first visual of the application that appears to the user. It’s preceded by a little something called a splash screen – you know, the one that appears while the application is loading to open. If you’ve ever played Pokémon GO you must have seen their elaborate, colourful splash screens that play on a sense of adventure that is a key element of the game.

Some of the splash screens used by Pokémon GO since its launch.
Some of the splash screens used by Pokémon GO since its launch.

⦁ Not all apps can be intuitive.

Just because you and your test group agree that an app makes sense, doesn’t make it so for everybody. A wise idea would be to set up an onboarding tutorial for new users – nothing too fancy, no page-long texts and explanations. Just a few pop-ups pointing them towards the key functionalities of your app. Click here, drag here. Done.

⦁ Table your menu.

A lot of developers get overly creative with the menus of their app. It has a simple function – but it can be destroyed with something like over-cluttering or animations. Nobody wants a menu that slips in and out of focus, zooms out of its corner and covers the screen randomly. Nobody wants a menu you need to scroll down like it’s the terms and conditions of a VR app. Stick to the important things and make them as clear as possible!

⦁ Signing in is only possible after you sign up.

If your app requires authorization, don’t forget to make your sign-in screen a clean one. Two fields are enough – email and password. However, you also need to make a sign-up option visible, since it precedes the everyday use of the sign-in. Many an app has made this initial mistake, which really put a low roof on their user list.

⦁ An image looks different on a phone screen.

You’re probably going to use some images in your app. How complex they are depends on your app’s function, the general design etc. What you should make sure of is the quality – a photo on a screen preview viewed from your desktop is different than the one that appears on the phone itself. Fight the fuzz with some professional stock and rest easy knowing your app looks amazing.


There are plenty more things that you need to consider, but most come with the types of applications you’re building. If you really want to make your life easier, go for a ready-made UI framework like our own Multi-purpose starter kit. It’s got all the bells and whistles for a great app, and it comes with all the documentation you need to use it, as well as a dedicated team to support you in case you run into some issues. It’s a bargain!

Read next on DevsPush Blog:

Ionic 5 Templates Top 10
Monday 27 April 2020 by DevsPush

Ionic 5 Templates Top 10

For beginners or experienced developers, here are the top picks for Ionic 5 templates!

Going Native for the Holidays
Wednesday 22 April 2020 by DevsPush

Going Native for the Holidays

What’s the best attitude for the New Year?

How to add Firebase to your web app
Tuesday 24 March 2020 by DevsPush

How to add Firebase to your web app

Add Firebase to your Cloud project, configure your authentication settings, and then add Firebase to your web service.

deco shop

Subscribe for discounts, updates & new products!

We’ll never ever share your email address with anyone.