The Auto Trader is the UK 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 the Auto Trader that help users to find the 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 aspect of a project including;
Throughout the project, we conducted multiple user studies, surveys and usability sessions with more than 1000 participants to understand users' needs, behaviour, emotions and persuasion trigger. We decided to take a data-informed approach and run more several experiments to improve and optimise the search experience.
The data indicates every hour 60,000 users were landing into the search listing page with zero results. Initially, I look into quick wins and display a message to the users requesting to change their search criteria if they see zero results on the search listing page. I put an experiment with 25% users and monitor performance for a week. After a week the result was flat and the number of zero search occurrence remains the same.
I look into the entrances to the search listing page and found that most of the mobile users enter through advance 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 reduced from 60,000 to 35,000 per hour but there were still lots of users clicking on the Search CTA even when they see 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 last filter selection which causes zero searches and disable the Search CTA until there is a result.
The undo the last filter had a promising impact on overall search journey. The number of the zero result occurrence reduced to 8,000 per hour, the exit rate on the search result page decreased from 30% to 21%, and leads to call seller increased by 6.33%.
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' exit on the search listing page and wouldn't visit ad page or engage with a seller, 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 that leads to inconsistent experience across the website. The business and design team sees this 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.
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, 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, analyse and measure the quality of 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 look into detailed scores for sub-dimensions of trust, loyalty, usability and appearance.
Trust and loyalty: 67% Participants expressed low trust in the brand but plan to visit the website in the future to search vehicle, mainly due to the stock availability on the website is far higher than any other website.
Desktop vs mobile usage: To get a sense of what activities participants most often do when they visit the motoring websites, we asked them how they accessed the website and completed the task. Searching vehicles to buy was the top reason to visit the website (79%), followed by researching vehicle information (46%) and comparing vehicles (33%). Mobile usage is high for the website. At least 70% of participants have used the mobile website in the past 12 months. Participants like the mobile website because it is quicker than going to the dealership, they can quickly contact the seller, and it’s easy to buy the vehicles.
Problems in the vehicle search: The usability study revealed 12 unique problems across the search. The critical problem users encountered were: difficult to search vehicles on the mobile, occurrence of zero search results, and overwhelming search page with a poor filtering process. We take a detailed look at each of those below.
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 need to do either of those to make any progress through the website.
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.
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 on was not prominent, they press the Search CTA and end up with the search listing page with zero results.
4. Difficult to find advance 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.
5. Hard to select car make on mobile: Participants find it hard to chose the vehicle make, as there are so many options to scroll through using the native functionality of the phone.
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.
7. Zero search results on mobile: Participants lands on the search listing page with zero results as they didn't know what affect their current filtering option has on the number of available search results.
8. Distractions on the desktop homepage: Participants found 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.
9. Postcode error on the desktop: As soon as the desktop website loads the red border appear on the postcode field without any interaction, suggesting there is already an error on the form.
10. Zero availability on the desktop: Participants selects 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.
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.
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 (min seats, colour, engine size, annual tax, etc).
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 menu, search icon and banner.
The click rate drops off significantly on mobile below the fold.
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.
The overall volume and growth rate of users and ad views on mobile is higher than desktop. The majority of users, visiting the mobile website to find vehicles for sale, and research vehicle information.
However, the volume of leads is higher on desktop than mobile.
Taking a behavioural perspective, we conceptualised user types, their needs, experiences, and categories them into the three distinctive groups.
Majority: A group of users want a vehicle to fulfil their need. 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 vehicles preferences from light touch research through Google, social media advertisements, other cars they've seen on the road and advice from friends and family. It is likely that they will 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 on 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 colour car with a sunroof and big wheels.
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 suggestion 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.
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, petrol heads, 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 desire search results.
I buy classic cars to do up in my spare time. I specialise in 1980's Ford Escorts and look for bargains with a potential to make money. I often buy CAT N cars for spare parts. I look closely for the cars which are potentially mislabelled or look to 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 details and great photographs. I have set up email alerts, so I don't miss out on the new listing.
We created an experience flow to visualise the user groups, stages of interaction, and how we can make the buying decision easier for them.
We host a day-long workshop and invited researchers, engineers, QA, product owner and senior stakeholders who have been involved or will be involved in the search project. The main goal of the workshop is to bring the cross-functional teams together, make them part of the design process, take their perspective, understand technical limitations and business expectations to deliver designs and project 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 search 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 considered most important. This will helped us to build a backlog and set priorities for deliverables.
We split the backlog and prioritisation into two stages. In the first stage, we encourage the teams to split the project into small achiveable tasks.The team breakdown project into 132 small tasks which seems realistic and can be deliver iteratively.
In the second stage, we asked the teams and stakeholders to prioritise tasks based on the 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.
The Auto Trader already have a design system in place, I utilise an existing pattern library to create design concepts to ship product quicker and maintain consistency throughout the website and mobile app. The aim for these concepts was 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 which 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 to use mobile to perform the search.
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 into 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 search listing page.
First, I look into quick wins and change the messaging on the search listing page with zero results. I put together an experiment to display Variant A and B to 25% 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 the Variant A, increase the exit rate, whereas Variant B, slightly decreases 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 occurrence remains the same.
I look into the entrances to the search listing page and found that most of the mobile users enter through the advance 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 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 see 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 a solution to undo last filter selection which causes zero searches and disable the Search CTA until there is a result. It was slightly complex to build but has 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.
As expected, the undo the last filter has a promising impact on overall search journey. The number of the zero result occurrence reduced to 8,000 per hour, the exit rate on the search result page decreased from 30% to 21%, and leads to call seller increased by 6.33%.
Although there is still a long way to solve all the problems. I think that 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 in improving the user experience.