Designing Split Payment Solution
What was the problem?
As part of the Pay Chase Card experience, we introduced Ultimate Rewards Points as an additional payment method for users to apply toward their credit card bills. This feature supports business goals—encouraging lower-cost point redemption—while also delivering more payment flexibility to users.
However, while this feature has potential value, our data revealed a significant mismatch between points balances and bill sizes:
71% of cashback redemptions are $100 or less
73% of card payments are $101 or more
In other words, most users don’t have enough points to cover a full credit card payment, creating an unanticipated split tender scenario where users must combine points with another payment method.
Key User Pain Points
Through user testing, we uncovered three core friction points in the flow:
Lack of visibility upfront: Users select the payment amount before seeing how much their points are worth, often forcing them to go back and revise their input.
Double work for partial payments: When users choose to pay with points but can’t cover the full amount, they are forced to repeat the flow to pay the remainder—adding friction and risking missed or late payments.
Time consuming user work-arounds: Data suggested that many users were creating their own work arounds to split tender payments such as redeeming Ultimate Rewards points for cash back prior to paying their account balances.
How Might We Improve the Ultimate Rewards Points Redemption Experience?
The core challenge: most users don’t have enough points to cover their full credit card payment—yet the existing flow only supports using one payment method at a time.
To address this, we explored introducing a split tender option, enabling users to apply both Ultimate Rewards Points and a bank account toward a single payment. This approach not only removes friction from the experience but also increases points utilization, benefiting both the user and the business.
Timeline
6 months (Discovery → Delivery)
My Role
Lead Discovery & Delivery Designer
Led end-to-end experience strategy, from framing the problem through research and ideation to detailed interaction design and delivery.
My Team
UX Designer (me)
Content Designer
UX Researcher
Process
Our approach followed a dual-track model, balancing exploratory research with iterative delivery. We anchored the work around a clear goal: make it easy and intuitive to apply Ultimate Rewards Points toward a credit card payment—even when those points aren’t enough to cover the full amount.
1. Discovery: Understanding User Needs and System Constraints
We began by mapping the existing Pay Chase Card flow and identifying key decision points and drop-off risks. Partnering with our researcher, we conducted qualitative usability testing. Three core insights emerged:
Users wanted to use their points—but often didn’t know their balance early enough to make an informed choice.
The system allowed only one payment method per transaction, leading to repeat visits and frustration when users had to “start over.”
There was no built-in logic to help users understand what to do next if their points didn't cover the full amount.
2. Framing the Problem
We synthesized these insights into a key design challenge:
How might we introduce a split tender option that guides users smoothly through combining points and bank payments—without overcomplicating the flow?
This prompted collaboration with engineering and product partners to understand technical limitations around partial payments, point valuation, and minimum payment requirements.
3. Ideation & Iteration
We explored and tested multiple interaction models:
Multi-Selection (No Mode Shift):
Users could select one or more payment methods in a single step. Flexible, but added complexity upfront.Chart Total (No Mode Shift):
A visual breakdown of payment sources. Informative, but risked overwhelming users making simple payments.Toggle (Mode Shift):
Users switched between “single” and “split” modes. Reduced visual noise but added an extra decision point.Segmented Controller (Mode Shift):
A familiar UI element let users choose their flow. Clear, efficient, and minimized friction for both paths.
The Solution: Split Tender with Toggle-Based Interaction
After testing multiple models, we implemented a toggle-based split tender flow to balance clarity, flexibility, and ease of use.
The toggle allowed users to switch between single and split payment modes—keeping the default experience simple, while enabling more advanced use cases only when needed.
Why the Toggle Worked
Lightweight entry point: Users making a straightforward payment weren’t burdened with unnecessary decisions.
Clear mental model: The toggle introduced a clear mode shift, helping users understand they were entering a combined-payment experience.
Guided flexibility: Once in split mode, users could easily allocate Ultimate Rewards Points first and then complete the payment with another method—all within one flow.
Delivery
The split tender flow was delivered in close collaboration with engineering and product partners, with weekly QA and detailed Figma specs guiding implementation. Edge cases and unhappy path error scenarios were solved for, interaction patterns were aligned with design system standards, and the flow is currently in employee pilot.
Next Steps
Next, we're monitoring adoption and user behavior through analytics and qualitative feedback to identify opportunities for refinement. Future iterations may explore pre-selecting optimal payment combinations, deeper integration with rewards education, and expanded support for recurring split payments.