CUNO
open banking system

UI/UX and brand
Project scope

Consultant teacher:
Zoltán Csordás


Cuno is a UI design exploration for an open banking platform that I created as part of my thesis research on banking information architecture. Cuno embodies the essence of my research findings, which I implemented through various design approaches.

Hypothesis: The cognitive load of bank systems is too large, making it difficult for users to effectively manage them.
02.
Discovery

Defining the problem

The hypothesis suggests that the cognitive load, or the mental effort required to understand and use bank systems, is too large, causing difficulty for users in navigating and effectively managing them. The hypothesis tested through research  such as user interviews, surveys, or usability testing.

Survey and interviews.

In the survey, I gathered data on people's perceptions and experiences with their own banks. Among other results, it showed that 92.2% of respondents trusted their bank and were overall satisfied with the basic experience of their online banking platform. However, when asked about whether its services met current needs, a majority of respondents had negative opinions. The problem seems to be that banks in Hungary are not putting effort into updating or creating new digital products that reflect their customers' needs. This pressure has increased in recent years with the emergence of fintech companies. It was interesting to see that most of the negative comments were about the user interface.

03.
Wireframes

Starting point

Extensive research and interviews preceded the development of the first wireframes. I spent a lot of time testing low-fidelity menus and submenu variations, and after several tests, I knew to which direction I should move. Because the system was very complex, I heavily relied on continuous testing and explored all the important questions about information architecture on my checklist. I then created a new information flow and focused on how people interact with different layers on the interface. After that, I started building high-fidelity prototypes, specifying the distances, colors, highlights, and typography in detail, which served as a base for the final design.

In Hungary, 80% of respondents believe that their bank is a "mandatory" service, and only 20% responded that their bank is trying to be a personal financial tool to help with their finances.
04.
User interface

Mapping out information flow

Started by conducting interviews and testing small functions to figure out how to approach the leading problem of creating a visual connection between main and secondary information in the menu system. I separated the prime functions mostly used by users and sorted the submenus and functions.

This allowed me to create the first visuals for the menu system. Through testing and interviews, I tryed multiple layouts and found that some of the layouts used by banks increased stress for users. Ultimately chose a side-bar-style layout.

To manage the large amount of information, I also expanded the information layout to the y-axis, which helped to categorize the information and made it easier to arrange the sub-menus. This layout was inspired by the registers used in books.

05.
Brand

Standing out and building trust

Standing out and building the trust and safety of the user is a fundamental concern, and building trust is the most important goal. The brand has to reflect on this will. There are various methods for gaining user trust. From a brand perspective, you have to be consistent and clear, avoiding dark patterns.

In marketing, promotional and landing pages also affect first impressions. Poorly worded CTA buttons or unlogical organization can severely damage the user's trust relationship with the brand. Research by Laberge and Caird found a significant correlation between the design of the banking UI interface and the potential trust of users in online banking systems. The study also showed that the brand's communication is almost as crucial as a user-friendly UI in determining the user's trust.

I used Egger MoTEC's trust/commerce model to validate the brand I created. This model has four main dimensions: interaction filters, interface properties, information content, and connection management. This includes the brand name, user experience, and service performance.

Visual

I created a highly recognizable brand, with a bright blue background and white to be more accessible. Consistency was the main focus so that I could scale the brand across every platform, from print to web and UI design.

"The goal is to develop a user-friendly banking platform that simplifies accessing and managing financial accounts."
06.
Conclusion

It is crucial to establish the impression of being a "personal financial partner,", finding a balance between a friendly and proffesional visual appearance. It is important not to fall into the trap of being a "cool bank," as people entrust their money to institutions. (There is a trend where startups [Revolut] approach their visual appearance from a more playful, more free side, but after raising additional capital and expanding their customer base, they immediately change their focus towards functionality and the brand becomes stricter).

Creating trust is extremely important and must be communicated not only through the brand but also through the UI. The finance industry is not the place for "fancy" solutions. Information systems must be consistent, familiar and usable, as well as transparent and well-structured.

Back to the homepage