Sports Direct Checkout Redesign

Role: Product Designer

Objective
The aim of this redesign is to enhance the user experience during the checkout process, aligning with key performance indicators (KPIs), and creating a smoother and more intuitive journey for customers.

Key KPIs

  • Increase Mobile Transaction Rate: Currently, 90% of traffic comes from mobile, with only 10% from desktop.

  • Improve Conversion Rate: Focus on converting more visits into successful transactions.

  • Increase Average Order Value (AOV): Encourage larger purchases per transaction.

  • Reduce Cart Abandonment: Minimise drop-offs during checkout.

  • Enhance Click-Through Rate (CTR): Improve the likelihood of moving through each step in the checkout process.

  • Decrease Checkout Time: Streamline the process to reduce the time spent completing a purchase.

  • Boost Retention Rate: Increase repeat customers and foster loyalty.

Process

Discover – Research and explore the problem space to gather insights.

Define – Analyse insights to pinpoint and articulate the core problem clearly.

Develop – Design, prototype, and test potential solutions.

Deliver – Refine and implement the final solution.s, BAT

Problem Statement 1: Delivery Type Stage

During user testing of the checkout process, participants encountered an extra click when selecting their delivery address, which extended the process into a three-step journey before reaching the delivery input fields. This additional step led to confusion and inefficiency, as users expected a more direct path to inputting their address. Streamlining this process by reducing unnecessary clicks could enhance the user experience, making the journey to select and confirm a delivery address quicker and more intuitive.

Problem 2: Delivery Type Stage

User testing of the Collect In-Store delivery option revealed a misalignment between user expectations and the actual delivery cost. Participants were frustrated because they expected this delivery option to be free, given its nature, and were surprised by the additional cost. This discrepancy in expectations may lead to checkout abandonment, as users perceive the delivery charge as an unexpected or hidden expense, potentially affecting overall customer satisfaction and trust in the pricing structure.

"I expected more affordable delivery options."

"I was surprised that Collect In-Store wasn’t free."

“The low product prices drew me in, but the delivery cost felt like a hidden expense."

Problem 3: Apple Pay Integration

Apple Pay has the highest completion rate but the lowest usage - Experimentation team

User testing revealed that users expect Apple Pay to be available earlier in the checkout process, as it is their preferred and fastest payment method. Participants were surprised to find it only presented at the final payment stage, which created friction and disrupted the smooth flow they anticipated. This misalignment between user expectations and the placement of Apple Pay could lead to increased cart abandonment and slower checkout completion. Introducing an express checkout option with Apple Pay earlier in the journey could streamline the process, reducing friction and improving overall checkout efficiency.

"Apple Pay simplifies checkout for me."

"Apple Pay is my preferred payment method."

"I’d love to see Apple Pay earlier since it’s the fastest option."

Hypothesis

  • Introducing an express checkout option with Apple Pay earlier in the journey will streamline the process, reducing friction and accelerating checkout completion.

Success Metrics

  • Increase in order completion rate

  • Reduction in checkout time

  • Decrease in cart abandonment for mobile users

Problem 4: All Stages, Navigation Friction in Checkout

User testing revealed significant navigation friction in the checkout process, with users expressing frustration over the inability to return to previous steps. Participants repeatedly attempted to click on unclickable step headings, reflecting confusion about how to move backward or forward in the process. This widespread issue indicates a fundamental usability problem that disrupts the checkout flow and creates unnecessary barriers. To address this, a more intuitive and clear step navigation system should be introduced, allowing users to easily return to previous steps without hindering their progress. Enhanced visual cues and guidance will improve the overall user experience and streamline the checkout journey.

Problem

Users are repeatedly clicking on unclickable step headings throughout the checkout process. This behavior suggests:

  • An attempt to navigate backward or forward between steps.

  • Confusion about how to progress to the next stage.

Data Insight

  • High click recurrence on unclickable step headings was observed consistently across all checkout stages, indicating a widespread usability issue.

Potential Solution

  • Introduce a clear step navigation system allowing users to easily return to previous steps without disrupting progress.

  • Improve visual cues and guidance to clarify how users advance through checkout.

Problem 5: Checkout Order Summary

User testing revealed that the 'My Bag' dropdown during checkout lacks the ability to remove items directly, forcing users to exit the checkout flow. Additionally, the placement and functionality of the dropdown and order summary are not intuitive, leading to frustration. High tap frequency on the dropdown suggests users want easier access to modify their cart. Improving this feature would streamline the checkout process and enhance user satisfaction.

Problem

Currently, there is no option to remove items directly from the 'My Bag' dropdown during the checkout process. Users must exit the checkout flow, return to the basket page, and then remove items. Additionally, the placement and functionality of the 'My Bag' dropdown and order summary are not intuitive, leading to a less-than-optimal user experience.

”Order Summary/My bag in checkout is not intuitive.”

”My bag/Order summary placement a bit odd”

Data

Analysis reveals a high frequency of taps on the 'My Bag' dropdown, indicating that users frequently want to review or modify their cart contents without leaving the checkout page. This suggests that improving the accessibility and functionality of the 'My Bag' dropdown could significantly enhance user satisfaction and streamline the checkout process.