Close More (Vert) Close

This week, we read Lillian Pierson’s Data Science for Dummies. Pierson is a data science consultant and engineer, and she has assembled a trove of useful information, tips, and tutorials.

The dashboard design chapter inspired us to make an eCommerce dashboard using ZingChart. Read on to see how our newest demo adheres to Pierson’s best practices for dashboard design.

Dashboard Design Tips

Pierson keeps dashboard design simple with four main points to keep in mind:

1. Have a plan.

Are you of the opinion that a dashboard is just a collection of charts?

Do you think all of this fuss about “dashboard design” might be overdoing it?

If so, you may be one of the fortunate few who have yet to encounter a poorly designed dashboard. A few visual examples of dashboards lacking design forethought may change your mind:

Screen Shot 2015-07-15 at 9.52.02 AM

Pierson addresses dashboard design shortcomings with tact. It’s not about bad taste...

"Bad design is usually the direct result of poorly scoped purpose."

-Lillian Pierson

Placing charts and stats on a page with little to no planning or consideration for the end user is probably not intentional. However, it is comparable to throwing ingredients in the oven with no specific recipe in mind: you might come out with something edible, but you probably won’t like it very much.

A dashboard, like a recipe, should have an end goal defined at the start. It should have specific purpose for a specific audience.

2. Know your audience and their needs.

Based on the answer to tip #1, now we know our dashboards should be designed with purpose. How do we narrow that down into something usable that can inform our dashboard design? Pierson assists with two key questions to flesh out more concrete ideas:

Who is our audience?

image03
Meet Emma. Emma runs a small eCommerce site where she sells cat toys and various cat-related items. She needs a dashboard that will help her get the pulse on her business by looking at key performance indicators (KPIs). This will help her make decisions and direct her team.

What does the audience need to know?

By keeping the audience and purpose in mind, we can choose stats that will be relevant. In Pierson’s words, this dashboard should be an “at-a-glance” resource. Any actions the user should take after viewing the dash should be clear without much close inspection.

By applying this to Emma, we can come to the conclusion that she needs to see high level KPIs from each department.

“If the insights aren’t actionable [...] your target audience won’t adopt the dashboard as a decision support instrument.”

-Lillian Pierson

Here are some ideas for taking your results and making them “actionable” across a few different departments:

Marketing

  • Website Traffic

  • Top Traffic Sources

Sales

  • Sales by State

  • Conversion and Cart Abandonment Rates

  • Top Sellers

Accounting

  • Revenue vs. Expenses

  • Product Margins

3. Choose the right charts.

Once the audience and their needs have been established, it’s time to select chart types. FindAccountingSoftware succinctly outlined what we should be looking for in their recent article, 7 Alternatives to the Bar Graph and When to Use Them in BI Reporting:

“In order for data visualizations to be effective, they need to engage the viewer, clearly and quickly communicate data, and elicit appropriate responses from the target audience.”

With this in mind, let’s review a few of our selected stats and the chart types we’ve chosen for them.

Plain Jane Table

Screen Shot 2015-07-15 at 11.47.29 AM

The top 5 traffic sources very well could have been put in a chart, but before we get chart happy, let’s take a step back and recall some valuable insight from Stephen Few:

“Graphs are useful when a picture of the data makes meaningful relationships visible (patterns, trends, and exceptions) that could not be easily discerned from a table of the same data.”

Save the Pies for Dessert

Since this data is very straightforward and is more easily read than charted, we chose a table to visualize the list.

Bullet Graphs

Screen Shot 2015-07-16 at 10.49.54 AM

Pierson makes an excellent point when she reminds us that people in Western cultures read horizontally. Arranging our data (and our dashboard) so that it flows from left to right will feel natural to users from these backgrounds.

She also points out two useful chart types that fit with this reading style - sparklines and bullet graphs.

We chose bullet graphs to visualize conversion and cart abandonment rates. Bullet graphs make it easy for a user to quickly identify if a particular stat is a positive or negative outlier, eg., in the “danger zone”.

Drilldown Pie

Screen Shot 2015-07-15 at 11.48.47 AM
We chose a ring style pie chart to show which products were top sellers. More importantly, however, this chart allows the user to drill down and learn more about other successful products.

Per Pierson, a good dashboard must be self-explanatory and intuitive, and getting more information should be a near-effortless experience for the user.

Fortunately, implementing drilldown charts using ZingChart is quite simple. Check out our drill down docs to learn about the different ways you can implement this useful feature.

4. Keep the big picture in mind.

We’ve chosen and built our charts, adhering to Pierson’s advice to use icons, labels, and tooltips where appropriate. We’re ready to put everything together in a dashboard using the useful tips she provides on layout and styling:

  • By leaving out everything but the most important information, we’re able to keep the dashboard on a single page.

  • We’re ensuring that our users won’t have trouble focusing on important information by leaving white space in the design.

  • We’ve given the layout a natural flow, presenting data in rows rather than in vertical stacks.

Follow the linked image to view the completed dashboard. Feel free to copy these charts for use in your own projects!

Screen Shot 2015-07-16 at 10.33.14 AM

Design a dash of your own!

We’ve successfully built a dashboard that adheres to some of the tips in Lillian Pierson’s data science book. What dashboards have you made with ZingChart? We’re always interested in seeing what creative projects our users have come up with, so don’t be a stranger: tell us about it in the comment box below.

More Dashboard Resources:

comments powered by Disqus