Payment Refill Enhancements
Role: Facilitate the ux process from end-to-end with a three-person design team within a centralized UX hub supporting the broader organization.
Collaboration: Product Designer, Product Managers, Project Managers, directors, researchers, ux writer, Marketing, Development
Users: T Mobile Prepaid Customers
Tools: Figma, Miro , UX Pin UserZoom
Refill & Redeem
Unlike traditional monthly billing, many prepaid customers add funds as needed using refill cards, prepaid PINs, or one-time payments. Supporting these payment methods is a core part of the prepaid experience and requires a flow that was fast, flexible, and easy to complete.
Unlike traditional monthly billing, prepaid customers first add funds to their account through refill cards, one-time payments, or AutoPay. Those funds are automatically applied when their renewal is due.
Refining the Experience as a Team
By this stage, the team had developed a strong working rhythm. Product, Engineering, QA, Design, and business owners were aligned around a shared goal: delivering an overdue improvement with clear business value. Rather than debating the overall direction, our conversations shifted toward refining details, resolving edge cases, and removing friction before launch.
A Unified T-Life Experience
As T-Mobile expanded the T-Life app into a central hub for account management, we ensured the purchase experience felt consistent across mobile, desktop, and the app itself. Whether customers were resetting a password, managing their account, or purchasing a plan, the experience followed the same design language and interaction patterns.
The legacy payment method had an unnecessarily siloed user flow, My goal was to condense multiple payment option son one page and make it consistent cross multiple channels from T-Life app, mobile and desktop
Sketching the payment experience as a wireflow gave the team a shared North Star—making it easier to align on the customer journey, identify gaps early, and keep design, product, and engineering moving toward the same goal.
Designing for Real Payment Behaviors
Many prepaid customers pay only when they have funds available, making Guest Pay and Refill critical parts of the experience. Rather than forcing authentication, we supported both behaviors—making it easy for customers to pay immediately while still creating opportunities to enroll in AutoPay when appropriate.
Using a mobile-first approach, I prioritized the information hierarchy needed to support multiple payment methods. The layout was designed to scale seamlessly across the T-Life app, mobile web, and desktop while maintaining a consistent experience.
The interface surfaces only what is relevant to the user’s context. Signed-in customers see balances, renewal amounts, and AutoPay opportunities, while users redeeming a refill card can complete that task without unnecessary account details.
Business Goals vs. Customer Reality
One recurring discussion centered on payments. Product insisted that, from a business perspective, encouraging users to sign in and enroll in AutoPay improved retention and long-term value.
Research told a slightly different story….
Reducing Friction, Preserving Security
One example was CAPTCHA. Initially, refill payments triggered unnecessary verification, creating extra friction. Working with Engineering, we refined the logic so trusted refill scenarios required fewer interruptions while still meeting security requirements. We could invoke the Refill Value right after the number was entered, creating ample incintie to finish CAPTCHA.
Cross-Functional Decisions
Because payment flows involved financial and legal considerations, we partnered with Legal to review messaging around AutoPay enrollment and saving payment methods. At the same time, QA validated the different payment paths while Engineering helped simplify technical constraints.
Designing Once, Reusing Often
By this point, many of our earlier solutions—such as payment calculations and renewal messaging—had already been incorporated into our shared component library. That allowed the team to solve new problems faster, maintain consistency across experiences, and continue balancing customer needs with business goals.
The redesigned refill experience simplified a fragmented payment journey into a single, flexible flow that supports how prepaid customers actually pay. By balancing business goals with customer behavior, we created a consistent experience across web, desktop, and the T-Life app—making it easier for users to refill, renew, and stay connected with confidence.