Basket re-design – Ali Hughes

Basket

re-design

Doing a deep in how users from different sources interact with the most popular and important page and re-defining their goals by redesigning the page.

Project duration: 4 months

Project role: Project lead

Team: 1 FE + 1 PD

Problem statement to solve

“The existing basket page, which served as a primary entry point for users from multiple acquisition sources, failed to support conversion due to a repetitive, quote-focused experience, limited relationship-building elements, and a lack of clear mechanisms to guide users toward meaningful engagement.”

Overview

Aggregator-based sales account for over 60% of the company’s total revenue, with these users entering the site directly through the basket page, where they are able to complete a purchase. However, the existing basket page was designed primarily for returning users who had already established a relationship with the company through the traditional quote flow, rather than for new or first-time aggregator users.

As a result, the majority of aggregator users were restarting the quote flow to recreate quotes they had already completed on aggregator platforms. This unnecessary repetition increased friction, raised the likelihood of drop-off, and contributed to higher bounce rates. Over time, the basket page became a significant bottleneck in the conversion funnel, despite being one of the highest-traffic entry points to the site.

Recognising this gap, I proactively initiated a dedicated redesign project, conducting a detailed analysis of user behaviour, performance data, and existing pain points. The goal was to identify overlooked usability issues, understand why the basket page was limiting conversion, and uncover opportunities to improve clarity, engagement, and overall sales performance.

Understanding the users process

To understand the end-to-end user journey, I began by analysing existing behavioural data. All user interactions were tracked through FullStory (for users with cookies enabled), allowing me to create dashboards that surfaced patterns, trends, and common behaviours—including where users focused their attention and how they searched for information on the page.

To complement the quantitative insights, I conducted stakeholder interviews to deepen my understanding of user behaviour across acquisition sources. This included discussions with aggregator partners, who shared insights into how users typically interact with insurance products across different platforms.

I also collaborated closely with marketing teams, leveraging their deep knowledge of user acquisition, targeting strategies, and user motivations. These conversations helped identify opportunities to extend reassurance, consistency, and trust-building messaging onto the basket page, reinforcing confidence and supporting users in their decision to convert.

Data

50% – Amount of users recycling back into the quote flow
55% – Checkout CTA exposure rate
25% – Drop off rate
30% – Page bounce rate
20% – Amount of users rate clicking
10% – Deleting quote

Key focus points for the re-design

Reducing cognitive overload

Data showed that users were being overwhelmed by the volume of information presented on page load. Surfacing everything at once made it difficult for users to understand what mattered, leading to decision fatigue. A key focus of the redesign was to progressively reveal information and prioritise clarity over completeness.

Making add-ons feel valuable, not incidental

Each policy included meaningful perks, but these were previously surfaced as plain text within a dense basket layout. As a result, add-ons were overlooked and undervalued. The redesign focused on elevating these benefits so they felt intentional, discoverable, and worth engaging with.

Eliminating repetitive content

Policies and add-ons were visually and structurally repetitive, which reduced scannability and caused users to disengage early. Many users didn’t scroll far enough to see secondary policies or key CTAs. The new approach focused on differentiation and hierarchy to guide attention through the page.

Improving cost transparency

When users selected multiple policies, the total cost was not made clear until the final purchase step. This often came as a surprise and eroded trust. Making pricing clearer and more predictable throughout the journey became a core priority.

Creating a more personal, intentional experience

The previous layout felt like a data dump rather than a considered user experience, placing the burden of understanding on the user. The redesign aimed to introduce structure, visual hierarchy, and warmth—so the page felt designed, supportive, and easier to navigate.

First re-design

Cleaner design

Each section of the quote now allows users to quickly jump back and forth to the specific area they want to amend, removing the need to recreate an entire quote for small changes. This interaction was designed to support iteration while preserving the integrity of the overall quote structure.

Embedding this functionality within the quote breakdown enables the page to present the quote as a near-finished product, reinforcing user confidence, while still allowing controlled flexibility. This approach also addressed a key technical constraint: full inline editing was not feasible, so navigation-based editing provided a practical alternative without compromising usability.

Despite being a relatively small interaction change, this update led to a 30%+ increase in quote retention, demonstrating the impact of reducing friction at critical decision points.

First version results

Results from the first solution

The initial redesign showed strong promise, with early metrics indicating improved user engagement. However, the overall impact was more incremental than transformative. A key constraint of this mini project was the requirement to avoid backend changes, meaning all improvements had to be delivered through minimal front-end updates. This limited the scope for more substantial, system-level enhancements. Despite these constraints, the redesign demonstrated the value of focusing on key user journeys and high-impact pages. By refining these touchpoints, the changes were able to improve usability and better support user needs within a restricted environment. Importantly, this work highlights how targeted, user-centred design decisions can still deliver measurable improvements. It reinforces the importance of prioritising critical interactions and provides a strong foundation for advocating more comprehensive UX investment in future iterations.

Data

15% – In quote retention
55% – In CTA exposure rate
25% – Decrease in drop off rate
30% – Decrease in deleted quote
2 minutes – Decrease time on page

Stakeholder feedback

Following the first release, all stakeholders were satisfied with both the updated design and the results achieved after one month of being live. The improvements in performance validated the initial design decisions and user-focused approach.

This success also opened up further discussion around how the experience could be developed and improved further. With clear evidence that the redesign had a positive impact, there was an opportunity to expand the scope beyond the original constraints.

As a result, I was able to secure additional resources for a second iteration of the redesign, including access to backend development. This created the potential to move beyond surface-level improvements and address deeper usability and experience challenges.

Next step

The second iteration of the basket page redesign explored a broader scope of changes, enabled by increased resources and fewer technical constraints. This phase focused on moving beyond incremental improvements to deliver more impactful, experience-driven enhancements.

A key focus was the introduction of an inline editing experience, allowing users to modify their quote directly within the basket page. This reduced friction in the user journey by minimising the need to navigate away from the page, streamlining the overall experience.

In addition, the redesign introduced new styling elements to align with the co-pay feature being launched concurrently. This ensured visual consistency across related features and helped create a more cohesive and intuitive user experience.

Second re-design

Inline editing

The updated version introduced inline editing for quotes, removing a previous technical limitation and enabling users to make changes directly within the basket page. This significantly reduced friction in the journey and supported a more seamless, self-serve experience.

To address the increased page depth introduced by inline editing, a sticky CTA was implemented. This ensured that users always had clear access to the next step, maintaining momentum and reducing the risk of drop-off.

While the redesign retained all of the core information from the original experience, it presented it in a more responsive and editable format. This improved usability without compromising the clarity or completeness of the content.

Previous data showed that the “See what’s covered” modal increased conversion among users who interacted with it, but overall engagement with the feature was low. To improve visibility and accessibility, this content was reintroduced as an accordion-style list directly on the page. Positioned at the bottom, it allowed users to explore coverage details progressively, balancing the need for more information without overwhelming the user.

Following the release of the second version of the redesign, performance improvements were clearly reflected in user behaviour. Aggregator traffic saw a 10% increase in conversion, indicating a more effective and streamlined user journey.

At the same time, the recycle rate to the rest of the site decreased by 60%, suggesting that users were able to complete their journey more efficiently without needing to navigate away. This highlights the impact of reducing friction and improving clarity within the basket experience.

Loading state

One of the inherent limitations for users arriving via aggregators is a slight delay in the API response while their quote is generated. Rather than treating this as a drawback, it was reframed as an opportunity to enhance the user experience.

A dedicated loading experience was introduced, designed to surface key brand USPs while the quote data is being retrieved. This transformed a passive waiting moment into an engaging and informative touchpoint.

From a user perspective, this approach provides immediate feedback and creates a more engaging, visually considered experience, helping users feel more connected to the brand instead of simply waiting for the page to load.

From a business perspective, it creates a focused space to communicate key value propositions without competing for attention on the basket page. Additionally, it improves the perceived performance of the site by reducing the frustration typically associated with loading delays. It also helps build a sense of user commitment by investing time in the loading experience, users are less likely to drop off once they reach the basket page.

Result and impact

From a delivery perspective, the redesign progressed smoothly. Stakeholders were aligned on the direction, and the page was released without disruption to the wider site experience. The transition felt seamless, with no negative impact on existing user flows or system performance.

Gathering clean user data post-launch proved more challenging. Shortly after release, the site experienced a significant increase in bot traffic that lasted for approximately three weeks, which distorted early analytics. To work around this, I relied on user ID–based tracking and built custom dashboards to isolate genuine user behaviour and measure the impact of the redesign accurately.

Based on data collected three weeks post-launch and analysed over the following eight weeks:

• Organic traffic conversion increased by 18%
• Users arriving via aggregators converted 12% better,
bringing their conversion rate in line with organic traffic and removing a long-standing discrepancy
• 20% increase in users engaging with free extras included in their policy (measured from users who completed checkout using the new basket)
• 40% reduction in customer support enquiries related to policy coverage
• While not directly measurable, GoCompare and MoneySuperMarket independently reported an improvement in our ranking following the redesign

Although this was a single page within the site, it played a critical role in both conversion and user confidence. Its importance had previously made it difficult to change, due to concerns around unintended knock-on effects.

By approaching the redesign transparently—grounded in data, clear rationale, and stakeholder collaboration—I was able to build confidence across the business. The results validated that approach, demonstrating that thoughtful iteration on even high-risk pages can deliver meaningful gains for both users and the company.