Project Description

The Cars.com Dealer Center mission is to report on the value generated for dealers by their relationship with Cars.com. Used by both internal sales and operations representatives as well as dealer users, the Dealer Center interface exhibited a number of problems and anti-patterns when I was tasked with redesigning the application in 2011.

Problems

Car dealers and those that consult dealers on inventory quality and advertising effectiveness use a few dimensions to analyze their data. The existing web app did not support easy analysis and good decision making in its users.

Inventory age

Inventory incurs cost as it ages on the lot. Most dealers have aging policies that are enforced with varying degrees of discipline. Dealers typically perform better with greater transparency on the current age of all inventory.

Price quality by age

Prior to the data explosion of the Internet and the generally ill-informed consumer, dealers often set list prices using a “cost-plus” formula. Savvy dealers today understand that they’re dealing with a savvy consumer and that value based on features, not arbitrary costs drive price. By comparing inventory units based on key attributes (Model Year, Make, Model, Milage, features, etc) to all other similar inventory units listed at other dealers in the market, dealers are able to price and move inventory in competitive fashion.

Inventory photo and video quality

Pre-Internet, a dealer would never allow a vehicle to sit on the lot that wasn’t spotless. Yet, at the dawn of listing vehicles online, many were listed with only a few poor quality photos or worse, no photos at all. Survey after survey indicates that the presence and quality of photos are critical to consumers during the online shopping experience. The Dealer Center allows the user to quickly find vehicles with poor visual representation.

Description quality

A price and a picture can only tell so much however and they do little to drive SEO traffic to a specific piece of inventory. The Dealer Center enables the user to find inventory with poor quality descriptions. Future roadmap features were planned to assist the user in writing better descriptions based on known data about the unit.

Solutions

As illustrated the above slideshow, the solution involved incorporating charting capabilities along with a redesigned data table using colors and symbols to make value judgements where appropriate.

Better story telling & Charting

By combining a chart depicting inventory units grouped into a dealer’s aging policy buckets, users are immediately presented with a visual indicator of inventory health at the dealership.

We then went further and stacked additional information on each bar to tell the story about quality along the key dimensions of Price, Photos, Video, and Notes.

Interaction Design and Filtering

The implementation of the aging inventory bar chart presented the opportunity to drill into each section of the chart and, in turn, filter the inventory report below.

While there was no mandate for mobile optimization, we were able to insure that the chart was touch-friendly and worked very well on tablets and minimally on smaller screen phones.

Rich visual report cues

Data grids are often a necessary evil in a SaaS environment. The user really does need all of that data. Thus, our focus with the data grid, in combination with the previously mentioned filters, was to make the grid as scanable as possible. By adding colors and symbols to qualitatively report on inventory health, the user was able to quickly see problem units.

Our initial visual design used a red and green color palette to report qualitatively on health. A fairly obvious (and clich├ęd!) solution. The team quickly determined that this palette produced an undesirable “Christmas tree” look and thus opted for a more subtle visual vocabulary. Testing proved that the desired message was understood by users and behaviors changed accordingly.

Updated Navigation Visual Design

What once took up 160px of vertical space on the page dominated by a logo to large and meaningless graphic design flourish was shrunk to a svelt ~40px thus providing more room to get actual work done.

Additional Features

Everything discussed thus far has been towards improving the user experience when managing the tactically important present, but what about the equally important strategy to the future?

To that end, we wanted to answer the user’s question, “what is the value of performing these activities - take photos, price competitively, write descriptions, etc? The charts at right begin to answer that by rendering two KPIs over the recent past that are important to the dealer:

This was very much an MVP release. We knew through testing that the charts were valuable but design and discovery efforts are still needed to determine what interesting workflows might find their genesis in this data. A potential issue to watch for in future research sessions is whether the rendering of these charts invites the user to compare and correlate where there is no correlation to be made.

Meta

Role:
Lead UX / IxD
Platforms:
Desktop/responsive web
Duration:
01/2011 - 08/2012
Web: