Improved search case study

Improved Search

Auto Trader is the UK's most trusted brand for used and new cars. The improvements in search increase led to the sellers by 6.33%.

Highlights

The Auto Trader is the UK's leading and most trusted marketplace to buy and sell used and new cars. Millions of users visit Auto Trader every day to find their dream car. The search is one of the most used features at Auto Trader that help users to find used and new cars, based on their preferences. The current search experience is outdated; 30% of the users exit on the search listing page and wouldn't visit the full-page ad or engage with a seller. The business sees this as an opportunity to revisit search and improve overall user experience.

As a Principal Product Designer, I have an opportunity to lead the search project end to end, starting from the discovery phase, all the way to validation. However, to successfully achieve the project goals, many different teams come together and work collaboratively to make this project a success. I worked on various aspects of a project including;

Throughout the project, we conducted multiple user studies, surveys and usability sessions with more than 1,000 participants to understand users' needs, behaviour, emotions and persuasion triggers. We decided to take a data-informed approach and run several experiments to improve and optimise the search experience.

The data indicates every hour 60,000 users were landing on the search listing page with zero results. Initially, I looked into quick wins and displayed a message to the users requesting to change their search criteria if they saw zero results on the search listing page. I put an experiment on 25% of users and monitored performance for a week. After a week the result was flat and the number of zero search occurrences remains the same.

I looked into the entrances to the search listing page and found that most of the mobile users enter through advanced search. When users interact with search filters, there was no feedback from the search to inform users about the number of search results available on the next page. By introducing a search count on the Search CTA, zero result occurrence was reduced from 60,000 to 35,000 per hour but there were still lots of users clicking on the Search CTA even when they saw zero search count.

With the help of user feedback and session recordings, I learned that it was very difficult for users to understand which filter causes the zero search, there are more than 40 filters available for the users to use. It is handwork for the users to find the filter, remove it and start the search again. I took the guesswork from the users and proposed functionality to undo the last filter selection which causes zero searches and disable the Search CTA until there is a result.

The undoing of the last filter had a promising impact on the overall search journey. The number of zero result occurrences was reduced to 8,000 per hour, the exit rate on the search result page decreased from 30% to 21% and leads to call sellers increased by 6.33%.

The Approach

The search is one of the most used and critical features at the Auto Trader. On average, every month over 10 million users use search to find their dream cars. The search experience needed several performances, and design improvements; 30% of the users exited the search listing page and wouldn't visit ad pages or engage with a seller, and a few of the filters which were available on the desktop were missing on the mobile. The engineering team has to maintain different codebases for the desktop and mobile which leads to inconsistent experiences across the website. The business and design team sees this as an opportunity to revisit search, and

We had an overview of business needs from the stakeholders to move on in the project. Next, we dived deep into the user research to understand user needs and goals.

Usability Testing

Research

We recruited 1086 participants for the usability study on our testing platform. We asked participants who had visited Auto Trader in the past year to reflect on their most recent experience and questions about their prior search experience. In particular, we were interested in visitors' attitudes toward the search, the problems they had when searching vehicles, and the reasons they used the search.

Measuring the Search UX: We used an advanced algorithm to collect test data and analyse and measure the quality of the search user experience. The algorithm calculates scores based on a rolling database of around 50 websites across the motoring industry. The overall score using only existing users was 69%; we then looked into detailed scores for sub-dimensions of trust, loyalty, usability and appearance.

Problems in the vehicle search

1. No search form on mobile homepage: There is no search form on the mobile homepage to look up cars for sale, as there is on the desktop website. Due to the prominent position of the "Sign-up / sign-in" banner, participants thought they needed to do either of those to make any progress through the website.

No search form on mobile homepage

2. Confusing min and max date range on mobile: Participants find the mobile date selection confusing when stated as a min/max. They couldn't understand what is a minimum and maximum age when choosing a year, and what effect it will have using both.

Confusing min and max date range of mobile

3. Selected search filters are not prominent on mobile: Participants on the mobile didn't realise that few search filters were pre-selected from their last visit. The notification for selected filters was not prominent, they pressed the Search CTA and ended up with the search listing page with zero results.

Selected search filters are not prominent on mobile

4. Difficult to find advanced search filters on mobile: Participants struggle to find the advanced search filters on mobile as they can sit below the fold and beneath the Search CTA.

Difficult to find advance search filters on mobile

5. Hard to select car make on mobile: Participants find it hard to choose the vehicle make, as there are so many options to scroll through using the native functionality of the phone.

Hard to select car make on mobile

6. Colour selection on mobile is not intuitive: The colour selection on mobile is not intuitive as they are only text and not represented by swatches.

Colour selection on mobile in not intuitive

7. Zero search results on mobile: Participants landed on the search listing page with zero results as they didn't know what effect their current filtering option had on the number of available search results.

Zero search results on mobile

8. Distractions on the desktop homepage: Participants found the homepage distracting, in particular, the above fold content. The content above the fold diverted their attention, and they were unable to focus on performing the primary task which was search.

Distractions on desktop homepage

9. Postcode error on the desktop: As soon as the desktop website loads the red border appears on the postcode field without any interaction, suggesting there is already an error on the form.

Postcode error on the desktop

10. Zero availability on the desktop: Participants select options that result in 0 cars available. They were not sure what to do to get some results (increase distance, price, or something else) on the form.

Zero availability on the desktop

11. Poor form structure on the desktop: The form structure and hierarchy of fields on the search page are not logical, e.g. the car icons appear to be headers, but the fields below are unrelated.

Poor form structure on the desktop

12. Duplicate wording on select options: Participants suggested that it is unnecessary to duplicate words, where there are numerous select dropdown options. It is hard to read the list, especially with the (results) number. It applies to all selects with similar information contained therein (minimum seats, colour, engine size, annual tax, etc.).

Duplicate wording on select options

Data Insights

We believe that collecting and analysing data can help expose problems, provide more information about those problems, and evaluate the effectiveness of solutions. We start looking into analytics tools to capture the data which will guide us throughout the design process to create better designs and user experiences.

The desktop and mobile click rate comparison highlights the difference between the two layouts. The desktop is immediate but mobile splits choices three ways, the navigation menu, search icon and banner.

Compare desktop and mobile search click rate

The click rate drops off significantly on mobile devices below the fold.

Mobile search click rate

The desktop click rate and distribution show that the order of the form fields does not reflect the usage. The affordance and hierarchy on this page are poor.

Desktop search click rate

Desktop search click rate

Desktop search click distribution

Desktop search click distribution

The overall volume and growth rate of users and ad views on mobile is higher than on desktop. The majority of users visit the mobile website to find vehicles for sale, and research vehicle information.

User growth

However, the volume of leads is higher on desktop than on mobile.

Mobile and desktop lead

Desktop leads are higher than mobile

User and experience flow

Taking a behavioural perspective, we conceptualised user types, their needs, and experiences, and categorised them into the three distinctive groups.

  1. Majority: A group of users want a vehicle to fulfil their needs. The price is an important factor along with other personal preferences and they want the experience of finding their next vehicle to be easy and expect a helping hand along the way. They take inspiration for their vehicle preferences from light touch research through Google, social media advertisements, other cars they've seen on the road and advice from friends and family. They will likely ignore technical information outside of their personal preferences, so limiting this to the core needs and presenting it in an understandable human tone is important.

    Some of the use cases for this group are:

    I have recently got a new job out of town, and I need a reasonably priced car that will get me to work and last a few years. I would prefer not to have a diesel and I quite like blue.

    My car has broken down, and the repair costs are too high. I need a car that I can afford easily, and that's available close to me. I'm not too fussed about the make or model.

    I see a lot of Range Rovers in my local area, and I like the look of them. A high-spec version would be ideal as I do love a white car with a sunroof and big wheels.

  2. Minority: A group of users have non-negotiable requirements that must be met for them to buy a vehicle. They want to specify their needs which can span a large area of choice. In general, they would be open to suggestions on what is available within the restrictions of their needs. They expect the bespoke experience to the choices they make along the way and want the information that is important to them easily accessible at any given step.

    Some of the use cases for this group are:

    We just had a baby and need a little more space. Isofix child seat points are a necessity along with a boot big enough to fit the pram in. Ideally, we need a car with a high safety rating.

    I am looking for a sporty convertible car that has two seats and around 300 bhp. I have got my eye on a Porsche 911 but would like to know what else is available in this class.

    I want to move away from fossil fuels and get a fully electric car. I drive a fair distance each week for work, so the long-range is a must. I do potentially be open to a Hybrid that offers good MPG.

  3. Edge case: A group of users who are detail-driven and know a lot about vehicles in general. They are looking at the required access to a deep level of information to make a decision. They may be business owners, petrolheads, classic car buyers or dealers. They know what they are talking about and expect access to a level of information that reflects this. They visit the website regularly and don't mind working a little harder to get the information they require but prefer to save their preferences for the bespoke future experiences, each time they visit a website.

    Some of the use cases for this group are:

    I am looking to expand my business and need a bigger van that has a large capacity. I expect to do many miles a week and need a low-mileage van, preferably one that already has brackets installed and has three seats in the cabin.

    I own a car dealership and use Auto Trader as my primary online sales platform. I visit the website regularly to find vehicles similar to those I have in stock to make sure I am staying competitive. I know how the website works inside and out. I also learned a few tricks over the years to get the desired search results.

    I buy classic cars to do up in my spare time. I specialise in 1980s Ford Escorts and look for bargains with the potential to make money. I often buy CAT N cars for spare parts. I look closely for cars that are potentially mislabelled or have issues that can be fixed easily with my expert knowledge. When I am searching for a car, I look for a deep level of detail and great photographs. I have set up email alerts, so I don't miss out on the new listing.

Experience flow

We created an experience flow to visualise the user groups, stages of interaction, and how we can make the buying decision easier for them.

Experience flow
Experience flow

Workshop

We hosted a day-long workshop and invited researchers, engineers, QA, product owners and senior stakeholders who have been involved or will be involved in the search project. The main goal of the workshop is to bring cross-functional teams together, make them part of the design process, take their perspective, and understand technical limitations and business expectations to deliver designs and projects smoothly.

We begin the workshop with so-called "How might we?"—or HMW—questions. These capture important issues that need to be addressed as part of the product design. For example, if the expert complains that existing solutions limit users to perform a search for a single-car make and model, someone might jot down "HMW let the user select multiple make and models?". We show existing Searches to the team and ask everyone to jot down their HMW questions. We gather all HMW questions, organise them into a few high-level categories and ask everyone to vote next to the categories they consider most important. This will help us to build a backlog and set priorities for deliverables.

HMW questions

Workshop with team

We split the backlog and prioritisation into two stages. In the first stage, we encourage the teams to split the project into small achievable tasks. The team breaks down the project into 132 small tasks that seem realistic and can be delivered iteratively.

Workshop create a backlog

In the second stage, we asked the teams and stakeholders to prioritise tasks based on the impact effort matrix.

Impact effort matrix

It is a simple yet powerful tool to help people reach an agreement that clarifies priorities. The jobs that require the lowest effort for the highest impact rise to the top of the list, and jobs that require a greater effort but will have a lower impact sink to the bottom.

The jobs were prioritised accordingly by the teams and stakeholders. Everyone in the organisation shared the same vision across the project, and we have a solid foundation to commence designs.

Designs

The Auto Trader already has a design system in place, I utilise an existing pattern library to create design concepts to ship products quicker and maintain consistency throughout the website and mobile app. These concepts aimed to improve the overall search experience by testing, learning and iterating design based on user feedback and data insights.

The Auto Trader website is not responsive and two separate codebases (desktop and mobile) are maintained by the developers. The team and business realise that converting the entire website into a responsive website to merge the codebase is a big project that could take months and delay the search project. I had a meeting with the engineering team and stakeholders, and everyone agreed to take the mobile-first approach as 60% of our audience uses mobile to perform the search.

Zero search results

I took a structured design approach to resolve the user problem and achieve a business goal. The data indicates that every hour 60,000 users were landing on a search listing page with zero results and leaving the website. The biggest challenge for me was to reduce zero search result occurrence and exit rate on the search listing page.

First, I looked into quick wins and changed the messaging on the search listing page with zero results. I put together an experiment to display Variant A and B to 25% of users and monitor performance for a week. I also added a link to the form on the page to capture the feedback from the users. After a week Variant A, increases the exit rate, whereas Variant B, slightly decreases the exit rate. The users were clicking on a "Change Filter" button and returning to the search page to change the filters. However, the number of zero search occurrences remains the same.

Zero search results on mobile

I looked into the entrances to the search listing page and found that most of the mobile users enter through the advanced search page. When users interact with search filters, there was no feedback from the search to inform users about the number of search results available on the next page. I proposed to add a search count on Search CTA to improve the communication between users and the system. As a result, the zero result occurrence reduced from 60,000 to 35,000 per hour. However, there were still lots of users clicking on the Search CTA even when they saw zero search count.

Search count on mobile

With the help of user feedback and session recordings, I learned that it was very difficult for users to understand which filter causes the zero search, there are more than 40 filters available for the users to use. It is handwork for the users to find the filter, remove it and start the search again. I took the guesswork from the users and proposed a solution to undo the last filter selection which causes zero searches and disable the Search CTA until there is a result. It was slightly complex to build but had a high number of chances to deliver a positive impact on both user experience and achieving a business goal to reduce the exit rate, and increase leads.

Undo last filter

As expected, the undoing of the last filter has a promising impact on the overall search journey. The number of zero result occurrences was reduced to 8,000 per hour, the exit rate on the search result page decreased from 30% to 21% and leads to call sellers increased by 6.33%.

Zero search results report

Although there is still a long way to go to solve all the problems. I think that the proposed designs improve the most important issue I found during testing. I believe that presenting information in a better way to bring more assertive search results to the user is key to improving the user experience.

Other Projects