Designing the front end of a Mobile App

As part of our Digital Design course, we delve into App designing, so we thought we would give you a few top tips to help with designing the front end of a Mobile App…

What is your app trying to do, what is it trying to solve? 

We advise our students to invest heavily in the research. What is the aim of your App and what are your main goals from this app? Creating user personas and user stories, we can help create an idea of the type of person this app would be aimed at, and what they would use it for. 

If creating an App for a client, research the brand, close competitors and remember to design the app that best showcases the brand. Having a detailed understanding of the brief is key. 

Your Screens

Brainstorm and come up with the pages you know you will definitely need. For Example; 

•    Home Screen
•    Logged out = Intro/Sales Screen
•    Logged in – Your Screen
•    Log in screen
•    Settings screen
•    Lost password screen
•    Account activation screen

Sketch it out

It doesn’t have to look beautiful, just sketch your ideas out! It can always help putting pen to paper and scribbling things out to give yourself a better idea of the user experience. Ask potential users what they think of the paper prototypes, what it is missing and what they like. POP App is a great tool to use for paper protyping, and Invision is another great free tool for protyping.  Find out more about building an App Prototype.


Cardtoss UI prototype. By Rahul. #UI #digital #design

A video posted by JMC Academy Design (@jmcacademydesign) on

The User Experience

You want your app to be easily usable, so the less screens you can bring up or send them too, the better. Think about;

•    Tap-to-edit
•    Swiping left and right
•    Two-tap delete
•    Automatic saving (after any action)

This should all happen seamlessly, smoothly and with proper feedback in response to taps without page refreshes.

Orientation, screen size and thumb placements are very important decisions. Placement of menus in reach of thumbs is a big topic in Usability/User experience design and should be considered carefully. For example, double tapping on iOS phones brings the top of the screen lower so you can reach stuff with your thumb. User testing is the way to find if this is working properly. You have to get a prototype in front of a user and have them do a “talk aloud protocol” test.

The Visual Experience

Although a client may want a visually dazzling design, you must ensure that the visual experience of the user is easy to read, and doesn’t give the user a headache! Make it simple and clean to read. A vital concern here is Typography. Take time to figure what fonts and sizes not only match the branding of the app, but are the best fit for the read of the App.

Watch our Typography series on YouTube. (Link)


Don’t forget to include shareability. Allow for easy sharing to all of the Social Media platforms – this is not only a pretty necessary feature on App, but can immensely help your own marketing. 

For more information about studying Digital Design at JMC Academy, click here.