Case study 02 · Enterprise checkout · Global direct-selling brand

A hybrid checkout reimagined for two audiences at once.

A global direct-selling brand's checkout had to serve everyday shoppers and Business Owners through the same flow. I treated it as a systems problem first — piloting the rebuild on the Italy market, then rebuilding the foundational flow on a shared model with guest checkout, payment-failure recovery, and a component library that rolled out from that pilot to 6 markets.

My role
Senior Product Designer · cross-regional lead
Scope
Systems mapping, flow redesign, error framework, design-system integration
Tools
Figma, Adobe XD, Storybook, Zeroheight, Token Studio, Jira
Timeline
2022 — 2023
Amway cart page with order summary, Sign in and Guest Checkout calls to action, and Buy now pay later with PayPal

Overview

The mission

Amway is a global leader in health, beauty, and home care, operating in over 100 countries with millions of Independent Business Owners. Its digital storefront is critical — not only for everyday shoppers, but for the business owners who run their livelihoods on the platform.

The Italy platform supports a hybrid commerce model serving both retail customers and Amway Business Owners (ABOs). That dual audience makes checkout uniquely demanding — it has to carry multi-level pricing, regional PV/BV constraints, a spread of payment methods, and per-market legal compliance, all without overwhelming a first-time shopper.

I approached it as a systems problem first and a screen problem second: map how checkout actually behaved across markets, then rebuild the foundational flow on top of that shared model.

Systems mapping · mine Flow redesign · mine Error framework · mine Design Systems team Legal & Localization

Discovery & research

I mapped two audiences before I drew a single screen.

A hybrid checkout fails quietly when you design for an average user who doesn't exist. I ran a mixed-method discovery to separate what retail shoppers needed from what Amway Business Owners needed — and where the same flow was punishing both.

22
Moderated sessions — retail shoppers & ABOs, desktop & mobile
6
Markets audited for payment, tax & compliance rules
2
Distinct audiences sharing one checkout flow
5
Recurring failures, each one measurable & sourced

How I scoped it

Four sources, one map

I triangulated quantitative funnel + session-replay analytics, support-ticket and bank-transfer logs, 22 moderated usability sessions, and a cross-market compliance audit. Quant told me where each audience left; the sessions told me why; the logs quantified the cost; the audit defined the guardrails.

  1. Funnel & replay analysis

    Instrumented the post-cart funnel to isolate where retail vs. ABO journeys diverged and dropped.

  2. Moderated usability sessions

    22 sessions split across both audiences and both devices — surfacing intent, confusion, and recovery behavior.

  3. Support & transaction logs

    Tied abandonment to real costs: failed bank transfers, COD tickets, and PV-limit confusion.

  4. Cross-market compliance audit

    Documented payment, tax, and legal rules per market so the flow could flex without re-architecting.

That synthesis is what justified rebuilding the foundational flow on a shared model rather than patching six market-specific checkouts — the bet with the most leverage per sprint.

Context & challenge

A legacy checkout working against its own users.

Session replay, funnel analysis, support tickets, and usability testing pointed to five recurring failures — each one measurable, each one sourced.

58%

No guest checkout

A forced account step meant 37% of new users dropped before sign-up, driving post-cart drop-off to 58%.

Source · session replay + funnel analysis
21%

PV-limit confusion

PV/BV thresholds triggered confusing cart behavior — 21% cart abandonment when PV exceeded 510.

Source · support tickets + in-flow surveys
16%

Payment failures

Bank transfers failed when buyers missed the window — 16% of payments failed past the 72-hour mark.

Source · analytics + bank-transfer logs
?

No progress tracking

Users couldn't tell how many steps remained or what came next, eroding confidence mid-flow.

Source · moderated usability testing
12%

Weak error recovery

12% of support tickets traced back to unclear payment errors with no path to recover in-flow.

Source · support-ticket analysis

The goals

Cut checkout friction & abandonment 25%, lift payment success from 84% → 96%, and ship reusable payment components for the global market.

Strategy

Design strategy

I redefined Amway's global checkout by integrating the new brand identity, streamlining the flow around a clear Guest Checkout option, and applying a responsive, component-based design system. The work moved through four phases — each one building on a shared system model rather than patching screens.

  1. System mapping

    A Payments Ecosystem Map of user types (Guest, Customer, ABO), cart types by PV threshold, conditional payment logic per country, and error/recovery pathways.

  2. Flow redesign

    Replacing a rigid multi-step gate with a modular, progressive-disclosure model anchored by guest checkout.

  3. Error framework

    A Payments Recovery Pattern Library with defined error archetypes and contextual, recoverable messaging.

  4. System integration

    Payment cards, bank-transfer modules, PV banners, and step indicators tokenized in Figma and documented for global teams.

Foundational flow

From a rigid gate to a progressive path.

Old flow
LoginCartShippingPaymentConfirm
New flow
Guest or Sign-InSmart CartShipping & PaymentConfirmation
  1. Guest or Sign-In

    Guest checkout with optional account creation — no forced toll gate.

  2. Smart Cart

    Real-time PV counter with contextual tooltips so limits never surprise.

  3. Shipping & Payment

    Combined step with inline validation, smart autofill, and method-specific guidance.

  4. Confirmation

    A clear progress indicator with estimated time per step — users always know what's next.

Decisions

Three decisions that moved the numbers

Each decision is shown on real Amway screens — the legacy state beside the redesign, with the failure it removed.

Decision 01

Add Guest Checkout, remove the forced gate

The single largest source of drop-off was a mandatory account step at the worst possible moment. From the cart, Sign in and Guest Checkout now sit with equal visual weight, and account creation becomes an optional reward after purchase — not a barrier before it.

Before · forced sign-in
Legacy Amway cart with a mandatory Sign In Required gate blocking checkout, no guest option, plus a newsletter popup, stacked promo banners, and a dense low-contrast layout

Account creation gated the purchase — a toll booth in front of the cart, buried under banners and popups.

After · guest or sign-in
Redesigned Amway cart with Sign in and Guest Checkout buttons given equal weight, order summary, and Buy now pay later with PayPal

A clear, equally weighted Guest Checkout path right inside the order summary.

Decision 02

Make payment flexible, eligible, and trustworthy

Two audiences mean two payment realities. I moved from stacked, context-free options to a layout where eligibility lives next to each method, and added PayPal Pay-in-4 presented with plain terms and no dark patterns. Drag the handle to compare the shipping step with the Pay-in-4 explanation shoppers now see in context.

Before: Amway checkout shipping step with stacked, context-free payment options
After: Amway PayPal Pay in 4 interest-free payments modal with clear terms
Before · stacked options After · clear terms

Drag the divider to move between the original payment step and the redesigned Pay-in-4 context.

Stacked options with no context — users picked ineligible methods and failed at the last step.Before · usability session

Side-by-side eligibility and interest-free terms — faster decisions, fewer failed payments.After · usability session

Decision 03

Design for failure: inline help, validation, recovery

Checkouts fail at predictable moments. I built contextual messaging for each error archetype — validation, failed processing, bank delay, COD restrictions — with inline help and fallback options (for example, “Bank transfer must be completed within 72 hours. We'll send a reminder,” or switching to card). A streamlined ABO registration flow optimizes fields, validation, and account setup while staying compliant per market.

Checkout · inline validation
Amway mobile checkout with inline field validation showing a clear Please enter First Name error and order summary

Errors surface where the decision happens — recoverable, never a dead end.

ABO · customer registration
Amway three-step Customer Registration shown on an iPhone with country, first and last name, email, mobile, password, reCAPTCHA, and a step-1 progress indicator

A guided 3-step registration with a visible progress indicator and optimized fields.

Key screens

The flow, screen by screen

Beyond the headline decisions, the redesign touched every step a shopper hits between the cart and a confirmed order — entry, account, and the moments where people almost leave.

Design system · interactive

Project Aurora — encode it once, ship it everywhere.

Consistency across six markets had to be structural, not manual. I contributed to “Project Aurora,” the Amway design system — an atomic library built on Amway's brand standards (GT Walsheim, Amway Black #2C2C2C) and a fluid, variable-column grid. 1,000+ artboards, 200+ user stories, documented in Storybook and Zeroheight. Switch layers to explore the foundations the checkout was built from.

Color & brand

Black and white form an empowering base; Dark Purple (PMS 2131C) represents Amway as a company and carries primary action. Six curated accent pairings add warmth — used sparingly to avoid a “rainbow” effect. Every value is a Pantone-derived token, set once and inherited across all six markets.

Base colors

Amway BlackPMS 426C · #2C2C2C
Amway White#FAFAFA
Dark PurplePMS 2131C · #38539A
Light PurplePMS 657C · #F1F2FF

Accent pairings

PMS 7624C#7F3E3E
PMS 698C#FFE2E2
PMS 416C#62625A
PMS 1605C#A65523
PMS 7470C#396E75
PMS 371C#546223

Type scale

GT Walsheim (Regular, Medium, Bold) is the approved type for all Latin-character UI. Noto Sans covers non-Latin languages — Chinese, Thai, Japanese, Korean — so the same hierarchy survives every market. One scale, two font families, no per-market overrides.

Secure checkoutH1 / Walsheim Bold
Shipping & paymentH3 / Walsheim Medium
Order summarySubtitle 1 / Walsheim Medium
Pay in 4 interest-free installments — clear terms, no surprises.Body 2 / Walsheim Regular
Estimated delivery in 3–5 business daysCaption / Walsheim Medium
In stockOverline / Walsheim Medium
Guest CheckoutButton / Walsheim Bold

Tokens & fluid grid

Color, spacing, and radius live as design tokens — the contract between Figma and engineering. Everything composes onto a fluid grid with variable columns: 8 columns on desktop, flexing down to 4 on mobile.

color.action#38539A
color.ink#2C2C2C
color.action.soft#F1F2FF
radius.inline-msg10px
space.base8px unit
grid.columns8 desktop / 4 mobile

Fluid 8-column reference grid · 48px gutters — columns flex to each breakpoint while components keep their proportions.

Components — atoms to organisms

Foundations and tokens compose into an adoptable library — Buttons, Text Fields, Checkboxes, Radio Groups, Toggles, Dropdowns, Inline Messages, Notifications, Product Cards, Modal Dialog, Progress Trackers, Tabs, Tooltips, and more — each with built-in states. These are the governed parts behind every checkout screen above.

Button / primaryContinue
Button / secondaryGuest Checkout
Text fieldFirst name
Inline / actionSign in for faster checkout
Inline / successPromo applied
Inline / errorEnter a valid card
PV badgePV 510
Progress trackerCart · Shipping · Pay · Done
Toggle

Documented in Zeroheight and mirrored in Storybook with Token Studio — so localization and engineering teams across six markets could compose checkout from shared, governed components instead of one-off screens.

Results

A checkout that converts — and scales.

58→38%
Post-cart checkout drop-off — down 20 points
16→4%
Bank-transfer payment failures — down 12 points
42→61%
Conversion rate for new users — up 19 points
↓45%
COD-related support tickets — a major clarity gain
80%+
Of global commerce checkout teams adopted the system
6
Additional markets received the scalable patterns
How these were measured

The drop-off, payment-failure, and conversion figures are measured before/after comparisons from the platform's instrumented funnel and the bank-transfer transaction logs, benchmarked against the pre-launch baseline for the same markets. The −45% COD tickets figure comes from the support team's ticket-category volume before and after rollout. Adoption (80%+ of teams, 6 markets) reflects the design-system governance tracker maintained with the global Design Systems team. Qualitative quotes are drawn from moderated usability sessions during validation.

What can be improved

Guest checkout collided head-on with the business model: the company makes money when shoppers register as Business Owners, so removing the forced account felt like removing the funnel. The compromise that shipped wasn't “guest vs. account” — it was guest checkout with a single, well-timed registration prompt after the purchase succeeded. Conversion and registrations both rose, because we stopped asking for commitment before we'd earned it. Naming that tension early is what got finance and growth to sign off.

Reflection

What scaling checkout taught me

01

Designing for ambiguity is a muscle

Payment systems are full of edge cases. Anticipating them with flexible frameworks beats patching screens one at a time.

02

Education ≠ overload

Users want clarity, not paragraphs. The right information at the right moment keeps people in the flow.

03

Inclusive design helps global users

Tooltips, explanations, and fallback paths reduce reliance on support and serve every market and ability.

04

Systems thinking > flow thinking

Scaling checkout globally means designing components, not just screens — so brand and behavior stay consistent everywhere.