Understanding Credit

More Americans are using credit cards every year, which means an important challenge for banks is helping their users understand (and improve) their own credit health.

About Backbase

Backbase is a fintech company that helps +150 banks around the world modernize their digital banking platforms. Designers and developers at Backbase will research, design, and build web and mobile banking products and features.

My Role

I was the main UX designer on this project working with 1 PO, 1 BA, 1 UX researcher, and two teams of developers (web and mobile). Our stakeholders included the Product Manager for Retail Banking, the Product Manager for Business Banking, and our Customer Success team.

Overview

Displaying Credit

Credit cards are a big aspect of American financial life, so more clients are requesting a banking experience that helps their users manage their credit card usage and monthly payments.

Our redesign was centred around understanding what type of information users found most valuable and making sure it was displayed in an easy-to-understand manner. The final product worked on a responsive website as well as our iOS and Android apps.

Requirements

Business Goals

⭐️ Get users to pay off their credit faster

⭐️ Find a way to visualize the credit card information (and make it easier to understand)

⭐️ Make the visual fit on different pages in the app

⭐️ Configurations for different markets

Requirements

User Goals

⭐️ Easily see the health of their credit card

⭐️ Be aware of any overdrawn or overdue payments

⭐️ Contextual quick actions

⭐️ Quickly identify which card is which

3

The number of credit cards the average American owns

100K

Adults with an income lower than this are more likely to carry a balance month to month

83%

Percent of adults with a credit card in 2020

User interview results

What is most important?

I worked closely with our UX Researcher to come up with a list of questions for five user interviews. Our goal was to understand what people look for in their credit card accounts and what is most important to them to maintain a healthy credit score.

"My number one priority is to see how much money I owe on my card"

"I have to know when my next payment is so that I don't miss it and decrease my credit score"

"I would like to know how much money I still have available to spend"

"I need it to be very obvious if I am late on a payment or if I have exceeded my credit limit"

"Ideally it would be easy to make payments to my card"

The challenge

Displaying Credit

Prior to the redesign, our interface only really prioritized one thing: how much is owed on the credit card. While our research showed that was the most important statistic users wanted to see, there were also many other pieces of information that were missing. Additionally, some of the important information that we did provide (like the credit limit, and next payment due date) were nested inside of the account details page amongst a huge list of other information.

Final design

Responsive Web

We decided to use a simple layout for the progress bar so that all of the information surrounding it could move easily between different breakpoints.

Final design

iOS & Android

The main challenge in native app design is the limited space. To address this, a different layout with alternative components was chosen compared to the web experience.

This allowed us to show more relevant information on the user's account overview page.

For example, An expandable container was used to conceal less important details while keeping them easily accessible when necessary.