Home Page Redesign

Compare the Market is a price comparison website that offers customers to compare a range of insurance, energy and personal finance products.

Faster, easier, more meerkat

Company
Compare the Market
Role
UX/UI Designer
Timeline
3 months - UX/UI
Tools
Figma, Zoom, Miro

Project overview

I redesigned Compare the Market's homepage to streamline user navigation, improve product discoverability, and enhance the brand’s personality. The new design focused on reducing cognitive load and increasing engagement metrics.

Key Goals

  • Help customers complete their goals & finish their journeys faster
  • Highlight the breadth of our product & service offerings
  • Make it more engaging & "meerkat"

Success metrics

  • Reduced bounce rate from the home page
  • Increased quote start volumes from the home page
  • Better page scroll & content engagement
  • Improved customer feedback and engagement.  
  • Reduced time on page and shorter dropdown interactions

Discover

I started by conducting a detailed analysis of user behaviour using Google Analytics and existing customer feedback. This revealed several key insights:

  • High bounce rates, particularly on mobile devices
  • Confusion around navigating product categories

Next, we ran user interviews with 5 current users. These sessions uncovered two main issues:

  • The old navigation menu was overwhelming
  • Users struggled to find what they needed quickly

We also conducted competitor benchmarking, which showed that other comparison sites had more intuitive and engaging designs, especially for showcasing products.

Tools

Define

Through analysis of user feedback and comprehensive data analytics, I identified a critical pain point: users were struggling to navigate the home page to find a simple and intuitive entry point for product exploration and quote initiation.

I synthesised these findings into user personas and key pain points, which informed the problem statement: “How might we simplify navigation and increase product engagement while enhancing the brand’s identity?”

Armed with this insight, I embarked on a mission to create easy access to our top products, while still allowing users to see and explore our breadth of product.

Key painpoints

Bad brand utilisation

The design was outdated compared to competitor websites, and not utilising our brand to its full potential, which led to low recognition.

Option overload

The majority of users were using the header drop-down as the main point of navigation from the HP. The order and number of options to select from made it hard to quickly find what our customers were looking for.

Stuck above the fold

Users were staying largely above the fold, and weren't seeing value propositions, giveaways, or supporting content that could help their purchase decisions.

Poor navigation design

Users who were going below the fold were trying to use text titles as links to navigate to the products however, these titles were not linked.

Ideate

I ran brainstorming sessions with stakeholders and designers to generate several concepts. We developed three distinct wireframe prototypes with varying levels of complexity in navigation and product exposure. These designs focused on:

  • Simplified icon-based navigation
  • More engaging visuals representing the meerkat brand identity
  • Clear product access points above the fold

We tested these wireframes with 8 users in moderated remote usability sessions. Feedback highlighted that users preferred designs that offered immediate access to products via a prominent and visual product menu, with testimonials providing a sense of trust and authority.

Branding

Concepts

Develop

Based on user feedback, I iterated on the designs, incorporating:

  • Streamlined navigation through a simpler product menu
  • Prominent CTAs above the fold
  • Interactive product sections for easier browsing

The final prototype underwent an A/B test during the soft launch, where it was shown to a small segment of users. The results compared user behaviour between the existing and new designs.

Metrics from the test indicated that the new design led to a 12% reduction in bounce rate, 10% increase in time on page, and a 5% uplift in conversion. Following this success, we rolled out the new homepage to all users.

$500,000

Increase in revenue from the HP month on month. (June 2019 vs June 2021)

10%

Increase in page views through better navigation and better internal linking structure.

12%

Decrease in bounce rate  thanks to faster access to product range.

Key features

Faster navigation

A prominent icon menu replaced the standard scroll menu that users had difficulty navigating due to a lack of distinction between text.​

Social proof

Bringing the love we receive from customers to be easily visible and help users feel more secure in the brand.

Easy to access product catalogue

Users can now easily access products and sort based on type, access that was much needed to users and caused confusion when they couldn't access products via more information.

Final designs