CAPITAL ONE
Reimagining Product Upgrades
Capital One’s Product Upgrades experience allows customers to upgrade their current credit card to get a better card product. However, on mobile—where 84% of customers access this flow—the experience fell well short of customer expectations.
As the design lead, I led the full redesign of this experience from a clunky webview to a native CX that is seamless and intuitive. Starting with research and competitive analysis that informed concepts for testing and refinement to high-fidelity design for handoff. The redesigned MVP is now live to 50% of users, showing strong conversions and dramatically faster performance.
Role: Design Lead & Sole UX/UI Designer
Platform: Native iOS & Android
Team: Product, Engineering (iOS, Android), Platform Teams
Key Skills: Competitive Analysis, UX/UI Design, Research & Testing, Product Strategy, Production & Handoff
The Challenge
The existing mobile experience relied on a webview within a modal—leading to:
~6 second load times
~40% customer drop-off in the upgrade funnel
No way to compare new cards to current ones—a key barrier to decision-making
Given that mobile drives the vast majority of upgrade traffic, the need for a reimagined native experience was clear.
Research & Discovery
I began by reviewing prior research on the card shopping journey and supplementing it with:
A competitive audit of 26+ experiences across banking, retail, e-commerce, and fintech
Two rounds of qualitative usability testing on early concepts and final designs
Key Insights:
Most drop-offs occur during exploring and considering stages
Users want to compare more than two card offers, not just against their current card
Primary motivators: cash back, no annual fee, and increased rewards
Key barriers: impact to credit score, unclear benefits, and process uncertainty
Customer Problem
Confusion and frustration due to slow load times—users often assumed the experience was broken
Lack of comparison tools made it hard to understand upgrade benefits
Lack of transparency around fees, credit score impacts, and timeline for card delivery
Competitive Analysis Highlights
Banking competitors offer side-by-side comparisons, horizontal carousels, or accordion views
E-commerce standards emphasize scannability with rating pills, card sorting, and image-forward layouts
Inspiration from outside the industry helped introduce new interaction models to reduce cognitive load
Design Process
Discovery & Ideation
Synthesized insights into feature requirements
Created three distinct concepts to test layout and comparison flows
Explored solutions that balance card browsing with decision-making tools
Usability Testing (2 Rounds)
Round 1: Concept testing with 3 prototypes
Concepts aligned with user expectations, with 83% saying they would use the experience again.
Rewards and annual fees were the most important factors when evaluating upgrade options.
Horizontal carousel had the most positive feedback—reduced cognitive load of selecting cards
Many users wanted more comparison options like a grid, side-by-side view or chart to compare multiple offers
Round 2: Testing refined carousel + additional comparison modes
All participants were able to scroll horizontally to compare card options with ease.
When more than five cards were present, participants preferred an alternative comparison method; 63% specifically suggested a chart view for card details.
The horizontal carousel was validated as the preferred browsing option.
Card layouts should present snippets in a consistent order across all cards to improve scannability.
Final MVP Design Solution
Final MVP featured a horizontally scrollable card carousel with key card details
Introduced a comparison modal to support deeper decision-making
Built with native performance standards to significantly reduce load time
Developed using custom UI components, since platform constraints required new, reusable building blocks
Challenges & Collaboration
Accessibility: Ensured clear indicators and swiping behavior for the carousel; explored alternatives for broader usability
Platform Constraints: Worked around front-end limitations by partnering with comparison platform teams to align on reusable, scalable components
Design Systems: Collaborated with internal design systems teams to contribute components that could benefit other product surfaces across the app
Impact
MVP launched to 50% of mobile users (iOS & Android)
Conversion rates increased by 7.5% after one month
Load times improved from ~6 seconds to 1–2 seconds
14% increase in feature completion rates
Projected $9.3M in annual NPV at full scale
Contributed a reusable carousel component to the Capital One Design library & front end platform
Key Takeaways
Native-first design drives impact: Optimizing for the channel users actually use—rather than adapting web solutions—yields measurable performance gains.
Comparison tools are essential: Empowering customers with side-by-side views improved engagement and reduced friction in decision-making.
Collaboration is critical: Partnering across teams enabled us to contribute components to the broader ecosystem—creating value beyond this one experience.
Final Thoughts
Reimagining the Product Upgrades experience wasn’t just about improving a feature—it was about creating a mobile first product experience that respects users’ time, reduces anxiety, and builds confidence in their financial decisions.
This redesign not only elevated the customer experience but also laid the groundwork for a more cohesive carousel offer experiences within Capital One.