In the previous article, we discussed the change in design trend between 2012 and 2013. In short, less is more, meaning simplicity is the new wave in mobile and web design. The purpose of this article is not to show you how to make a creative and eye-catchy design. It is meant to give you practical advice on what to pay attention to so that your product would have great UI that goes well with UX, and better yet, reassert your brand.
Table of Contents
1. Purpose of the app
This is by far the most important element of an app, meaning UX thinking. ‘If you don’t know why and who before you come up with what, you’ll end up creating nothing for no one,’ Whitney Hess, UX Consultant. So whenever you draft the layout, the typography, the colour for the app, you should start with asking yourself ‘Why do I need this?’ Also, avoid the temptation of adding decoration or details that do not make so much sense for users. I love this metaphor by Bruce Lawson: If I go to a training website, I don’t really want to see a picture of Richard Branson smiling at me, I don’t want to read the Chief Exec’s ambitions and life history. All I want to know is what time my train is and how much it is.’
The designer should think about how the content, or the information to be conveyed to users, will be displayed to users. This is essential so that you might want to put it as the first priority, together with the purpose of the app.
3. Design for the mobile app as an integrated part of product branding
The style of the app says many things about yourself, who you are, the core values that you pursue, the purpose of your business. So think about how you want to position your product in the app design. Also remember to make use of your brand identity, logos, colours, and so on in the mobile app. There are many styles of logos. However, two basic elements to identify a brand are its logo and colour panels. The position of the logo might vary, but most popularly, on the splash screen and home screen, otherwise the main detail screen. One app should have two main colours, and one to two colours to highlight buttons and icons.
Hotels Everywhere (by Savvycom) app with 2 main colours: red and dark blue throughout the screens
4. Simple layouts
The app should be clean and easy to read by creating sufficient space between texts and images and among each block. As a result, essential information shall be designed to stand out. A popular practice now is to follow the grid layout as follows:
Flipboard app with big blocks, clean background and large photos
5. Font and colours
The balance should be ensured throughout the design of an app. Balance is shown by the reasonable contrast of major and minor information. The title will be emphasized through the choice of big and clear typography. As the level of information importance descends, the fonts become smaller. In terms of colour, the focus of the app will be illustrated by two or three main, contrasting colours without decoration so that the design is kept as simple and focused as possible.
6. User context
The app should be designed in line with a purposeful context. For example, if you are designing an app for shoppers that can compare prices, item information and manage shopping lists, you should be able to visualize the context of users when going shopping. Users are busy with shopping and only have one hand to use the app. This will have a fundamental influence on your design.
For example, if users want to search for a location, the Search box and button should be very visible and convenient for their thumb. Smartphone users are not willing to spend too much time for a task, and the task is the reason why they come for your app. If your product slows this need down, surely it will be removed right after use.