Streamlined checkout by improving order details, button clarity, and adding a confirmation page.
Client
Puma UK
Role
UX Researcher, Designer
Timeframe
Q3 2024
Services
UX Research, UX Design, User Interview
Project Overview
Puma UK faced a significant challenge with high drop-off rates during the mobile checkout process. My role was to evaluate the checkout experience, identify key pain points, and recommend actionable improvements to streamline navigation and increase conversion rates.
Problem
The PUMA UK mobile checkout process had a high drop-off rate, indicating user frustration and missed conversion opportunities. Key issues included:
Solution
A redesigned checkout flow that:
Impact
⏱ -15%
Checkout Completion Time
🌟 +30%
Customer Effort Score (CES)
🔍 +25%
First-Attempt Success in Finding Payment Options
💰 +Projected $15M
Est. Annual Revenue Impact
How I Solved Problems
Previous Design Design Design
The “2.PAY” text in the checkout process confused users because its purpose was unclear and often mistaken for a clickable button. This misunderstanding caused hesitation and disrupted the flow of completing their payment.
My Recommended Design Design Design
I replaced the “2.PAY” text with clearer wording, moving it to the top of the section and placing the button at the bottom. This follows common design patterns where users expect to click buttons placed at the bottom.
“I think it’s a little bit confusing,
i don’t think it should be there” – Emma
“I don’t know what that means” – Chris
Previous Design Design Design
Users found the repeated order details at the top of every page unnecessary and time-consuming, slowing down the checkout process.
My Recommended Design Design Design
I simplified the checkout flow by keeping the order details accordion open only on the Cart page, closed by default on other pages, and adding a clear confirmation page at the end.
“I’d condense this part of the page, I have already seen my basket” – Emma
“Having to scroll down each time is a little bit frustrating” – Ed
“I’d like to see a page showing all my order details before placing the order” – Farouq
My Approach
- Through Data analysis using GA4 I found high drop off rate in checkout.
- Conducted competitive analysis to identify areas where PUMA’s checkout process fell short compared to competitors.
- Analyzed user frustrations and pain points using unmoderated usability tests with multiple participants from different countries, focusing on the high drop-off rate during the checkout process.
- Identified critical issues:
- Repeated and unnecessary views of order details during checkout.
- Confusing labeling, such as the “2.PAY” button.
- Lack of a final and order summary,and secure payment connfirmation leading to user hesitation before completing payment.
- Clearly defined the problem as “High checkout drop-offs caused by friction in the user journey and a lack of clarity during key steps.”
- Mapped the existing checkout flow to highlight redundant steps and ambiguous UI elements.
- Created user personas and prioritized guest checkout as a core need, based on insights from research.
- Designed a new flow with:
- A single cart summary.
- Clear, actionable language replacing confusing terms.
- A final order review with secure payment confirmation before payment.
- Created wireframes and tested solutions with users.
- A/B tested the new design against the old one.
- Iterated based on feedback to ensure smooth navigation and clarity.
- Documented the final design recommendations and insights in a detailed report.
- Shared findings with team to support future implementation decisions.
- Prepared a visual summary of the redesign for presentations.
Final Result
Through comprehensive UX research, Competitive analysis and user interviews, I identified key pain points in the PUMA UK checkout process. The redesigned checkout flow improves clarity and efficiency:
Before
After
After
These changes are expected to reduce drop-off rates, enhance user satisfaction, and streamline the checkout experience.