CND Project — David Gilbert

Introduction

Car sharing is becoming increasingly popular as people look for alternatives to traditional car ownership. Car Next Door was created to solve this issue and be a market leader in a new and emerging market.

Project Overview

In 2019 I began working as a Product Designer for Car Next Door with the purpose of improving their existing digital products. I led the design for what was called the Borrower Experience team. As the sole designer in the squad, I was responsible for the end-to-end design of new features and product updates. I worked closely and collaboratively with engineering, product, and marketing teams to ship features that were aligned with the business strategy and product vision. Together, we created an intuitive and user-friendly experience across both web and app platforms.

Unfortunately, I was unable to attain any photographs from the user research phase. So, please accept this (probably overused) stock image for now.

User Research

The first step in the design process to improve the Borrower Experience was to audit the current state of the product and get a better understanding of the needs and expectations of the target audience - Borrowers. We looked at existing user data, performed competitive analysis, and conducted user interviews and surveys to gather information about the Borrowers’ needs, pain points, and wants.

We found that Borrowers were looking for a car-sharing app that was easy to use, provided clear pricing information, and had a simple and straightforward booking process. In addition, they also wanted to be able to see the availability of cars in real-time (for those last-minute emergencies), and they wanted to be able to cancel or modify their bookings easily in case their plans changed.

Furthermore, by looking at the existing data on user behaviour and performing an audit of the existing UI and user flows, we were able to identify a number of opportunities for improvement. For example, we found that the average time to complete the borrower verification form was over 3 minutes. Furthermore, we found that over 40% of users were not making it to the last step.

Lastly, by talking to our customer support team and looking at the most common topics, we discovered that borrowers wanted more transparency around verification times.

User Personas

Based on the research, we created a number of user personas to gain a deeper understanding of the needs of our users and build an empathetic relationship towards them.

An example of a persona we created is 'Ava.' Ava is a 28-year-old working professional who lives in the city and does not own a car. She uses public transportation but sometimes needs a car to run errands or attend social events. She is tech-savvy and prefers to use mobile apps to make her life easier.

Another persona example is ‘Simon’. Simon already owns a car and drives frequently, but prefers to drive a small car as he finds it easier for parking and doesn’t have a regular need for a larger vehicle. Simon occasionally needs access to a van or ute when moving or running errands that require more space.

Ideation

By taking the learnings from the user research and synthesising the data, we were able to come up with a number of jobs-to-be-done, considerations, and improvements. From here, we started to ideate in the form of brainstorming sessions, revised user flows and eventually wireframes. By focusing on the core experience and user journey without getting caught up in the trivial visual design details, we were able to ensure we were meeting the needs of the borrower and addressing the issues discovered during the user research phase. Furthermore, we were able to get stakeholder buy-in so the whole team was aligned on what needed to be done and why.

The wireframes demonstrated a much more intuitive and simple experience for the user. For example, the verification flow removed a number of unnecessary fields and provided clear feedback to the user about the status of their verification - one of the most common help desk requests. Furthermore, we turned these wireframes into simple, yet interactive, prototypes to get a feel for the interaction and ensure an intuitive experience from start to end.

Visual design

Once we were happy with the state of the wireframes and user flows, and all feedback had been discussed and actioned, we set upon the visual design. We created a simple, clean and modern UI using the existing colour scheme and typeface. We then tightened up some of the spacing to align with an 8px grid system and created a scalable typography system to create a sense of vertical rhythm.

We added a number of visual elements to increase recognition and reduce the amount of reading and cognitive load. For example, we created icons to accompany badges, added ticks to indicate a step had been completed, and used icons to compliment filters. We also audited the existing states of interactive elements and ensured all default, hover, and selected states were visually consistent.

From the existing data, we knew borrowers used different devices and platforms depending on their context and environment. Therefore, we needed to create a consistent experience that was device-agnostic and would allow the user to jump between different platforms without having to learn new mental models. To achieve this, we took a consistent approach to components, page layout, task flow, and copy that would allow the user to pick up where they left off regardless of what device they were on.

Usability testing

To validate our designs and (research-backed) solutions, we created an interactive prototype that we could then test with existing borrowers. Based on the feedback, we made a number of tweaks to the designs and user flow. For example, we found the most commonly used filters were hidden below the fold in the filters overlay (which was also supported by the analytics data). In response, we moved the most popular options to the top of the overlay and pulled out the most common filters and placed them into their own dropdown, making them visible and accessible without needing to sort through a long list of filters. In another example, participants conveyed that they struggled to find the option to change to map view. As a result, we increased the contrast of the Map button, added an icon and turned it into a floating button so that it was always in sight and accessible. Beyond this, we continued to monitor the experience against different UX metrics to ensure a delightful experience.

Conclusion

In conclusion, enhancing Car Next Door’s borrower experience across web and app required a deep understanding of the user's needs and preferences. We used user research, user personas, user flows, and usability testing to create a user-friendly, intuitive, and visually appealing experience for our borrowers. We learnt what was important to the user by simply talking to them, testing prototypes, and looking at what the existing analytics data was telling us.

We were able to increase the verification completion rate by over 250% and reduce the average time on task to just under 2 minutes. It needs to be said, that this was a collective effort and these improvements wouldn’t have been possible without the collective and talented work of the engineers, PMs and other stakeholders that worked collaboratively to reach this goal.