Wyndham Destinations · UX Designer · November 2019 – March 2020

Redesigning the checkout funnel.

Club Wyndham's checkout funnel looked outdated and boring. Most importantly, it was not responsive — causing the mobile experience to be unusable. The transaction summary was cluttered and contained too much information.

Club Wyndham checkout redesign

Problem

Club Wyndham's checkout funnel looked outdated and boring. Most importantly, it was not responsive, causing the mobile experience to be unusable. The transaction summary was cluttered and contained too much information.

Solution

Redesign the checkout funnel and make it responsive, aesthetically pleasing, and functional.

Summary of what I did

Discovery + Research
  • Competitive analysis
  • Online studies research
  • Analyzing user feedback from customer service team
Design
  • High fidelity mocks
  • InVision prototypes
  • Delivered mocks for mobile, desktop, and tablet
Collaboration

Collaborated with:

  • Paul, Product Manager
  • Kristin, Project Manager
  • Anuk, Lead Engineer
  • Wyndham Destinations product design team
  • Beth, QA
  • Engineers
  • Research team
  • Brian, Data Analyst
QA
  • Responsible for visual QA
  • Assisted in QA
Accessibility
  • Collaborated with Beth in validating and passing accessibility

Before the Redesign

The existing checkout had several usability problems: unclear information hierarchy, inconsistent UI patterns, and a visual design that hadn't kept up with modern expectations for booking flows.

Before redesign - screen 1 Before redesign - screen 2 Before redesign - screen 3 Before redesign - screen 4 Before redesign - screen 5

Research

Research - Number of Steps
Research - Checkout Abandonment
Research - Form Fields
Research - Mobile Checkout 1
Research - Mobile Checkout 2
Research - Mobile Checkout 3
Research - Apple Checkout Reference

Competitive Analysis

I analyzed checkout flows across 10 major booking and travel platforms to benchmark Club Wyndham against industry leaders and identify patterns worth adopting.

Agoda
Airbnb
Apple
Booking.com
Google Shopping
Groupon
Hotels.com
Hotwire
Orbitz
Southwest
Competitive analysis comparison table

Key Discoveries

  • Rate of checkout abandonment in mobile is high compared to desktop.
  • The average number of pages in a checkout flow is 4.
  • The 2 most common reasons for checkout abandonment are unexpected costs and long, complicated checkout process.

Solution

The redesigned checkout brought a clean, modern visual language, clearer information hierarchy, and a streamlined multi-step flow that reduced cognitive load and guided users confidently through to booking completion.

Redesigned checkout - Responsive Screens

Responsive Web: All Screens

Redesigned checkout - Payment screen

Payment

Redesigned checkout - Services screen

Services

Redesigned checkout - Transaction Summary

Transaction Summary

Redesigned checkout - Confirm screen

Confirmation

Redesigned checkout - Thank you page

Thank You Page

Redesigned checkout - Mobile

Responsive Web: Mobile

Redesigned checkout - Mobile screens detail

Mobile Screens Detail

Results

24%

increase in e-commerce conversion rate

  • Mobile users increased.
  • With the redesign, there was a 24% increase in e-commerce conversion rate. This is a metric that is calculated by transactions over visitors to site.
← Cars.com P2P All Work BM Chat →