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

UX/UI Design
Customer Research
User Personas
User Journies
Creative Direction
Responsive Design
Landing Page Design
Wireframing
Prototyping
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.

CarAdvise User Scenarios

User scenarios for three diverse users, both consumer and business focused helped to further clarify the overall scope and strategy.

Once the avatars and scenarios have been approved I moved the written narrative into wireframed prototypes (below) that showed specific user journeys. The combination of these then became the UX foundation from which to build the v1 user interface from.

CarAdvise wireframes in Sketch

ONBOARDING

A critical step in welcoming new users into the world of your product, keep it clean simple, not overwhelming, and also hinting at what’s to come. The gallery below shows a few of these steps for non-registered users.

DASHBOARD, ACCOUNT AND VEHICLE MANAGEMENT

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

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.

DIAGNOSTICS AND CHECKOUT

CarAdvise wants to provide a high-touch consierge service to vehicle owners, so the diagnosing UX is a combination of machine learning, simple logic, and 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. The card structure made this particularly efficient whereby full modules that worked perfectly well on desktop were built specifically to comfortably fit within the mobile screen widths.

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!