• Innovation
    • Improve Efficiency

The art of UX design in Financial Services

  • Article

UX design is the process of using data and an empathic understanding of end users to create meaningful experiences that enable clients to do what they do faster and better.

Creating better UX is not a one-time event. It is an ongoing journey, with new capabilities being added over time, as end users’ behaviours change in a continuously evolving technological environment. When was the last time you saw a product that made you think, “This is a great design”? Maybe it was an iPhone, an Amazon Kindle or the Victorinox Swiss Army Knife. What do these designs have in common? They are simple – they solve the user problem or fulfil the user need in a way that requires the least amount of effort. The need to consider the end user as a source of truth on direction, usability and feedback to drive the success of a product is the basis of great user experience (UX) design 1.

UX design: history and definition

Source: A brief history of UX design and its evolution (thenextweb.com)

Today, UX has become table stakes, with most industries employing UX designers. UX, in a nutshell, is defined as encompassing “all aspects of the end user’s interaction with the company, its services, and its products”2. This might entail browsing an online banking interface, interacting with a physical product (like driving a new electric car), or taking advantage of a service (checking into the airport lounge for example). This means that UX is more than just the design of the product – it is about an integrated set of experiences for the user.


The meaning of good UX design: importance and impact

The world has become more digitised, and as our lives become integrated into the virtual world, the importance of good design in UX and user interface (UI) has never been more essential for digital products and services. People make fast judgments and take about 0.05 seconds to form an opinion about a website to decide if they will leave or stay3. Based on research, a good first impression leads to a longer visit on a website or an application4.

Source: Importance of UI UX design (sblcorp.com) | Before UX there are four separate buttons for message, view, share, and follow while for After UX there are only two buttons for message and follow.

With one trillion dollars spent each year globally on software development, behavioural scientist Dr Susan Weinschenk estimates that three out of the 12 reasons why projects fail are attributed to user experience failures5. But the right UX design can bring many business benefits. For example, Walmart’s redesign of their ecommerce site resulted in a 214 per cent increase in visitors6.

UX and UI work closely in sync and are dependent on each other. A study from Forrester Research states that a well-designed UI could raise a website’s conversion rate by up to 200 per cent, and a better UX design could yield conversion rates up to 400 per cent7. Other benefits include a lower cost of customer acquisition, lower support cost, increased customer retention and increased market share8. From a business perspective, good UX design is beneficial, as “for every dollar spent to resolve a problem during product design, USD10 would be spent on the same problem during development, and multiply to USD100 or more if the problem had to be solved after the product’s release”9.

Source: UX vs. UI Design: What’s the Difference? (louelledesignstudio.com) | UX includes user research, personas and usability testing while UI includes interaction design, layout and visual design.

The value of design thinking

Design thinking is a user-focused iterative process10 that develops an understanding of the user, defining their issues and identifying new creative solutions through a process of creating and testing a hypothesis11. It is imperative to note that this is not a step-by-step or linear process. Each phase of the design thinking process can run in parallel to others and be repeated several times as needed. Collaboration with people in other disciplines is also key in the process, as they can contribute insights from their unique perspective and experience. Design thinking also focuses on achieving results and solutions that are technically feasible, economically viable and desirable for the end user12.

There are several design thinking models such as IDEO’s human-centered design ideology13, the British Design Council’s Double Diamond14 and the Stanford d.school design thinking process (see image)15.

Source: The Good, The Bad, and The Wicked: Thinking About Design Thinking - Form3 Design

In recent years, there has been a shift in focus to creating rich user design experiences as users become more intuitive when navigating the digital world. Financial institutions, for example, are increasingly realising the importance of providing their customers with feature-rich mobile banking applications that are easy to navigate and use16. Without a seamless digital banking experience, it is difficult for banks to improve customer satisfaction and win the hearts of digital natives such as Millennials and Gen Z17. Research also shows that users now spend 10.8 times more time on FinTech applications – which are usually designed with UX in mind – than traditional banking applications18.

Facing the pressure of FinTech disruptors, financial services providers are actively looking at improving the user experience of their customers through design thinking. For example, Bank of America increased its online banking registration by 45 per cent after a UX redesign of the process19.


Design thinking applied – evolving our client’s platform experience – a case study

In Securities Services, our portal experiences have traditionally focused on moving data from core Securities Services platforms into our client’s domains for onward use. Providing clients with accurate and timely data via these digital mediums has shaped operational processes and defined parts of our client relationships.

In recent years, the adoption of new digital technologies has changed how we move and consume data, resulting in a shift in client expectations – clients now want user journeys that are efficient and deliver results quickly. Through understanding the needs and goals of our clients, and more importantly, the data needs of the people who work in roles across our clients’ organisations, we realised that they are looking for a fast and reliable digital experience that can allow them to retrieve key information seamlessly by reducing distractions from their workflows. In response we have adopted HSBC Evolve which provides users with a personalised portal experience utilising web technologies such as Progressive Web Applications (PWAs).

Banks traditionally provide digital services, including client portals, that are accessed from an Internet browser. From a client’s perspective, starting a PWA feels very different to browsing the Internet. PWAs are traditional websites that look and feel like an application installed and running natively on the device, be it a desktop, tablet or mobile20. In short, they use modern web technologies to deliver app-like experiences21. For a start, the end user has an application icon on their device that takes them directly to the experience or service they are looking for. After user authentication, the PWA opens instantly and the framework of the app appears immediately, including menu system and content containers, the latest content downloads to fill the containers. Most importantly, the user does not have to navigate the web to directly reach the service they need.

As we looked to develop HSBC Evolve Securities Services applications that fulfil client’s needs, we implemented design thinking principles. In each case, we have endeavoured to walk in our client’s footsteps, and suspend our expectations and beliefs about the client to gain insights into their experiences, motivations and challenges.

HSBC Securities Services Design Thinking Methodology sing Empathize, Define, Ideate, Prototype and Test.

Case study

In the design process of our suite of Securities Services Net Asset Value (NAV) Oversight applications, for example, we used the Stanford d.school’s design thinking theory. There are five phases in this process: Empathise, Define, Ideate, Prototype and Test. During the Empathise stage, we ran a series of interviews to observe, understand and discover the challenges users face when employing the existing client portal to monitor the NAV of their funds. We sought to understand the why – why are clients doing what they are doing? What is important to the client? What are their expectations? We also paid attention to what end users do and not only to what they say.

User digital interactions can be thought of in two categories: high-value and no-value. Through these client interviews, we observed that throughout the journey an end user will spend time starting, searching, logging in, navigating menus, filtering and exporting NAV data – these interactions are the no-value interactions, they are the means to an end. Analysing and interpreting NAV data and enabling decisions are the high-value interactions. At the Define stage, using insights from the Empathise stage, we framed the problem statement as how might we reduce the no-value interactions and maximise the high-value interactions for our clients when they monitor the NAV of their funds?

Prototyping ideas is a crucial step of the design thinking process. It is an efficient way to identify improvement areas, or to shut down concepts that would not work, saving time and investment. When we developed the suite of NAV Oversight applications, we created wireframes and prototypes for a visual representation of the features and then tested them extensively with end users. By the time we started developing the applications, we were confident about the design because it had already gone through multiple design iterations and had end user feedback on the experience and functions.

Throughout the entire design process, we also kept in mind the concept of accessibility. We need to provide products and services that are “accessible to the widest possible audience, regardless of technology or ability”22. Accessibility is “a measurement of a user’s ability to use products/services, the extent to and ease with which they can meet their goals”23 and is based on four main principles; perceivable, operable, understandable and robust (Web Content Accessibility Guidelines Version 2.0 (WCAG 2.0))24. Our applications are designed with accessibility in mind. We always review our finished applications with a specialist independent external agency that tests our applications to ensure that they meet industry accepted accessibility standards as mentioned above25. For example, when accessing HSBC Evolve applications, end users can enlarge content up to 200 per cent using browser functionality.

Collaborating with our end users has enabled us to reimagine our client portal experience, focusing on things that our clients tell us matter the most to them, such as speed of access, accurate, timely data, simple intuitive interfaces and rich feature sets.

Screenshot of HSBC Evolve platform interface

What next?

So, what does the future of UX design hold? In recent years, the introduction of exciting and new technology such as Augmented Reality (AR) and Virtual Reality (VR) have created a new world of interaction between users, digital products and applications. More recently, the Metaverse has gained in popularity, and it is seen as the next step into the future – a new way to view the world and its reality.

Whatever shape it takes, we must ensure we are able to capture meaningful data that can enhance our designs as the virtual world takes shape.

No matter how technology progresses, the fundamentals of UX design – which is staying focused on what the user really needs and how they feel comfortable interacting with a product, is still key and paramount. This is because exceptional user experience is never about the latest technology — it is about fulfilling deep-rooted human desires and needs.

Further insights

On the Yellow Brick Road to Web3 and the Metaverse

You might have thought we'd already digitised it all, but the Metaverse is proof that we can imagine beyond the current applications of the internet. HSBC's Securities Services Digital and Data team explains more.

Need help?

For more information, please contact your HSBC representative.