top of page
Heuristic Evaluation
I started my research with a Heuristic Evaluation of the existing website. I used Neilson's Heuristics methodology and sorted each violation by its severity to help me solve problems quickly and efficiently.
Citi's Customer Activation Redesign
Case Study
My Role: Lead Product Designer
Year: 2020
Platforms: Web Responsive, iOS, Android
Team: UX Researcher, Content Strategist, Project Manager
Tools: Sketch, InVision, Freehand
Overview
Citi's Customer Activation is a new onboarding feature designed to encourage users to unlock their newly opened account’s potential within the first 90 days leveraging an intuitive, streamlined and contextual experience.
Goals
Business
Reduce account attrition and increase long-term retention through the adaptation of Citi as our clients’ primary banking relationship.
Design
Redesign Customer Activation feature so that our customers are guided to the most important actions that will make their account valuable and useful.
Problem
85%
of digitally opened accounts are closed within 12 months (2018).*
26%
of new customers leverage Citi as their primary relationship.**
Introduction
I was assigned to this project in February 2020. At the time, the onboarding two-screen experience consisted of a small "link-farm" tile located on the accounts overview page that led to a more detailed landing page.
Research
Research
Heuristics Evaluation
I started by examining and evaluating the existing Customer Activation journey to get a better understanding of the different states, features and overall usability.
Major takeaways
-
Very little context provided in the tile
-
Landing Page's incorrect colors used for titles indicating that they are interactive. That gives an impression that there are multiple calls to action for each of the category
-
The language between the tile and the landing page feels disconnected
-
More links are added the Landing page but not easily discoverable and not really part of the journey
-
The language was not particularly actionable and, in some cases, ambiguous
C & C Analysis
Next, I partnered with a UX researcher to seek out insights on how some of the high-performing tech companies successfully onboard their users.
Insights
Cross-domain Teams Reachout
The last piece of the puzzle before moving forward was to gain an understanding around how the redesigned feature will fit into the overall design of the the dashboard.
What we've learned
-
The dashboard is in a process of complete redesign by another domain and it's important to align now.
-
Copy must be approved not only by the legal team, but also the domains that own the journeys related to the Customer Activation project.
-
The real estate allocated to Customer activation is very limited.
-
If introducing brand new components that don't exist in the design system, we have to get the approval from our Dev team right from the conception of the the project.
Insights
Initial Testing
Before redesigning, we used the existing design system and created three very basic wireframes to test the tile layout and content with existing Citi customers.
☺️ Wins
Participants were the most familiar with the list view and preferred it the most, particularly those over 30 years old
😳 Pain Points
Not all participants understood the tasks without more context. Most missed the "Learn More >" CTA
☺️ Wins
The header of the tile felt the most helpful "It means I need to finish something to get the most of my account."
😳 Pain Points
The language in each tile felt like an upsell rather than something that would benefit the users: "What's in it for me?"
☺️ Wins
The grid view was like mostly by those under 30 years old. The simplicity of design was enticing
😳 Pain Points
Most requested for more context especially those over 30 years old
Design Principles
Armed with the collected and consolidated findings, I created three design principles that guided our design decisions.
Easy
Show our customers value as quickly, simply and seamlessly as possible
Concise
Present only the most important and helpful information
Actionable
Provide our customers a clear path to their first activation moment
Design
Design
New User Journey
After many discussions and iterations, we agreed to eliminate the landing page and focused on the dashboard tile adding brand new features, actionable language, context and one call-to-action per task.
Usability Test Results: Pain Points
Overall, participants appreciated a prominent call to action to finish adding options to their account.
1.
Some users felt that the progress bar implied that the optional tasks were required.
2.
Some felt required tasks should be highlighted or denoted as such.
3.
Some commented that completed tasks should no longer be shown.
Deliver
Dashboard 2.0 Redesign
We partnered up with the dashboard design team to revamp the look and feel of the checklist and to align with their redesign by following their guidelines.
New Features
Based on the test results and ask from the redesign team, we also added extra features where users are able to:
-
Delete optional tasks by switching to Edit mode
-
See which tasks they can delete and which are required when in Edit mode.
-
Collapse or expand the checklist
-
Redesigned the progress bar to clearly indicate the count of task
Desktop View
Responsive View
Native Mobile (iOS example)
Deliver
Performance Metrics
Since January 2021 The Retail Activation Checklist drove significant increases in sticky task enrollment and engagement.
Next Steps
-
Expand Activation Checklist to our Credit Card customers
-
Partner up with the Enable design team to elevate the Checklist placement to the Muti-Relationship Customers (MRC)
-
Animate the feature to celebrate all tasks completed - the confetti affect
bottom of page