CarAdvise

A clean and clear UX designed to instill trust in users who tend not to trust or understand the traditional vehicle maintenance process.
See The Details

CarAdvise’s founders were from a trucking and fleet management background. Well versed in those arenas they wanted to extend their business into more of a B2C space. With a basic responsive application already developed and running I was brought on to build out a more robust consumer experience.

After researching competitive platforms, digesting information and data from interviews with internal stakeholders across the company, and speaking to the customer facing support team I felt I had enough information to propose some solutions.

SKILLS USED
Customer Research
User Personas
User Journies
Wireframing
Prototyping
Creative Direction
UX/UI Design
Responsive Design
Landing Page Design
Sketch & InVision

 

Initial sketching helps flush out concepts and ideas in a quick and iterative process that quickly uncovers holes in the experience and application functionality that then needs to be fully designed.

A typical initial stage in planning an application is to create User Personas and Scenarios that start to tell the story of Who and Why people are using this product. Because we already had some users it made sense to save a little time and model the avatars off the existing users who seemed to fit a larger audience that CarAdvise wanted to capture.

The ‘Application Story Card’ is a condensed version of the projects purpose, a few avatars and their emotional drivers for using the CarAdvise service.

CarAdvise User Scenarios

A high level ‘story card’ incorporates Personas, Emotional Drivers, and an overview of what the project’s purpose is. This is a condensed way of setting the stage for empathizing with the users.

CarAdvise User Scenarios

User scenarios for three diverse users, both consumer and business focused helped to further clarify the overall scope and strategy. These helped clarify the different requirements for individual consumers and small businesses.

Once the avatars and scenarios have been approved I moved the written narrative into wireframe prototypes (below) that showed specific user journeys based on the three user avatars. The combination of these user stories illuminated all the required functionality, content and controls that would be required to provide real value to the users.

CarAdvise wireframes in Sketch

ONBOARDING

A critical, and often overlooked step in welcoming new users into the world of your product, keep it clean and simple, not overwhelming, and also hinting at what’s to come.

Ideally the onboarding process is not an ‘add on’ but inherently enrolls the user into the application’s functionality and context. An exmaple of this is how CarAdvise collects information on the user’s vehicle so that once they get to their personalized dashboard it’s already providing them value with dynamic or manufacturer reccomended suggestions for the vehicle.

The gallery below shows a few of these steps for non-registered users.

DASHBOARD, ACCOUNT AND VEHICLE MANAGEMENT

A clear view of the users vehicles and account settings makes managing a small household of cars just as simple as a small business managing their fleet of 20 vehicles.

A dynamic menu system will automatically accomodate multiple vehicles or change to an alternate layout once there are more than 7 vehicles in the account.

CHOOSING AND SCHEDULING A SERVICE

The most frequently used automotive services follow a simple workflow that builds a Work Order, chooses location, time and date, and then confirms everything on the CarAdvise dashboard.

Since the focus here is on a responsive app it made sense to build certain elements in the cards layout which efficiently translates to mobile screen widths.

DIAGNOSTICS AND CHECKOUT

CarAdvise wants to provide a high-touch consierge service to vehicle owners, so the diagnosing experience is a combination of machine learning and programmable logic, layered with human interaction where needed. We’d also learned that sometimes users would want to pay for repairs from multiple sources, so the checkout process allows for that giving the customer the choice how much to pay and from what payment account.

The application designs were fully responsive with breakpoints optimized for mobile, tablet and desktop viewing. A persistent footer bar kept the support representatives just a tap away at any time, maintaining the personal attention that CarAdvise wants to provide as they build out the technology to fully serve their users.

SALES AND MARKETING

Last but not least I wanted to develop some very simple landing pages where we could test and iterate on copy mostly. A very simple way to amplify conversions is to build some page variants and pit them against one another to find a winner based on which gets the most interaction from users. A few weeks spent building and testing can earn huge gains for ongoing sales and user engagement… never stop iterating on this point!