UX Research | Content Design | UI Design
Expanding Financial Literacy with the Consumer Financial Protection Bureau
01
OVERVIEW
Context
Client
The Opportunity Project with the Consumer Financial Protection Bureau
Duration
August 2023 - January 2024
My Role
For this project, I collaborated with a team of UX Designers, Data Analysts, Software Engineers, and Project Managers on The Opportunity Project, led by the Consumer Financial Protection Bureau. The deliverables I contributed to included:
UX Research
01
-
C&C Analysis
-
User Interviews
-
User Personas
-
Usability Testing
Content Design
02
-
Content Strategy
-
Writing
-
Editing
-
Accessibility
UI Design
03
-
Sketching
-
Wireframing
-
Prototyping
-
Design System
Branding
04
-
Illustration
-
Iconography
-
Color Palette
-
Logo
Tools Used
Challenge
Help consumers find the best credit card and promote market competition
The Consumer Financial Protection Bureau (CFPB) seeks to empower American consumers to effectively shop for optimal credit cards, aiming to enhance market competition and reduce the annual $120 billion in credit card interest and fees.
Considering the substantial debt held by cardholders, the CFPB has tasked our team with developing a tool—uninfluenced by revenue incentives—that utilizes its extensive credit card dataset to ensure consumers can identify the card that best aligns with their financial needs.
Problem
Lack of financial literacy affects important decisions
Although the original challenge set by the CFPB was to connect users with credit cards and promote credit card market competition, our research showed that credit card users need a better way to learn about credit card basics to be able to understand how to choose a card that is the best fit.
Solution
An educational tool that will teach, not test
Our solution is an educational tool, Credit Hike, that allows users to expand their financial literacy through the context of a simulated journey through credit card ownership so that they can learn how to make informed decisions regarding their financial future.
02
DISCOVER
Research Methods
Increasing our financial literacy
Our team was in need of gaining a better understanding of credit and credit cards so we developed a comprehensive research plan to help us increase our financial literacy. Although this process took time, we were able to walk away with deep insights into the current market and users' view points on credit and credit cards.
4
Competitors Analyzed
Reviewed popular credit card comparison tools on the market
7
Users
Interviewed
Qualitative data helped identify specific pain points and needs
5
Comparative Tools Analyzed
Learned about alternative comparison tools from other industries
4
User Advocates Interviewed
Learned more about various target audiences and the problems they often face
72
Online Survey Respondents
Quantitative data allowed for a broad understanding of user experiences
2
Usability Tests on Existing Tools
Watched how users currently interact with card comparison tools
Competitive
Analysis
What information do consumers actually need?
I initiated our team's research with a competitive analysis of four credit card comparison sites, comparing them against the Consumer Financial Protection Bureau's (CFPB) credit card dataset. The primary takeaway was the overwhelming amount of information that often obscured essential credit card details.
This led me to wonder how we might bridge the gap between excessive and insufficient information.
Comparative
Analysis
Are there better comparison tools?
Given the similarity and complexity of the four credit card comparison sites, I conducted a comparative analysis of five additional sites that assist consumers in comparing various products, aiming to find a more simplified tool.
While some offered UI inspiration, the inherent complexity of comparison sites overall left our team feeling overwhelmed.
Survey
Most people receive their first credit card at a young age
Given our team's limited experience in comparing credit cards, we designed an online survey to grasp how individuals research, compare, and select credit cards, to avoid making assumptions. The results helped us understand user preferences and expectations in credit card shopping and revealed, to our surprise, that many receive their first credit card at a young age.
From the 72 survey respondents we learned:
Most respondents received their first credit card between the ages of 18-23 years old.
When asked how respondents choose credit cards the top 3 responses were:
• Credit card comparison tools
• Recommendations from friends & family
• Offerings from their current financial institution
User interviews later revealed that despite the frequent use of credit card comparison tools, interviewees found them overwhelming—an interesting point to note.
Respondents said the most helpful tools when comparing credit cards include:
• Educational resources
• Calculators
• Card match surveys
User interviews later revealed that despite the availability of educational tools, individuals often lack confidence in their understanding of credit cards, regardless of their experience.
User Interviews
Despite available resources users lack understanding of credit cards
In addition to our survey, we also conducted user interviews to gain deeper insights into the experiences of others when shopping for credit cards, since our team had limited experience. We interviewed 7 people aged 25-45 with different levels of experience with credit cards.
We synthesized the data from our user interviews and noticed trends in terms of pain points. Those pain points include a:
Christina T. | Age 28
"Where do people get educated about credit cards? That's what I think is really missing."
User Advocate Interviews
Understanding the needs of different user groups
To round out our research, we conducted user advocate interviews with four organizations who advocate on behalf of specific communities when it comes to their financial literacy and needs. Going into these interviews, the teams’ goal was to understand how to approach making a more equitable and fair credit card shopping experience.
What we ended up learning was that a lack of access and understanding about credit is a major contributing factor to underserved communities falling into debt and not being able to utilize credit cards in ways that can benefit their financial health.
03
DEFINE
Persona
The Financial Seedling
Demographics
​
Age: 18
Occupation: College Student
Income: Low-Middle Class
Education: High School Diploma
Characteristics
​
• Wants to get their first credit card
• Has minimal financial literacy
• Overwhelmed when researching credit cards
Goals & Needs
• Expand financial opportunities
• Choose the right card
• Gain financial literacy
• Earn rewards on purchases
Challenges
• Unclear on credit card specifics
• Inexperienced in budgeting
• Risk of high fees and interest
• Struggles with information overload
So how might we:​
Build a tool that promotes financial wellness and curiosity to learn more?
Help users develop an understanding of the credit card market?
Simplify credit card use to help consumers better understand the process?
Demystify the risks and realities of owning a credit card while still being relatable?
04
DESIGN
Lo-Fi Sketches
Research led to unanimous team decision to create a game
Each member of the team created a series of lo-fi sketches to help bring our research to life. We then worked as a team to consolidate our ideas into a single product concept. During this phase, we noticed we were all leaning towards a game or journey-type experience for the user where they could explore the fine print details of credit and credit cards.
User Flow
User flow allows for an easier understanding of journey
As our lo-fi wireframes came together, we created a user flow. This helped us understand the user's journey as they use our product. It also helped us understand the number of potential outcomes our users could have, from the card they choose to the amount they spend. This understanding was crucial in our conversations with our developer and data teams.
Wireframes
Laying the foundation for an engaging educational tool
After developing our sketches and user flow we began wireframing, aiming to craft an engaging educational tool. This involved experimenting with different layouts, progress indicators, and imagery.
Design System
Making learning about credit cards fun and inviting
Breathing a little life into our lo-fi sketches, the team created a design system. We wanted the experience to be fun, cheery, and inviting, which is why we chose a clean, legible font (it's CFPB's font too...), bright colors, and a nonbinary character.
Usability Testing
Content and UI updates to eliminate confusion
Following wireframe development, we created a mid-fidelity prototype. To ensure design effectiveness, we conducted usability tests on our mobile prototype with a youth group aged 18-25, involving 11 participants. I personally led four of these tests.
Confusing Verbiage
When prompted to choose their credit history level, many users, regardless of experience, were uncertain of its meaning.
We revised the question to ask users to approximate their credit score instead.
Lack of Onboarding
Most users overlooked built-in features like "Learning Links" and the glossary unless guided.
Recognizing their importance for enhancing financial literacy, we introduced an onboarding screen at the journey's start.
Stark Colors
Surprisingly, many participants recommended a dark mode, finding our white background too stark.
Lacking time for full redevelopment, we instead changed the background to off- white.
05
DELIVER
Solution
Experiencing credit card ownership by choosing your own journey
To help show users a realistic scenario of owning a card, we have screens with choices of credit cards and how to spend on their card. The credit card choices are hypothetical, with details derived from the 2022 CFPB dataset. Our goal is to help users understand how credit card terms and benefits relate to their personal situations in a low stakes, supportive space.
Help yourself clarification through "Learn More" links
And to make sure we cover all our bases and appeal to users with different levels of financial literacy, we’ve included additional links that provide brief context, like "Reminders” and “What’s a credit score?” to allow users to dive deeper.
Ending your journey with options for continued learning
Our journey ends with two possible outcomes. One where the user has successfully avoided interest and paid their bill in full, and one where they have only paid the minimum and accrued interest.
One goal of our end screens is to encourage the user to continue their education. They can take a look at what could have been by looking at the other outcome, or they can explore our glossary and learn more about the terms they encountered during their journey. We hope the user feels empowered to learn more and capable of understanding how their spending habits can impact their financial health.
Results
Launching and sharing Credit Hike
-
As the Lead Designer on this project I was able to take ownership of managing cross-functional partnerships, lead both research and design efforts, and establish a design system from start to finish.
-
Credit Hike has been launched on Netlify, with usage monitored through Google Analytics.
-
I represented the team at the Census Open Innovation Summit 2024, a conference showcasing innovative technology and data products, to speak on a panel about Credit Hike (shown below).
AAU Case Study
Martello Investments Case Study
