Garaj11 Web & App Redesign
Redesign of second-hand car buying and selling service which has just entered the market in 2020.
The Challenge
Garaj11 is n11.com’s vertical that entered the market in 2020 as second-hand car buying and selling services​​. A different UX team took part in the first designs of the project. Shortly after release, they asked for reviewing the experience overall and submit suggestions for essential improvements.
The challenges of this project are trying to get the strategy and targets quickly with a sudden C level demand, the time constraint given by the business, the absence of events for measuring on the data side, the lack of resources on the development side. And lastly, there were already many strong competitors in the market.
My Role
We worked as a team on this project. As a Senior UX Designer in the team, I worked with one more Senior UX Designer, two User Researchers, one UX Writer and one UI Designer. My responsibilities included deciding what needed to be researched before starting the project, planning it, highlighting strategic points based on research findings and data analysis, and offering improvement suggestions.
Goals
The main expectation of the business from Garaj11, which has just entered the market, was to encourage them to buy vehicles online as they know that offline shopping is preferable in this sector.
The 3 main goals we focused on as a team:
-
Examining whether it encourages users to buy second-hand online vehicles.
-
Finding problems on the current experience and offering quick wins.
-
Offering long-term suggestions of what can be done by capturing improvement points in the customer journey.
Discovery
Research Techniques
The research phase started after Garaj11 launched. Here are the research activities we did in a short time as a team:
​
-
Expert Review
-
Survey & Hotjar & Google Analytics
-
Guerilla In-depth Interviews and Usability Tests
-
Competitor Analysis
1. Expert Review
In all channels, we identified 70 findings based on user flows as a whole team. We prioritized and documented it with our solution offers according to the importance and whether they can be solved quickly.
2.Surveys & Hotjar & Google Analytics
The traffic of the Garaj11 was not as high as we would expect. Also, events for Google Analytics were missing. We wanted to use the qualitative data from Hotjar and the survey as support. We aimed to collect data from a more targeted audience by surveying the auto category of n11.com, the roof site of Garaj11.
3. Guerilla In-depth Interviews and Usability Tests
As UX Designers, we addressed the main topics that we should focus on with the user researchers team. There were many issues but, the main ones are:
-
Do they understand what Garaj11 is?
-
Do they discover service value propositions?
-
What are the problems faced by those who are thinking of buying a second-hand car and visiting Garaj11?
-
What are they convinced of and what are they not?
4. Competitor Analysis
We examined 25 different domestic and foreign second-hand vehicle sites to enrich our information.
Car Discovery
Ideation
Product Strategy
At the end of these activities, we started to draw the user journey and observed where we could touch on this. After that, we identified the 4 strategic main topics that we need to address:
-
Mobile-first experience (Google Analytics)
-
Organic traffic & strengthened SEO (Google Analytics)
-
Lead-generation touchpoints (Expert Review, Benchmarking, Guerilla Tests)
-
Usability & UX Content improvements ( Expert Review, Guerilla Tests)
User Journey Touchpoints
Note: The ones written in light red rectangles are non existing in the current experience.
Findings & Recommendations
We identified 17 main problems according to user interviews, Hotjar heatmap, recordings and Google Analytics data analysis. On the other had, I only mentioned 3 most important findings in this study.
AWARENESS
Recommendations:
-
Static banner: As seen on global benchmark sites, a hero image with a unique value proposition can be used instead of carousel banners. ​15 out of 19 competitors have a static banner.
-
If carousel banners are to be used, value propositions can be positioned on each banner, as in the example of “Carro” website.
Findings 1# Value Propositions
For new visitors, "What is garage11?" is a unique value proposition information that was not highlighted. This message in the first banner can be missed because the carousel rotates automatically and this information is compressed into a banner.
​
​
Users who have just discovered Garaj11 want to see detailed information here.​
Guerilla Test
Competitor Analysis- Banner Examples
SEARCH & FIND
Findings 2# Ways to Discover Cars
The homepage is weak in facilitating car discovery.​
​
​
There are 2 different behaviours in the car research process: ​ ​
-
Coming up with a specific brand and model in mind,​
-
Exploring the cars they can afford to buy.​
​
When we look at the heatmap, we see that the Brand, Year, Price and City filters are the most used filters.
User Interview
Hotjar Heatmap
Recommendations:
-
Different discovery modules on the homepage can be offered by model, brand, price, etc. to make car discovery easier.
User Interview
The action buttons on the PDP do not promote the users to take action and they are not promoted in terms of placement and content.​
​
The users have stated that when they decide to buy the car, they will not be directed to Buy Now or Car Reservation actions. The primary behaviour of the users was to search for contact information to go and see the car.​
Users want to see the contact information or the car in person before entering the Buy Now or Reservation processes.
Recommendations:
-
The placement of action buttons in Buy Now section should be replaced with encouraging elements. ​
-
Contact us option could be prioritized between the actions.
Findings 3# Action Buttons
CONSIDERATION
Current Design
Design
Mobile Wireframe
Since we know that traffic is higher on mobile channels, we wanted to design wireframes starting from mobile-first. To validate our hypotheses and solution proposals, we decided to conduct a usability test on the prototype.
Current Design
New Wireframes
Validation
Current Design vs. New Design Prototype Test
To validate the new designs, we conducted a usability test on the current design and new design. Also, we compared the current data with the previous ones again.
The first test we did was the guerilla test to get quick insights. We wanted to conduct another comprehensive test to compare new and existing designs in detail and convince high-level management.
User Details
We did research activities with 18 users.
Scope
In this discovery activity, we focused on the stages of awareness, search & find and consideration.
We focused on 19 pain points in the new design and created 26 suggestions as to the result of the test. On the other hand, now I only show significant findings similar to the first test I mentioned above.
AWARENESS
Findings 1# Value Propositions
Let's Remind the Current Experience
Users expect to see Garaj11’s advantages. These information are compressed into a banner and hard to discover.
Test Results 1#
While none of the current users mentioned the advantages of garaj11 in current design test, on the other hand, most of the users noticed the advantages at first glance and talked about it themselves in prototype.
Solutions 1#
What We Did in New Design
To highlight Garaj11’s unique value propositions, that information was made more discoverable by placing them into a more simple banner and at related places on the homepage.
Recommendations:
-
We can implement the carousel structure in the new design to the existing one if the business doesn't want to use a static banner.
-
The value propositions can also be simplified and positioned close to the fold area on the homepage.
SEARCH & FIND
Findings 2# Ways to Discover Cars
Let's Remind the Current Experience
Users did not find the options offered to enter the flow sufficiently. They also wanted to choose a brand/model or vehicle type.
Users rated the vehicles in the "popular vehicles" module as "advertised" "showcases". The fact that the title was not descriptive and was a single module also supported this distrust.
Solutions 2#
What We Did in New Design
As we know from the data, vehicle and brand type as the most popular filters were located on the homepage to start to flow. As we recommended in the first test, we located the vehicle and brand type under the carousel.
Reco modules are increased under different titles.
Test Results 2#
In the prototype, users found the options offered to discover the vehicles sufficiently. They mostly preferred search, vehicle type and brand flows.
​
Users evaluated the existence of different modules under different titles more positively. No user thought the vehicles shown here as advertised.
​
Users tend to make targeted progress while buying vehicles. Even if they have not decided on the brand and model, they will buy because they have specific criteria and budget. They need personalization in the discovery process.
Recommendations:
-
Personalized recommendation modules can be increased under different titles.
-
We should recommend personalized vehicles according to the segment of cars the user is searching for.
​
"If I'm looking for a particular car, I want to see the cars that fit my criteria. I can't get a BMW car, why am I seing it here? I can be depressed."
CONSIDERATION
Findings 3# Action Buttons
Let's Remind the Current Experience
The action buttons on the car detail page do not promote users to take action and they are not motivating in terms of placement and content.
Users want to see the contact information or the car itself before entering the Buy Now(Hemen Al) or Reserve the Car(Opsiyonla) processes.
​
Some users had difficulty noticing the Reserve the Car (Opsiyonla) button.
Solutions 3#
What We Did in New Design
Action buttons were replaced with new content. Make an Appointment (Randevu Al) was tried instead of See the Car (Aracı Gör) which wasn’t understandable for users.
Payment actions which include Reserve the Car (Opsiyonla) and Buy (Satın Al) were located together on the same button. These actions were separated on the next step with short explanations for each.
​
We changed the primary button’s colour from red to green for a more positive perception.
Ask the Car Consultant (Araç Danışmanına Sor) button which was needed by users was placed.
Test Results 3#
Users wanted but couldn’t find any contact information on the current design. They noticed and used the Ask the Car Consultant button easily on the prototype.
Locating Reserve the Car and Buy Now actions together improved the visibility and decreased the frightening feeling of making a payment.
Reserve the Car and Make and Appointment wordings are still not clear enough for users.
​
​
The second screen that opens when users click on Reserve the Car or Buy button was found more informative than the current version but the process still isn’t clear enough.
Users are not sure how the process will continue afterwards:
-
They think they will be able to see the car after reservation. (But, no)
-
They can’t imagine making any payment before seeing the car. (They need to pay first)
-
They want to know every detail about the process before making any payment.
Reserve the car
( Aracı Opsiyonla)
Reserve the car or Buy (Opsiyonla veya Satın Al)
Recommendations:
-
New wording can be tried on action buttons.
-
Action buttons can be supported with short texts to inform and motivate users to click.
-
More information should be provided to users so that they can understand how the process will continue.
-
A contact button should be placed in this screen for users who have questions.
System Usability Score
While the score of the existing design is high, the scoring rate we increased may not seem very much, but we certainly upgraded "good" to "excellent".
Comparison Score
According to the comparison survey at the end-of-test, we observed a rise in user scores in the new design.
Prototype
Conclusion
In this study, I showed a small part of what we recommended as a solution for Garaj11. I wanted to explain how we can improve the existing experience by combining business needs, data and user research analysis. Now, the product and business team are evaluating our suggestions. Also, they have started to include them on roadmaps among the solutions we prioritized.
Validating the design before the release reduced the cost of the development resource and made contributions to the product strategy for the future of the newly developing product. We will continue our research and analysis of the released design and other missing areas in the journey.
Thanks for reading!