Chase Quests
ADD-A-FEATURE
|
DESIGN SYSTEMS
|
UX STRATEGY
|
MOBILE UI
ROLE & DURATION
Product Designer & Researcher
Q2 (2023)
METHODS
User Research / Competitive Analysis / Wire-framing / Prototyping / Testing
*Disclaimer: This case study is a conceptual exploration and is not directly affiliated with Chase Bank.
the high cost of living crisis
67% of employees say the cost of living is outpacing growth in their salary and wages, according to a Bank of America survey.
64% of employees say they are stressed about their finances. Among older Millennials, those aged 35 to 44, 80% report feeling stressed about money.
turning everyday spending into fun
Rather than imposing limitations on their daily spending, I explored a solution that empowers people to earn more value from their purchases. I designed new additions for the Chase Mobile app to make earning rewards on everyday spending fun and engaging, reducing the feeling of guilt associated with everyday purchases.
Chase Quests - Gamified challenges that make purchasing feel rewarding
Offers for you - Personalized cash back offers based on spending habits
DISCOVERY
existing behaviors with cash back programs
I conducted a total of 7 user interviews to understand how people interact with cash back programs. I wanted to learn:
A bank app user's spending habits
How bank app users view cash back offers
What discourages a bank app user from utilizing cash back offers
Themes from User Interviews
80% of participants prioritize checking account balance when they visit the app
62.5% of participants find the current cash back offer selection inadequate
60% of participants don't use cash back due to lack of understanding
Checking credit card statements often triggers regret
When reviewing their statements, bank app users tend to dwell on a sense of financial loss. Focused on the money spent, they'll tend to overlook cash back programs and disregard its benefits altogether.
User Persona
Emily Cruz, 28
Sales Technician
About Emily
Emily likes to splurge on food occasionally to reward herself from hard days at work.
Goal
To treat herself without feeling guilty of overspending
Pain Points
Indulgent purchases sting due to high cost of living prices
Balancing indulgence with financial responsibility
Constantly worrying about overspending
highlighting the best in cashback programs
To gain inspiration on how I could highlight the cash back rewards system in the Chase Bank app, I conducted a SWOT analysis. This analysis revealed key differentiators offered by successful competitors, which I leveraged to come up with ideas to strengthen Chase's cash back offerings.
ideation
strategies to drive user engagement
How might we direct our users' attention on the positive impact cash back programs can have on their financial well-being?
According to our research, cash back programs were overlooked due to tunnel vision on checking accounts over viewing cash back offers, unappealing partnerships and unfamiliarity with the overall process. My focus gravitated towards grabbing user attention of the program within the Chase Bank app. I prioritized ideas leveraging incentives, gamification, and personalization for maximum user engagement.
I prioritized features using a pros and cons matrix, evaluating user value, development effort, app integration, and novelty:
These were the two core features I decided on due to their strong pros:
Mapping out interaction
User Flow: Activating Offers (at different points)
Emily is checking her bank account and runs into multiple occasions where she can claim a cashback offer for one of her favorite fast food restaurants.
User Flow: Reviewing Quest Rewards
Emily has completed the last stage of one of her quests and wants to review her reward for that quest.
PROTOTYPING
Designing for seamless integration
This feature addition leveraged the existing UI for the Chase Bank app, minimizing redesign. I focused on creating reusable design elements like 'Quest' and 'Offer' cards that seamlessly integrate into the current flow. This ensures a familiar and intuitive experience for users.
Planning out the first stages of the "Quest" flow
Expanding on the display of "Offers for you"
Initial "Quest" component card ideation
finalized design components
The final key components are showcased here. To ensure consistency and facilitate reuse, I compiled them into a centralized design library.
Key Reusable Components
Different-themed quest cards to combat financial stress and boost engagement
"How to use" steps on each offer to facilitate constant adaption of understanding
User feedback & curated "Offers for you" carousel on each offer page to fuel exploration
Article cards to showcase helpful info on key money topics for user education
integrating components and ux strategy
Original Screens
Originally, cashback offers were presented in a disorganized list which discouraged user engagement. Clicking into "Chase Offers" only offered categories to sift through and still didn't effectively guide users to relevant deals.
Original "Chase Offers" entry point on the home screen
Original "Chase Offers" Page
Grabbing attention through personalized offers and Quest intros (Flow 1)
The following screens show the evolution of the flow from when a user activates a personalized offer through the home screen. Key highlights include:
Home screen displays tailored offers based on spending and a Quest to catch the eye
A click reveals a simple visual guide on how offers work
More recommended offers provide a spike in curiosity and interest
Reeling people in with Quests (Flow 2)
Beyond personalized offers, the home screen features Quests - gamified challenges to incentivize users to complete a set of offers within a timeframe, unlocking a bonus reward.
The thrill of a challenge, the pressure of a deadline, and the promise of a bigger reward make completing Quests highly enticing.
Completing the experience with Quest Rewards (Flow 3)
To top off the experience, a reward is given to users if they complete a Quest before a deadline. Users can easily review their rewards and additional details through the dedicated history page.
TESTING
Converting Key Insights into Priority Revisions
To assess whether adding the "Quests" and "Personalization" features effectively engage and inform users, I conducted 6 moderated usability tests with participants familiar with cashback programs. Four key insights emerged, prioritized by severity from most to least significant:
Top Usability Findings (High to low priority from left to right)
With these key insights pinpointed, I brainstormed and prioritized revisions, starting with the home page's visual hierarchy. As the main entry point, a clearer layout is essential for effectively introducing "Quests" and "Personalization" features. Next, I focused on "Quest Rewards" and "Offers for you," as these were crucial aspects users enjoyed.
I prioritized revisions based on user impact and implementation feasibility within a one-week timeframe.
FINAL MVP
priority revisions
Improved Information Hierarchy
The original home screen contained an additional "Chase Offers" card above "Offers for you" that threw people off. Because of this, I've gotten rid of that card to provide quicker access to the offers and Quests on the home page. I also moved the article cards to the bottom of the "Chase Offers" page to bring more priority to the other elements.
Narrowed home page focus by removing "Chase Offers" card
Moved article cards toward the bottom of "Chase Offers"
Boosting personalized discovery
I included a "Your top categories" underneath the "Offers for you" page to better showcase the origin of how these offers are being pulled. A banner has been added to the home page to better highlight the purpose of “Offers for you”.
"Your top categories" specifies the spending categories of a user
Banner to notify users of the new feature and provide extra context
Linking Quests to Rewards
Now, you'll find "View History" text on the Rewards cards to let users know that the card is clickable and interactive. Once clicked, a restructured “Rewards History” page can be seen with divided categories of “Active” and “Past” rewards. I’ve also provided icons and quest titles in the rewards cards to better correlate rewards to past quests.
Number of rewards and "view history" CTA is clearly provided
Rewards are now linked with their corresponding Quest
Rewards History is now broken down to "Active" and "Past" Rewards
final prototype
REFLECTION
100% of participants said they would use the “Quest” feature if their banking app provided this
Overall, users really enjoyed interacting with the feature and felt excitement as they looked through the offers for a Quest. Some other strong suites of this project included: prominent expiration dates and steps on how to use.
Honorable Mentions
Prominent expiration date on cards
Steps on how to use an offer
key takeaways
During Research: Consider a secondary target audience and people who don’t use the feature or don’t know what it is.
During Research: It’s all about the “why”. What else do people look at? Why are people using the app?
During Development: Don’t settle. It can be worth changing up details within flows for the sake of discovering interesting user data and observations down the road.
Next Steps
Investing more work into Quest Rewards:
Tie in purchases related to Quest Rewards earned (transactions and the amount of cash back received from purchases)
Provide more context for how rewards are used and what counts as rewards
Contemplate more on the content that lies behind the help icons