Case Study · 05 of 06

iSX Pay: an embeddable card checkout that 800+ merchants trust.

A white-label card payment SDK with SCA / 3DS2 compliance, native one-handed mobile UX, and a token-based theming system that lets merchants ship their own brand without breaking accessibility or conversion.

Role
Lead Product Designer
Timeline
8 months · 2022
Team
2 designers, 6 engineers, 1 PM
Platform
Embedded SDK · Web · Mobile
iSX Pay multi-device checkout mockup

A checkout that has to disappear into other people's products.

iSX Pay is a checkout SDK. Merchants drop it into their app or website with a few lines of code and it handles everything from card capture to 3DS2 SCA. To them, it should feel native. To their customers, it shouldn't feel like anything at all.

I led design from a brief that came in as "a card form" and ended as a themeable, SCA-compliant, multi-locale checkout system used across 800+ merchants in seven countries.

Three things any good checkout has to solve.

Challenge 01

SCA without panic.

Strong Customer Authentication ejects users into a bank-controlled 3DS challenge. We had ~6 seconds to set expectations before the redirect, and ~6 seconds after to confirm success.

Challenge 02

One-handed mobile.

Card forms are notoriously bad on mobile — numbers, expiry, CVV, postcode, all on a 360px screen. We rebuilt the form for thumbs, with keyboard switching and intelligent autofill.

Challenge 03

Brand without breakage.

Merchants want their colors, fonts, and tone. But the checkout has to remain trustworthy and accessible. We resolved this with a constrained token system, not a free-for-all theming API.

Challenge 04

Failure that doesn't feel like failure.

Declines, soft fails, retries, expired sessions — designed each error state with copy that helps users recover rather than rage-quit.

The form, distilled.

We cut the checkout to its absolute minimum: amount, card number, expiry, CVV, and full name. Billing address surfaces only when required by the issuer's BIN rules. The SCA challenge gets its own pre-emptive screen ("Your bank may ask you to confirm — we'll bring you right back").

Design system highlights

  • Six theme tokens — primary color, surface, text, radius, font, contrast mode. Merchants override these via a single config object; everything else is locked.
  • Built-in contrast linter — at theme load, the SDK checks every text-on-surface combination against WCAG AA. Failing themes auto-fall-back to a safe palette and log a warning to the merchant dashboard.
  • Card brand recognition — visual chip updates inline as the user types the BIN. Reduces "wrong card type" mistakes by 12%.
  • Locale-aware copy — 11 languages at launch, with field labels, error states, and SCA messaging all professionally translated and reviewed by Legal.
"Lower fallout than our previous PSP, lighter footprint, and matches our brand out of the box. Switching was easy." — CTO, e-commerce platform (200+ live merchants)

The checkout, across surfaces.

Higher conversion, lower 3DS fallout.

+22%
Card-checkout conversion vs. the previous SDK
0.4%
3DS fallout rate (industry avg. ~2-3%)
800+
Merchants live within 18 months of launch
11
Supported languages at launch

Lessons from designing for other designers.

Constraints are the product. Merchants thought they wanted infinite theming. They actually wanted a checkout that converted. The constrained token system became one of the most-cited reasons partners chose iSX Pay over competitors.

Documentation is design. The SDK's integration docs are the first surface a developer sees. I co-owned the docs with a tech writer — design principles, code snippets, theming examples, accessibility notes all in one place.

Test in the wild. No focus group surfaces the bug that only happens on a 4.7-inch Android Chrome with autofill on a saved card. Production analytics, session replay (privacy-safe), and a beta merchant program were the only way to find the long-tail issues.

Next Case Study · 06 of 06

FXGiants Trader Dashboard →

Real-time portfolio interface for active retail traders