Gulf Bank Gulf Bank
Recent Case Study

10 steps to delightful banking using UX design


Design Agency

10 steps to delightful banking using UX design - Qubstudio

At a modern banking services market having a website, however functional, is not enough already. Mobile devices are currently omnipresent and allow their owners to conduct working duties and receiving services conveniently. Is it a wonder that more and more companies are expanding the list of their services with full-fledged mobile applications? Below we will discuss in more detail the specifics of banking apps development and, in particular, one of the main aspects – mobile banking UX design.

10 steps to delightful banking using UX design - 2J0A9215 - Qubstudio

Why UX Design for Banking Apps is Crucial?

The issue of developing mobile banking applications has several aspects:

  • The product must withstand easily heavy server loads (e.g. be scalable);
  • The product should be useful and informative for the widest possible range of users – of varying ages, degrees of mobile device knowledge, etc.;
  • The product should be as interactive as possible and contain dynamically updated content;
  • The product must have several language versions;
  • The product must be reliable;
  • The product must have the means to reach customer feedback;
  • The product must be adapted for people with disabilities (for example, in the US, compliance with the WCAG guidelines is highly recommended).

Note that each of the above points has equal importance.

Key Principles of Banking UX Design

In fact, there are several basic principles for creating a UX design that apply to all mainstream applications:

  • Provide unambiguous choices. You need to avoid creating complex interfaces that may puzzle users;
  • Choose proven methods of presenting the information. When developing products for the most extensive target audience, you should not be too creative. Instead, it is better to give preference to proven interface elements. On the other hand, it’s still worth analyzing and taking into account current trends – you don’t need the interface to become outdated before the project’s release, do you?
  • Use more graphics and less text. Users do not like to read large arrays of text; do not force them to do it;
  • Limit the number of functional elements. In one functional block, there cannot be more than 5-7 elements, otherwise, the user will not be able to keep information in their short-term memory;
  • Submit information in groups. It is desirable to break information on the screen into logical blocks (groups), so the user can percept it easier;
  • Do not hide the really important elements. All the important interface elements should be visible and appropriately highlighted;
  • Follow the three clicks principle. No more than 3 clicks should be made to move from one section to any other. The same rule applies to the start screen: any important information should be available in no more than 3 clicks;
  • Do not disperse similar control elements. Settings and controls should not be hidden in separate sections, but managed from one place, if it is appropriate.

Examples of Efficient UX Design for Banking Apps

As a prototype for the future product, we recommend choosing one of the well-known banking applications. So, in our opinion, it makes sense to at least partially learn from the developers of the following solutions:

The last three we will discuss in more detail in the following paragraphs.

Note that almost all of these products clearly demonstrate a purely traditional approach to the implementation of the very “intuitive, useful and convenient” interface. You can “modernize” your version a bit by adding animation elements and introducing the trendy technologies.

UX Requirements for Banking Products

Formally, there are six main requirements for UX design in banking applications:

  • Personalization (the presence of the user account, the ability to “bind” your data to it, etc.);
  • Security (any solution involving personal user data should guarantee its security and privacy);
  • Adaptability to various formats of mobile devices;
  • Intuitiveness (the user should have no doubts about how to reach the functionality they need);
  • Conciseness (it is not necessary to overload the interface with static functional elements – this can confuse the user; it is better to put some of them into drop-down menus);
  • Aesthetics (compliance with all the above points should not contradict the aesthetic perception of the interface).

Functional Features

Next, we present to your attention a list of functional elements that must be present in any banking application that thrives for success:

  • Registration form;
  • Authorization form;
  • User profile with settings panel, transaction history, display of current account status, money transfer option, the ability to invalidate a card, etc.
  • Online feedback form;
  • Services menu;
  • Map of bank branches and ATMs;
  • Currency calculator;
  • Newsfeed.

The overwhelming majority of these capabilities are already implemented in existing APIs, you have only to thinks of ways to better present them to your users.

The Step-by-step Guide to UX Design for Banking

Now is the time to start working on the UX design of your banking solution. This task can be divided into the following 10 fundamental steps.

1. Define client portraits

Since banking solutions cover a fairly extensive consumer segment, there will be multiple portraits of potential customers: students, housewives, business owners, salary workers, retirees, etc.

2. Consider what would be most valuable to these users in your product

Obviously, in the case of banking solutions, these would be such features as a convenience (“Why should I go to a bank branch if I can solve my problem through the Internet?”) and additional services not available in offline departments.

3. Create custom client feedback scripts

At this step, you should simulate situations that would force your potential users to contact customer support and define the most viable reactions to their requests.

4. Form user flows

Now try to describe all the steps towards the realization of user goals (within the framework of your product).

5. Optimize all the user flows to three actions maximum

The fewer steps to achieve the goal – the better.

6. Group the topical functionalities

If the capabilities of your product are too extensive, it makes sense to group them into several categories (in practice, they are usually distributed over several tabs or placed in a mega-menu).

7. Consider which items should be placed in drop-down menus, and which – visible immediately

You shouldn’t hide all the functional elements in the drop-down menu. Features such as user profile, authorization form, feedback form should be reachable immediately from any page of the application.

8. Employ at least some of the modern UX trends

This will increase the credibility of your service in the eyes of the target audience. Some of these trends we will discuss below.

9. Create layouts

Layouts allow assessing how successful your app functionality’s presentation would be from the visual and practical points of view. In the case of failure, you can make edits in minimal time.

10. Test the design on real users

As you make changes, remember to test them on your focus group. Sometimes these “enhancements” only make the interface more confusing.

Psychology Tricks in UX Design for Banking Products

Comprehending the basics of human psychology plays a significant role in the effectiveness of the UX design agency work. When creating a UX design for your banking solution, we recommend that you take into account the following psychological principles:

  • Hick’s law. Hick’s law states that the time needed to make a decision increases in direct proportion to the number and complexity of available options. Therefore, the fewer steps there are and the simpler each of them – the better.
  • Miller’s law. Miller’s law states that the average person can store about seven elements in their operational memory. Exceeding this boundary will confuse most of your users.
  • Habitual usage patterns. Most platforms, such as Android, iOS, Windows Mobile, etc., have design patterns such as control elements, gestures, and panels. Users quickly get used to the fact that certain actions lead to certain results regardless of which application they use. Software that requires that user studies new gestures causes acute discomfort. Follow the platform design guidelines to increase the quality of user experience.

Target Audience Research

Target audience research is an essential step in creating a truly high-quality design. In particular, you will have to find out such data as age and sex, marital status, the geography of residence, education, profession, level of income, cultural level, etc.

10 steps to delightful banking using UX design - img2 - Qubstudio

Next, you will need to determine the values of the designated target audience. Why prospective users would want to use your services again and again? Most often, the answers to this question would be statements like freedom and independence, attention and respect of others, friendship and love, development and self-realization, etc.

Further, you should understand that the correct design should eliminate the pain points of users. In the context of banking, these may be lack of time, unwillingness to communicate with people in real life, insufficient income, etc. Note that it is impossible to solve absolutely all user problems; therefore it is much more rational to choose 3-5 main problems and focus on solving them.

Finally, think what exactly future users expect to find in your application. Most likely, this is usability, confidentiality, the security of personal data, and specific functionality, typical for this type of software. The latter can be established by assessing the capabilities of existing products and feedback from real users.

UX Testing

Most modern developers begin product creation with the implementation of a compact set of core functions in order to understand how end users would perceive them. Such limited solutions are called MVP – apps that contain minimal functionality sufficient to meet the needs of the target audience.

Therefore, before developing and releasing a full-fledged product, start by creating an MVP and testing it on a small group (sample) of users. This will help you to understand whether your team is moving in the right direction and to spend the budget most efficiently.

As your target audience adopts an MVP, you will be able to gradually increase functionality, complicating and improving it up to the final product.

Things to Avoid When Creating a UX Design for Banking App

And now – a few typical mistakes that designers make when creating banking solutions:

  • Excessive creativity. Implementing the most daring creative ideas to stand out from the competition is definitely not the best move for banking products. In order not to overload users with information and not lead them into cognitive dissonance, try to follow the traditional UX design schemes for mass products.
  • Excessive use of pop-up notifications. You should not overuse the possibility of sending messages. Leave this feature only for really important notifications.
  • Trendiness over clarity. The pursuit of aesthetics and innovation in UX design for banking often leads to sacrificing such important components as intuitiveness and comprehensibility. Therefore, think twice about the introduction of a particular trendy concept, if it would complicate the usage.

Challenges You Can Face

Based on the foregoing, it is possible to distinguish three most frequent challenges that the UX designer for banking solutions has to face most often.

  • Desire to create a universal design. Forget about the concept of “universal design”. When it comes to a mass product it is clearly useless. Every existing platform has its own design guidelines, principles, and trends. What works for Android may be inconvenient in iOS, and vice versa. To provide users with the most comfortable usage experience, each separate app version should have its UX designed almost from scratch.
  • Compromise between high-tech and clarity. When a bank makes a decision about introducing a new service inspired by the most modern technological trends (for example, blockchain), UX designer is faced with the difficult task of correctly promoting this service to users (how to explain to an ordinary person what a “smart contract” is and how to use it?). In such a situation, it makes sense to thoroughly understand the principles of operation of a particular feature in order to understand how to present it as accessible as possible to all the subgroups of the target audience.
  • Rigid interface. As new opportunities appear in your solution, you will have to complicate navigation, which, in turn, may entail certain difficulties in mastering it. In order to prevent this from happening, you should plan in advance the navigation elements so that you can add new functions almost indefinitely.

Best Practices of Banking Product UX Design

Here are some helpful tips on improving a banking app UX design:

  • Do not spam notifications. We already mentioned this and will repeat it again: excessive sending will only cause the user to mute all the notifications from your app or even stop using it.
  • Envisage the personalization settings. The best service, as practice shows, is a personalized service. Therefore, do not forget about the possibility of adapting the interface for a specific user.
  • Carefully consider the search interface. When creating a search function (for example, in a news feed), do not forget to provide a few additional features for the convenience of users, such as sorting and filtering options. This will allow them to quickly find what they are looking for, even in fairly large samples.
  • Optimize onboarding. Onboarding is the process of mastering the capabilities of the product on the first use. Your task is to make the user experience smooth and eliminate the obligation to use tutorials and the help section (as is the case with highly specialized products, like frameworks).
  • Create an adaptive/responsive design. Treat the users of all intended platforms with the same care. One of your main goals is ensuring the universal availability of the company’s services from any device.

Banking UX Design Trends to Watch for in 2019

A few words about the banking UX trends of the current year, which can be embodied in your solution:

  • Voice control. Providing the ability to control navigation using voice commands is a decisive step towards adherence to the provisions of the ADA. Just imagine that thanks to this feature, even people with partial paralysis of limbs would be able to use your product.
  • Artificial intelligence-based chatbots. The introduction of such chatbots will relieve your bank from the need to constantly expand the call-center staff. Instead, typical questions would be answered by the pre-trained artificial intelligence.
  • Biometric authentication. Authorization and authentication based on biometric parameters are considered one of the safest. In turn, from the point of view of UX, this will allow users to save time and also not to remember long passwords (which often represent an arbitrary set of characters).

Case Studies

Below we will present to your attention three successful interpretations of UX in the banking industry.

Simple Bank

The first example is the Simple Bank application, created as an independent solution. It is characterized by the utmost clarity of all interface elements and their adaptation to users with different levels of knowledge. Here you will not find anything superfluous, no distracting or annoying elements. This mobile application can “boast” almost entirely positive user reviews.

10 steps to delightful banking using UX design - download - Qubstudio


This New Zealand software product has become the prototype for many similar solutions in other, less developed countries. All the information is presented very simply and intelligibly. Its winning features are the pleasant green-and-white color gamut and thoughtful typography, which equally well represents the printed content, regardless of the format of the device carrier.

10 steps to delightful banking using UX design - img3 - Qubstudio


German N26 is one of the rare yet mobile banks. In this banking app UX design, you will surely enjoy the logical presentation of navigation, the calm colors, and the concept, implying a concise, metered delivery of new content. Overall, this is a perfect solution for mobile users.

10 steps to delightful banking using UX design - unnamed - Qubstudio

UX Design for Banking: Conclusion

Let’s sum up. As we see, the development of UX banking apps is quite an arduous task. We suggest not acting at random and immediately turning to the aid of professionals. In this case, you will receive complete confidence that the implemented project will fully meet the expectations and needs of users, and increase your credibility in their eyes.