Minimizing the cognitive load of UI

Devideal
4 min readApr 22, 2022

Many developers at the beginning of their career have failed to create UI by their own. It may be a real struggle, but if you notice some mechanisms of functioning of the human’s mind, it will becone much easier. In this article we will explain how the human brain behave when using mobile applications and provide some tips for designing user interfaces.

Photo by: Shvets Production

Let us start with explaining the concept of cognitive load. The human brain works similarly to the computer and has limited resources that can be depleted with too much stimulus, which can lead to the loss of performance of our body. In short, cognitive load is the mental effort required to learn new information. In the case of the UI it plays a key role — after all no developer wants users to leave the application because of a disincentive. In this respect, it is worth to understand how human brain works while using mobile apps and how to use this knowledge to create presentation layer of the project. Using the application always involves the cognitive load for users. In situations such as checking electronic ticket numbers or reading news we are unable to limit the mental resources user use, but we can reduce them in the case of the navigation.

In many applications there is a need to distinguish the users. That’s why it is normal to create authorisation page, where users can register. Now let’s take a look at the whole situation from the user’s perspective. Creating a new page, itself, increases user’s cognitive load. Therefore, in most cases we should not authorise and if it is necessary, the option to sign-in as a guest or through social media is a good way to keep things easy for the user. This can encourage people to complete the data during registration. What’s more, with classic registration on mobile we should not require to enter the password twice. It is a common solution for desktop devices which is used to prevent mistakes when entering a password. On smartphones it may be more damaging than good, among others because of the difficulty in entering data. It is more recommended to implement a show password function, so we will minimise cognitive load and reduce the chance of mistaking for registration.

A comparison of the authorization pages of two different applications. You can see at a glance which one will discourage users more (left: Adidas Running app, right: Sports Tracker app)

Another major aspect is the form of interaction between humans and the app. In case of, for example, a navigation bar that is too large and complex, the user is most likely to stop using the application. It is best to use already popular solutions that are used natively on target platform, otherwise try to make navigation as easy and intuitive as possible.

A brief introduction of the user in the navigation rules is a popular practise in mobile applications. It is called Onboarding, which is often unnecessarily increasing the cognitive load for users. Although we should remember that in some cases it may work — for example for unusual interfaces. Normally it is not necessary to explain that clicking a gear icon button leads to settings. It is a very common procedure and by explaining such fundamental issues, we will only discourage our audience. Therefore, in the vast majority of cases, it is best not to use Onboarding.

After looking more closely at the navigation, you should be aware of the tasks that users need to perform in the application. Go through the app and ask yourself some questions. Is confirmation required in this situation? Should the user be notified here? Does the user need to close the window? Is this dialog necessary? Do you need to view this data only after you click the button? By eliminating the elements that only create unnecessary actions, the app will become more natural and enjoyable in use.

An example of overloaded UI (left) and optimized UI (right)

Finally, let’s study what data our application represents and how it does it. Let’s eliminate repetitive links, redundant information and unnecessary images. If something is not absolutely required, consider on eliminating that thing or think where better this thing would fit. Of course, as in all, the above advice should be used in moderation. In short, keep things easy, intuitive and lean on popular solutions used in mobile development so your applications will become more pleasant and accessible to users.

Written by: Patryk Bożek

--

--

Devideal

Software development company creating innovative mobile apps in Flutter.