Essential Elements of Good App Design

Essential Elements of Good App Design Image
Published: 13 February 2020 Content: PixelForce

Award winning apps all have a few things in common. They meet the needs of their users, they’re often the best value in their niche, they offer something unique, and they are widely considered to have good design that often sets the industry standards.

Think of your favourite apps, or even just a few popular apps that you probably use on your phone or computer. Facebook, Twitter, Uber Eats are a few examples of apps that are very easy to use and have dominated their markets.

In this article we’re going to go over a few ways an app developer ensures good app design over the course of their projects, and some things to consider to ensure both the client and end user are satisfied with the end product.

Designed to meet the needs of a user

In the early history of apps there was a bit of a novelty factor. It was possible to make a novelty app that looked cool and would sell well and generate you some money and publicity, but didn’t really do much beyond functioning as a tech demo. The wants and needs of the market have changed significantly over the last decade however, and now the novelty factor has fallen by the wayside as people use apps to fill functional gaps in their increasingly busy lives. Apps aren’t just for those people willing to spend a bit of money to try something cool and new, they’re for everyone.

A good product isn’t just something that grabs attention now, it’s something that’s designed first and foremost to be accessible to the end user and to meet their needs as a consumer - they have a problem and you solve it for them. An app isn’t going to last very long on someone’s phone if it’s not useful in solving an ongoing problem, and that means your app needs to provide functionality that the user needs.

With an ever increasing number of apps competing to solve the same problems, you also have to ensure your app meets a few other needs - costing less time and energy to use than any competing apps on the market. Your app needs to provide enough immediate usefulness for it to be worth a person’s time, effort, and money to download and use your app. If you’re charging a customer money to use your product and they find another product that does the same thing but is either cheaper or more efficient at solving their problem (or in other words better), you run a very high risk of losing them to your competitor.

Designed according to industry standards

Industry standards and mobile app development guidelines aren’t just arbitrary rules put in place to dictate what people do - in fact you don’t need to follow them at all. Most however, exist and should be followed wherever possible because they are built on tried and tested methods and processes that have been naturally selected over years due to simply being the best way to do something.

Depending on the app, you may not even be able to submit your app to either Google Play or App Store unless you meet criteria put in place by Google and Apple.

Designed to follow a logical order

While designing an app, it can feel tempting to find the most creative solution to a design challenge or user problem. However you should remember to ensure your app design follows a logical progression, and that a user can easily navigate your app.

For instance a user should be able to access most features from the home screen, and a page for app settings should be accessible from either the home screen or from a profile page.

Your web and mobile app design should follow a logical order

UX as a part of UI, and vice-versa

As we just touched on, the way a user navigates your app and the way they feel about your app are heavily connected. While you might think that a design element is going to win people over because it’s fancy and new, you may actually drive them away if it’s overly complicated.

At the end of the day, the user wants to be able to use your app because it serves a purpose, and unless the purpose of the app is primarily just to look cool - then chances are anything over the top is going to detract from the user experience by adding unnecessary loading and waiting times while the user is trying to navigate through your app.

Take for example a menu consisting of a drop down list vs a menu that requires a user to spin a wheel and then press a button. The latter may have a bit of a novelty factor that will engage the user the first time around, but it’s likely to become annoying to use after a while. On the other hand the drop down list isn’t very flashy, but it serves a purpose and the user is going to be grateful when they can quickly flick through your app without getting stuck waiting for your app.

The easier you can make it for your users to get from one screen to another in the fewest possible steps and with the least amount of hassle the better.

A/B tested to ensure best design and experience

Even with the simple options, there is almost always a large variety of ways to solve most design related problems, and sometimes the ideal solution may not be obvious. A/B testing allows you to refine your solution to the solution that provides the highest converting user experience.

So what is A/B testing?

Simply put, it’s a process of creating two or more solutions and presenting them to a target audience and then getting feedback on them.

By doing this, you can find out what works well, what works doesn’t, and refine your solution to maximise the positives while aiming to eliminate or reduce any negatives.

While there is often a cost involved in acquiring people to participate in A/B testing, it can be a very effective way to ensure you don’t lose paying customers in the future to poor user experience.

You should A/B test your web and mobile app designs

Easy to use with lots of visual aids - minimal text/jargon

A good app should be intuitive, and the user should be able to get familiar with using it without requiring a guide or external support. Large buttons with clear visual indications that tell a user where they will go or what they will do can significantly increase the user experience.

Visual iconography allows your app to be accessible to a wide variety of people as well as the ease with which it can be used. For example, using symbols rather than words allows users to navigate your app intuitively regardless of language proficiency or reading ability, and takes less time to interpret. For example: The shape of a house is likely to be interpreted as “home screen” regardless of language while “l'écran d'accueil” will confuse anyone that isn’t French.

You should also design based around users recognising rather than remembering bits of information. Humans are pretty good at filtering out a lot of “surplus” information to only remember what the brain deems to be important - and that means a lot of menu text and imagery is going to end being forgotten.

Good app design should be easy to navigate by its use of visuals

The design is in line with existing branding

The design of the app should be in line with existing branding associated with your client’s business, and if multiple apps exist or will be developed, then there should be consistency of design across all of them to preserve brand integrity and customer experience.

While the client should provide their branding guidelines that documents their design specifications for elements such as font, colours, and logo, the actual mobile app design and user flow should be left to the agency to decide on. This can give you a bit of freedom in how you approach the project and the overall look and feel of the app via branding, but the agency should still aim to provide an experience that reflects the feeling of the business itself.

Make use of “negative space”

This means you should try to include at least some blank space. Not every inch of the screen space needs to be occupied. It can be easy for a user to start feeling overwhelmed and lost if there’s too much happening, and people will lose interest if they have to use too much brain power sifting through a bunch of objects competing for attention.

Use spaces to break up some of the noise and allow users to process what they’re seeing more easily, and to draw attention to the most important elements of a screen.

Negative space helps prevent over-crowding visuals in your app design

Descriptive placeholder text

Placeholder text (or an input mask) is a string of characters (visible but usually greyed out and not selectable on a different visual layer).

Input masks are a great way to help users navigate your app and enter data by showing them what needs to go where. There are a few ways to implement this depending on the style of your app and the target audience. You can have explicit character-by-character masking to ensure they enter the correct information (such as a phone number), or you could have a broad description for a longer open text field.

Descriptive placeholder text or input masking can help your users

Accommodate users with limitations

There are a subgroup of people who struggle with apps for a wide variety of accessibility reasons. Colour perception, impaired hearing, weak vision, and lack of hand dexterity are just a few cases that can impact on uptake of an app.

While the use of green and red to represent positive and negative values respectively is a fairly common design choice, it can be hard for a person with red-green colour blindness to distinguish between values or graphs that rely heavily on reds and greens, and the option to use an alternative (such as blue and red) is a great help.

For a user with hearing loss issues, apps that use audio cues can benefit from the features of subtitles or phone vibrations instead.

If you want your app developed by a team that knows good app design, then check out our Discovery Workshop page for more information on our process, or get in touch with us today and book a free 30 minute consultation.