As a Senior Product Designer at American Express on Pay with Bank Transfer since 2022, I've led end-to-end UX design across 300+ merchant integrations — defining the experience direction, building the design system from scratch, and owning every design decision from discovery through dev handoff. Working alongside PMs, engineers, and two supporting designers, I own everything from merchant flow design and consent disclosure screens to the first-time PwBT setup experience within Myca, American Express's cardholder platform — with ongoing development as the product continues to grow. Three and a half years in, and still going.
🔥 The Problem
No fixed Flow — every merchant requires a different UX
When I joined, there was no unified PwBT flow. Every merchant integration had been built differently — inconsistent screens, inconsistent branding, no shared foundation. The experience looked different depending on where a user encountered it, and that inconsistency made it hard for the sales team to pitch PwBT convincingly to new partners. If you can't show a merchant a polished, consistent experience, it's difficult to get them to sign.
The lack of a standardized system wasn't just a design problem — it was a commercial one. Without a reusable foundation, every new integration started from scratch, taking longer to build and producing results that felt fragmented across the board.
No reusable flow — every project started from scratch
Time lost redesigning the same patterns repeatedly
Inconsistent experience across merchants, even for standard PwBT steps
No shared baseline — design assets scattered, handoffs fragmented
✅ The Objective
Build a Flexible but Organized PWBT Experience System
🔦 Understanding The Technical Context
How PwBT Works — and Why It's Complex to Design For
PwBT is an Open Banking-powered payment method — an alternative to card. Users select their bank, authenticate directly in their banking app, and the payment goes straight to the merchant. No card details required. American Express acts as the Payment Initiation Service Provider (PISP), sitting between the merchant and the UK banking network.
Open Banking Rails
PwBT runs on FCA-regulated Open Banking infrastructure. Every flow must include clear consent disclosures, bank redirect handling, and fallback states — all legally required, all visible to the user.
Merchant-Specific Constraints
Every merchant has a different checkout setup — different UI, different users, different transaction types. PwBT has to fit seamlessly into each one while keeping the core experience consistent.
🏆 Final Outcomes
End-to-End Flows Across Every Merchant Environment
With 300+ merchant integrations, what's shown here represents the core types — each built from the same design system, adapted to the merchant's brand and context.
☑️ Merchant-Specific End-to-End Flows
Full payment journeys per merchant — bank selection, disclosure, authentication, confirmation, and all failure states. Delivered as dev-ready Figma specs
PwBT in Action — United Airlines
☑️ PwBT Design Library
Centralized Figma component library covering all PwBT surfaces — used across all 300+ integrations to ensure consistency and speed up handoffs.
☑️ Myca Web: First-Time Setup Journey
The PwBT agreement and bank connection flow for existing Amex cardholders — designed to feel native within the Myca platform.
The Full PwBT Journey on Myca
☑️ Merchant Demo Prototypes
Branded, clickable prototypes built ahead of each merchant pitch — used by the commercial team to demonstrate the full PwBT experience and support sign-off.
🙋🏻♀️ My Role
Senior Product Designer — Full Ownership, Start to Finish
I've been the Senior Product Designer on PwBT since 2022 — responsible for the full UX scope of the product across both merchant and Myca environments. That means I didn't just execute flows; I defined what the PwBT experience should be, made the calls on how to balance standardization with merchant-specific needs, and built the design system that makes it all scalable.
Day to day, that looks like: designing end-to-end flows for each new merchant integration, maintaining and evolving the PwBT Design Library, running alignment sessions with engineering, and presenting designs directly to merchant partners. I worked alongside PMs, developers, and two supporting designers — but the design direction, system decisions, and final outputs were mine to own.
▶️ Design Progress
A Repeatable Approach, Adapted Per Merchant
Merchant Discovery & Context Mapping
Every new merchant started with deep alignment sessions with PMs — understanding the checkout environment, user base, and transaction type. The core user journey was well-defined from the outset, which meant we could move directly into flow design. Those early conversations shaped what needed to be adapted per merchant, not rebuilt from scratch.
Flow Architecture & Journey Design
When I started, there was no PwBT design library — only a handful of brand guidelines covering basic color and typography. I built from the fundamentals up: defining the core flow architecture first, then creating the component library that would make every subsequent integration faster and more consistent.
High-Fidelity Design & Merchant Branding
Build in Figma using the PwBT Design Library — adapted to the merchant's brand. Every screen production-quality, ready for dev.
Prototype for Presentation
Clickable, branded prototypes for the commercial team — used to demonstrate the full PwBT experience and secure merchant sign-off.
Dev Handoff & Alignment
Annotated Figma specs and component documentation, plus alignment sessions with engineering to resolve edge cases before build.
Iterate & Evolve the Design System
With every new merchant and regulatory update, the PwBT Design Library grows — patterns refined, new components added, consistency maintained.
🚀 The Two Environments
Same Payment Method, Two Distinct Design Contexts
1️⃣ External Merchant Environment
United Airlines · EDF Energy · 300+ partners
Core PwBT flow is consistent — bank selection, authentication, confirmation, error states are standardized
Merchant branding is fully integrated — colors, typogrphy, and visual identity adapt to each partner while the core flow stays the same
PwBT is embedded within the merchant's checkout — not a standalone product
Fallback and exit states always give the user a clear path back to the merchant
EDF Energy Merchant Flow
2️⃣ Myca — American Express Member Platform
Web · Existing cardholder journey · First-time setup
User is already an Amex cardholder — they know and trust the brand before PwBT is even introduced
PwBT introduced as a new method within a familiar product
Desktop-first; must align with Myca's existing design language
Ongoing — evolves alongside new Myca features and platform updates
Myca Environment Flow
⚠️ Edge Cases & Failure Scenarios
Designing for When Things Don't Go Wrong
In a payment flow, failure is not an edge case — it's inevitable. A user who hits a dead end with no clear next step loses trust in the product, abandons the payment, and often doesn't come back. Every PwBT flow is designed with a complete failure scenario map from the start — not as an afterthought.
Bank Unavailable — Error Modal (Myca)
Exit & Cancel Flow — Confirmation Modals (Myca)
QR vs. Desktop Redirect — Login Method (Myca)
🔍 Key Takeaways
What 3.5 Years+ on One Product Teaches You
✦ System thinking is the only way to scale UX
When you're responsible for +300 merchant flows, you can't design each one from scratch. Every merchant brings different constraints — branding, context, user expectations — but the core UX principles stay constant. Building a reusable system, and maintaining it, becomes as important as designing individual screens. The design library wasn't a side deliverable. It was the product.
✦ Design directly influences whether a merchant signs
The prototypes I built weren't just handoff tools — they were used in commercial pitches. When a merchant sees a polished, branded demo of their own PWBT flow, the conversation changes. Good UX is a business argument.
✦ Failure states are the experience
Early on, failure states were the last thing I designed — something to finish off after the happy path was done. That changed quickly. Merchants started asking how specific error scenarios should be handled, and it became clear that these screens carried as much weight as any other part of the flow. Now failure states are the first thing I map out, not the last.
🔑 Key Impact
The Numbers That Matter
Three and half years of end-to-end UX ownership at enterprise scale — measured in merchants, environments, and a design system that keeps growing.
Bank Selection Screen — Merchant with PwBT — How It Evolved
PwBT taught me that scale changes everything — and that the best UX work at enterprise level isn't just about individual screens. It's about building systems that hold up across hundreds of integrations, markets, and teams. That's the kind of design challenge I'm looking for next.