Virtual Auto Expo is an interactive data visualization tool that unlike other automobile buying tools on the market allows automobile buyers and business users to view historical automobile trends and make automobile buying decisions based on the trade-offs between price, emission ratings, MPG and horsepower through 2 separate dashboards focused on automobile brands and models.

Designer and Engineer

I was involved at each stage of the process, however, I took up the responsibility of designing the two dashboards with inputs from my fellow designer Saurabh. I also moderated the usability tests but these were not structured studies. I designed the high fidelity version and engineered the buyer dashboard which I coded in D3.js/HTML/CSS3.

Bhuvan M. Shashidhara, Diana Tan, Prateek Mehra, Saurabh Phadnis, and Yash R. Parikh

4 Weeks (2018)

We looked at existing car buying websites like truecar and cars.com. We found that these websites lacked emissions data and historical data and only allowed for comparison over price and performance through the use of tables. None of these websites used data visualization to make the task of comparing cars easier. They also lacked comparisons between brands and models over time.

We also focused on the EPA website, SmartWay, that allows users to find vehicles based on type and emission ratings. However, the EPA mainly focused on vehicles that meet the SmartWay guidelines which are 20% of the lowest emitting vehicles per year. This meant that vehicles that did not meet the SmartWay guidelines were excluded from the website and the user would not be able to compare vehicles on other parameters. These loopholes in existing systems helped us streamline requirements from our own visualization.

We sought to create a visualization that allowed users to see all vehicles and compare performance over time on a wider range of factors regardless of availability and compare them on multiple factors.

In our initial design, we started with brainstorming many different ideas on how we wanted to approach different types of users including basic car buyers, business users, and environmental users.

We heavily relied on the taxonomy of interactive dynamics for visual analysis by Jeffrey Heer and Ben Shneiderman to narrow down the types of visualizations which could be appropriate for the overview, the types of possible filter and zoom details which would help in exploring the data for each type of user.

We did a quick exercise of the Five Design Sheets Method for our initial brainstorming layouts, diverging while sketching ideas and arrived at several dashboards.

We tested our paper prototype with 6 users including 2 females, 4 males who were graduate students at UW. We briefed each user about our data visualization and asked them to evaluate the paper prototype for ease of use, the ability to understand the data presented and the overall look and feel.

While some users felt that the fidelity of the prototype made the lines confusing, our key takeaway from the study was that the visualization was confusing and overwhelming. Some users also found the different colored axis of each parameter and the angle of the axis confusing. Understanding the scrubbers and the curved lines on the hive plot were also challenging to some users.

• Hive plots have a learning curve
• The amount of information displayed upfront was overwhelming
• Users preferred simplicity - Filters outside main visualization

Some users stated that the initial use of the model dashboard was slightly confusing because the spider-chart doesn’t populate data immediately. Based on this feedback, we included a brief description regarding the task to filter vehicles to compare models on the spider-chart. Selecting more than 20 cars starts to obscure the substance of the visualization. When the visualization becomes unreadable with too many vehicles, it also distorts the data.

The price coordinate in the parallel-coordinates chart-filter was highly skewed because of a few high priced cars (like Lamborghini), but most of the cars were crowded in the lower price range. This made it difficult for the users to filter the cars in the lower price range. The linear axis caused this problem; a logarithmic scale on the axis would have helped to show the cars in the lower price more clearly based on the input of a few users.