Bringing Data to Life 7: Dashboards

Bringing Data to Life 7: Dashboards

“Graphical excellence is the well-designed presentation of interesting data – a matter of substance, of statistics, and of design.”
Edward R. Tufte, American author

If you’ve made it this far, you should have a robust skillset that will let you communicate effectively with data. You learned about lazy brains, cognitive load, and the importance of presenting simple and well-organized information so your audience can reach conclusions and make decisions quickly and easily. You learned to keep your writing concise, lively and focussed on your audience. You learned how human vision works—how we see—and how you can exploit that knowledge to visualize data clearly and accurately.

Along the way, I’ve shown some examples, both good and bad, but most of these were in isolation. The remainder of this series will show you how to assemble the pieces you’ve seen into comprehensive data presentations, beginning with data dashboards.

What Is a Dashboard?

Let me begin by defining what I mean by dashboards. Author Stephen Few has written extensively about data dashboard design; we’ll see his name throughout this article. He provides this useful definition:

“A dashboard is a visual display of the most important information needed to achieve one or more objectives, consolidated and arranged on a single screen so the information can be monitored at a glance.”

That’s a lot of words, so let’s break it down. Dashboards are highly visual because, as we’ve learned, pictures outperform text for understanding, learning and remembering information. Dashboards highlight the key pieces of information needed to know when an action or decision is required in a single view. Ideally, they also provide a gateway to additional information required to determine the precise action needed, perhaps through links or drilldowns. They present it all on a single screen so that everything can be taken in at a glance. The single screen shouldn’t be comprehensive. Remember our rule of simplicity and only show what’s necessary for the task at hand.

Dashboards are exploratory, not explanatory. They allow your audience to make their own interpretations of the data.

Dashboard Pros and Cons

Dashboards aren’t the only way to present data, and sometimes they’re not the best way. Here are some pros and cons of data dashboards, especially when compared to PowerPoint presentations or written stories:

No alt text provided for this image

A Dashboard Is a Design Project

Any dashboard is a design project. It must follow the visual design principles we learned in the last three articles to format and arrange information into meaningful groups and highlight what’s important. Doing this well isn’t easy. Designing individual visualizations for use in a slide deck is simple compared to entire dashboards. It’s hard to get all that information onto one screen without it looking like a cluttered mess. But in fact, the best practices are easy to learn. All data dashboards must support this visual process:

  1. See the big picture
  2. Focus on specific items that need attention
  3. Quickly drill into additional information if needed to take action

The first and second parts of this process require the visual design skills we recently learned. Here are some more useful design skills, with examples, from a whitepaper by Tableau called Design’s Hidden Influence.

Framing and Leading to Conclusions

How we frame a question determines how people respond to it and how they make decisions. Framing serves to focus and prime your audience’s attention.

Many of us have received our degrees in Epidemiology from Google University over the past two years, so here’s a timely example from psychologists Amos Tversky and Danial Kahneman. Imagine a scenario in which a fatal disease affects 600 people. There are two possible treatments, simply called Treatment A and Treatment B.

  • With Treatment A, 200 people will live, and 400 people will die.
  • Treatment B has a 33% chance of saving everyone and a 66% chance of saving no one.

Which treatment should we choose? Before you answer, look closely at the next two data visualizations.

Presentation 1:

No alt text provided for this image

Presentation 2:

No alt text provided for this image

Both present exactly the same data, using the same layout and formatting. When viewers in the original experiment saw the first version, seven out of ten chose Treatment A. But when presented with the second version, only two out of ten chose Treatment A.

So, framing will lead your audience toward a conclusion. If this isn’t the conclusion you want them to reach, consider reframing your presentation.

Uniform Connectedness

Stephen Palmer, a psychologist at the University of California at Berkeley, came up with his theory of uniform connectedness which expands upon the now-familiar Gestalt principles of perception. You can apply this principle to assign visually similar objects into distinct groups.

In this example, a grid of simple shapes, the similar nature of the shapes creates connectedness. We can easily see them as six vertical columns:

The principle of uniform connectedness

If we exploit the principle of enclosure by putting backgrounds behind the shapes, we transform the six columns into three regions of connectedness:

The principle of uniform connectedness

This example, also taken from Design’s Hidden Influence, exploits the theory of uniform connectedness:

A dashboard exploiting uniform connectedness

The dashboard uses thin horizontal rules to separate its summary and detail sections. Each column has its own visual style reflected in the choice of visualizations and encodings. We see distinct columns containing text, bars, sparklines and dot-plots. The columns are clearly linked by their proximity on the vertical axis and their similarity of encoding and formatting. Without these graphic devices, understanding and using this dashboard would require considerable cognitive effort.

What Makes a Great Dashboard?

Great dashboards have clear messages and metrics. They use colour to enhance meaning without distracting from it, and they only show the most relevant information. More than anything, they need thoughtful planning, informed design and a critical eye to refinement.

Thoughtful Planning

Stephen Covey told us that we should begin with the end in mind. With data dashboards, we should begin with the end user in mind. Ask yourself, who am I designing this for? A data analyst with days in which to prepare a report? A team meeting to review quarterly results over a few hours? A busy salesperson with only seconds to spare, who needs KPIs right away? Once you have an audience in mind, consider their level of expertise. Will they understand the statistics you are presenting and the jargon used in your captions and labels?

When you lay out your content, consider the display size of your dashboard’s commonest uses and how this will affect the legibility of your visualizations and text. Use size and placement to bring the most important KPIs and metrics to the forefront. It’s difficult to drill down on small screens, so the most useful information should be available immediately.

When you design for phone screens, stack your content vertically and optimize your layout for vertical scrolling. And plan for fast load times even over low-bandwidth connections. Pre-calculate row-level data if you can. Use filters or data extracts to return only the data that are needed.

Informed Design

Always consider how your audience will read your dashboard. It should have a sensible flow and a logical layout. Use your design to highlight logical groups, exploiting proximity, similarity and enclosure. Put the most important information at the top left, the least important at the bottom right. This reflects how most people in our culture scan pages and screens.

Limit the number of views and colours in your dashboard. More than three visualizations on a single screen is usually too many. And too many visualizations or too many encodings slow comprehension. Avoid unnecessary objects, decorations and other design elements that get in the way of quickly informing your audience. Visual overload is cognitive overload.

Data dashboards are meant for exploration, so add interactivity to encourage it. In Tableau, you can use "highlight actions,” where making a selection in one visualization highlights related data in the others on the screen.

When you apply your visual language (i.e., your set of colours, shapes, text styles, and so on), format from the largest design elements to the smallest. This way, as you get to more specific elements, they will already have inherited their default styling from the levels above. This lends consistency to your design and also saves you time.

Refinement

Once you have your design and layout, you can refine and enhance it over two or three iterations.

Eliminate clutter ruthlessly. Screen space is a very limited resource, as is your audience’s attention. Use tooltips to keep information out of the way but close at hand. Every visible element must have a clear and defined purpose relevant to presenting your data and asking questions of it. Flash and bling might sell, but do they work? Once the novelty wears off, your audience will stop using your dashboard if it doesn’t give them the information they need.

Finally, test your finished dashboard for usability. Be prepared to iterate and rebuild. This is the build-measure-learn loop again. It’s a proven path to successful design.

Tips For Using Text

Text on dashboards is usually limited to titles, labels, and navigation aids. Above all, the text should be readable. Make the most important information stand out.

Keep titles and captions short. Convey the point, message or story in as few words as possible. Remember the principles of plain language. Try to avoid jargon and acronyms, especially if you’re designing for a broad audience.

Too many labels can be distracting, so try to find the “sweet spot” for your audience. Try labelling only the most recent observations or only the minimum and maximum values. Consider your audience’s need for precision, and don’t provide too much.

You can also use labels to give users explicit directions about how to navigate. Navigation controls labelled with verbs are often more usable than those labelled with nouns.

Tips For Using Cartographic Maps

In the Pictures article, I said that cartographic maps aren’t effective data visualizations. They share perceptual properties that make them less accurate than other visualizations. I’d like to amend that now by saying that while maps alone aren’t the best choice, they are a useful companion to other visualizations on a dashboard.

Mapping lets you see patterns and implications in your data that aren't readily apparent in tables and charts. Maps immediately orient your audience to the data and provide valuable context for planning and executing business decisions.

You can layer maps with other visualizations to display additional data dimensions. For example, use tiny pie charts or bar charts, showing no more than three or four discrete values, as location markers. This example is from Tableau. It also encodes a data dimension in the diameter of the pies.

A cartographic map with pie charts

You can show different summarizations of data at different zoom levels. This kind of interactivity is a common way of drilling up and down a geographic data dimension.

Common Pitfalls of Dashboard Design

“Despite their tremendous popularity and potential, many and perhaps most dashboard implementations fail miserably…This is a failure more of design than technology. Fundamentally, it is a failure of visual design.”?
Stephen Few, American author

Beyond giving general advice—how to choose the right visualizations for your data, how to lay out the screen, etc.—it’s difficult to give you a definitive guide to dashboard design. There are too many possible applications, and you, the designers, are most qualified to understand your audiences and their needs.

In fact, it might be easier to tell you what not to do. Stephen Few categorized and described the thirteen pitfalls in this article over numerous books and whitepapers. I’ve also relied on Tableau’s collection of whitepapers to compile this list.

1. Exceeding the boundaries of a single screen

A single screen is convenient and saves time for your audience. It paints a complete picture that can show important patterns and connections. Viewers lose something when they have to scroll vertically or horizontally. We can only hold a few chunks of information in our short-term memory. Data become fragmented, and we can’t make comparisons. Splitting your information into smaller pictures is a mistake when your audience needs the big picture.

2. Supplying inadequate context for the data

Measures of what’s going on in the business rarely do well solo. On their own, they can’t answer questions like:

  • Compared to what?
  • Is it good or bad? How good or bad?
  • Are we on track?
  • Is this better than before?

Quantitative measures need to be backed up with numbers, that is, axis labels, not just tick marks.

3. Displaying excessive detail or precision

Your dashboards should never display more details or precise information than necessary. Excess precision impedes rapid visual queries because it forces your audience to process irrelevant data. That adds unnecessary cognitive load and slows them down without benefit. Especially for comparative or directional visualizations, three or four significant digits are usually enough. Consider rounding percentages to whole numbers, money to dollars, thousands of dollars or even millions of dollars depending on the range of values.

4. Expressing measures indirectly

To be a good dashboard designer is to understand your audience's needs and how they plan to use your information. You must know what they want to be measured and its units of measure. For example, if your audience needs to know the variance from budgeted expenses, show the differences in a single column rather than two columns containing the actual and budgeted values. Don’t make them do the arithmetic themselves. And for comparisons like this, a percentage is often better than the absolute difference. It makes it easier to compare relative variances.

5. Choosing inappropriate visualizations

Choosing the wrong visualization is a common error. This might be using a chart instead of a table or vice versa, or using the wrong kind of chart for the data’s level of measurement or discreteness.

If your audience needs to read the labels on a pie chart to understand it, you’d be better off using a table. The pie slices can’t be interpreted, so what good are they?

6. Introducing meaningless variety

Some designers are afraid to repeatedly use the same type of visualization on a dashboard even when it’s the most appropriate. This is a misguided quest for novelty and variety. Always use the best visualization for the purpose and the data. Your audience won’t get bored if the data matter to them, but they will get aggravated if they have to work harder. Remember the principles of emotional design to give them a pleasant and successful experience.

Consistency of presentation also lets them re-use the same visual strategies, thus reducing effort and cognitive load.

7. Using poorly designed layouts

The components of your display should communicate clearly and effectively without distraction. Don’t make it difficult by fragmenting your design with too much white space or stylings, or complicating it with excessive use of enclosures.

8. Encoding quantitative data inaccurately

In any data visualization, values are encoded as visual objects. Those visual objects should accurately encode values to facilitate comparisons and understanding relationships. This also applies to your choice of zero points and scales for your axes. Starting an axis at a value well above its true zero point is a classic way to exaggerate small differences in the data.

9. Arranging the data poorly

Your goal as a designer isn’t just to make the dashboard look good. You need to arrange the data to suit their use. Make the most important the most visually prominent. Data that require immediate attention should stand out. Arrange data that should be compared in ways that encourage comparison.

Keep these arrangement strategies in mind:

  • Put the most important information in the top left
  • Put the least important information in the bottom right
  • Put closely related information close together
  • Put information to be compared close together
  • Put labels closer to what they label than to anything else

10. Ineffectively highlighting what’s important

Your audience should look at your dashboard and be immediately drawn to what’s important. If everything is prominent, nothing stands out.

Use size to give visual importance that signifies real-world importance. Give less important information less space. You can also increase salience or noticeability through colour and other pre-attentive features. Differences in salience should match differences in importance.

You should lay out Information that is to be used sequentially in sequence.

Not all designs let you rely on proximity by placing related items next to each other. In these cases, make it easy for your audience to relate them visually using similarity and enclosure.

Don’t suggest relationships, whether through visual similarity or proximity, if they don’t exist.

11. Cluttering the screen with useless decoration

Dashboards often get dressed up in silly ways. That’s not my description, by the way. It comes from Stephen Few. In the past, they were often made to look like something they’re not: automobile dashboards, machinery and gauges, skeuomorphism. Thankfully, we’re getting away from that. Dashboards aren’t meant to show off their designer’s artistry. Their purpose is to inform, not to entertain.

Decoration adds useless cognitive load. Your audience must process all that visual information to extract its meaning. Anything that doesn’t directly serve your dashboard’s objective is a waste of space. Here are some common examples of wasted space:

  • A logo in the most prominent position
  • Decoration in the form of photos, art, or background images
  • Instructions or descriptions that are only used on first viewing and not after that. Put them in a separate Help section and link to it

When people need information, your design works best when it tells them what they need to know, no more and no less.

12. Misusing or overusing colour

Make your colour choices thoughtfully based on how people perceive colours and the differences among them. Recall that the blue-sensing cones in our eyes are much less sensitive to light than the green and red-sensing cones. So, hot colours demand our attention while cool colours don’t. Our colour channels are attuned to differences, not absolutes. So, colours that contrast with the norm stand out. We process them pre-attentively. And we try to assign meaning to them.

Avoid too many colours, especially bright ones. Dashboards are usually densely packed. Too much colour distracts and loses its ability to highlight.

13. Designing an unappealing visual display

Attractive things work better. If your dashboard is unattractive, your audience isn’t put into a state conducive to its effective use. So, remember and apply these tips:

  • Display the data as simply as possible, without adding anything
  • Use a common grid layout to create consistency in layout from screen to screen
  • But don’t be too rigid. Determine your layout by the arrangement and sizing that communicates its information best
  • Use thoughtful asymmetry in placement and size to convey differences in importance

Dashboards In Review

Dashboards are visual presentations designed to let your audience explore the data for themselves. They present a lot of information in a small space, ideally the space of a single screen, to enable a holistic view in a single glance. They are interactive, so your audience can find the stories within the data presented.

Dashboards bring together everything we’ve covered so far. They are made up of the data visualizations we saw in the Pictures article, held together by the principles of graphic design we learned in the Design article. The individual visualizations and the design as a whole must exploit the principles of visual perception to be easily understood while minimizing cognitive load. The words you choose for captions and explanatory text should be concise and relevant, respecting the principles of Plain Language.

You can design great dashboards if you follow the guidelines presented in this series. Your audience will find them enjoyable to use as well as informative. But there are pitfalls to be avoided. Many of these can be framed as violations of our principle of simplicity and its cousin, consistency. Others are matters of choosing the correct visualizations and the appropriate visual encodings.

Approach your dashboards with an eye to informed design, keeping your audience and their cognitive load in mind. Be prepared to get feedback, learn from it and apply it to the next, better version. That’s your recipe for success.

要查看或添加评论,请登录

Gary Wood的更多文章

  • Bringing Data to Life 11: Bibliography

    Bringing Data to Life 11: Bibliography

    Selected Bibliography Here are some of the sources I consulted while preparing this series of articles. Books About…

  • Bringing Data to Life 10: Conclusion

    Bringing Data to Life 10: Conclusion

    "The art of making art is putting it together" Stephen Sondheim, American composer In this final article, I'll share…

  • Bringing Data to Life 9: Data Stories

    Bringing Data to Life 9: Data Stories

    “A special effect without a story is a pretty boring thing.“ George Lucas, American filmmaker The Tale of Dr.

  • Bringing Data to Life 8: Attention

    Bringing Data to Life 8: Attention

    “The best way to capture moments is to pay attention. This is how we cultivate mindfulness.

  • Bringing Data to Life 6: Design

    Bringing Data to Life 6: Design

    “Design is the method of putting form and content together. Design, just as art, has multiple definitions; there is no…

  • Bringing Data to Life 5: Pictures

    Bringing Data to Life 5: Pictures

    “Diagrams are of great utility for illustrating certain quantities of vital statistics by conveying ideas on the…

  • Bringing Data to Life 4: Vision

    Bringing Data to Life 4: Vision

    "Mine eyes are made the fools o’ the other senses, or else worth all the rest." Macbeth, Act II, Scene I by William…

    1 条评论
  • Bringing Data to Life 3: Words

    Bringing Data to Life 3: Words

    "Writing is very difficult, especially in the short form." E.

  • Bringing Data to Life 2: Laziness

    Bringing Data to Life 2: Laziness

    "Laziness is nothing more than the habit of resting before you get tired." Jules Renard, French author Most of us have…

  • Bringing Data to Life 1: Introduction

    Bringing Data to Life 1: Introduction

    "It is easy to lie with statistics. It is hard to tell the truth without them.

社区洞察

其他会员也浏览了