Effective Data Visualisation Design
I’m currently part of a project to create a design framework for data visualisation across the organisation. This has been a lot more interesting than it has any right to be, and has led me down the rabbit hole of all things data visualisation. In the process I’ve learned how to produce visualisations that have an impact, and it has reinforced my view that effective communication with data has become an essential design skill. Designing with data can be fun — you just need to embrace your inner data analyst.
Today, data communication is everywhere. Just think of how much data you’re exposed to every day, whether it’s on your smart watch, fitness tracker, news shows, banking app, investment platform or even your gaming system. With so much data, it’s become essential for us as designers to use techniques like visualisation design to communicate data effectively.
What is data visualisation design?
Data visualisation is a set of techniques used to communicate data and information to an audience by use of visual objects. These objects include graphs, charts, infographics and maps. Multiple visualisations communicate a message in the form of a report, dashboard or presentation. The goal of data visualisation is to communicate information clearly, effectively, and accurately.
Some common data visualisation types include column charts, bar graphs, area charts, line graphs, pie charts, waterfall charts, scatter plots, funnel charts and heat maps. As a designer, the first step in the process of visualisation design is to understand your data so that you can choose the most appropriate visualisation to represent it.
Successful businesses today make data-driven decisions. Whether it’s tracking app and website metrics, campaign results, sales performance or product adoption, data is used to inform thinking and strategy. It is the lifeblood of business and visualisation is the common language. As designers our goal should be not just to deliver information, but to understand the context of the business so that we can deliver insights.
UX designer and co-founder of Smashing Magazine, Vitaly Friedman says, “Designers often fail to achieve a balance between design and function, creating gorgeous data visualisations which fail to serve their main purpose — to communicate information.”
The encoding and decoding equation
There are two equally important parts to effective data visualisation design: encoding and decoding. Firstly, the encoding of the data and the message it tells into a visualisation by the designer; and then the decoding of the visualisation and the extraction of the same message by the audience. To be effective designers, we need to understand both parts of the equation.
Part 1 — Encoding the data into a visualisation
Encoding involves choosing the correct visualisation for your purposes and then designing it according to the rules of effectiveness, graphical excellence and integrity.
I’ve found that an effective approach is to ask yourself a number of questions to help understand your data and enable you to choose the best visualisation to represent it:
What’s the story?
What story is your data trying to tell? Here you will consider things like: Why and how was this data collected? Was it collected to find trends? To show distribution or correlation? To compare options, or to uncover relationships within the data?
Who is the audience?
Who is going to be consuming your data communication? What is their level of expertise? What are they hoping to get out of the data? What are they hoping to do with the data, and the insights from the data?
How big is your data?
The size of your dataset will directly influence the type of visualisation that you’ll use. Different types of visualisations work better with smaller or larger datasets. For example, a pie chart would be best for representing a very small dataset where you’re trying to show parts of a whole.
What type of data do you have?
Identifying the type of data that you’re trying to represent is crucial to choosing the appropriate visualisation. The six most common types of data are: quantitative, qualitative, nominal, ordinal, discrete and continuous. Each of these data types have an optimal visualisation associated with them.
What is the relationship between the data?
Ask yourself how the different data points in your dataset relate to each other. Is there a correlation that you need to highlight? Is there a distribution? A ranking?
What is my visualisation goal?
Try to define a single visualisation goal. Goals can include: informing, comparing, showing relationships, showing composition, showing distribution or simply allowing exploration of the data. If you’re not sure what your goal should be, then spend some time looking for groupings, patterns, trends, outliers, and key data points.
Designing the visualisation
When it comes to design, consider the things which make a visualisation effective. An effective visualisation presents complex information clearly, reveals patterns or trends in the data, tells the story of the data clearly, respects the data, uses the right visual representation, and highlights the most important components in the data.
A great checklist to use in evaluating the effectiveness of your data visualisation design is Tufte’s Principles of Graphical Excellence¹ (defined by Edward Tufte, a pioneer in the field of data visualisation). Ensure that your design follows these principles:
- Show the data.
- Induce the viewer to think about the substance of the findings rather that the methodology, the graphical design, or other aspects.
- Avoid distorting what the data has to say.
- Present many numbers efficiently in a small space.
- Make large data sets coherent.
- Encourage the eye to compare different pieces of data.
- Reveal the data at several levels of detail, from a broad overview to the fine structure.
- Serve a clear purpose: description, exploration, tabulation, or decoration.
- Be closely integrated with the statistical and verbal descriptions of the data set.
Part 2 — Decoding the visualisation
This is the part that’s often overlooked, even though it is just as important as the encoding process. Decoding of the visualisation by the end user should result in them extracting exactly the same message as that encoded by the designer.
As William Cleveland says, “No matter how clever the choice of the information, and no matter how technologically impressive the encoding, a visualisation fails if the decoding fails.”²
Getting this right involves knowing your audience, speaking their visual language, understanding the perceptual tasks required of the audience, and following the principles of visual perception.
Visual perceptual tasks
Visual perceptual tasks are how the audience organises and interprets the information that is seen and gives it meaning. Some tasks require more effort than others. Understanding the perceptual tasks used and how much effort is needed for each will enable you to produce a visualisation that is easy for the audience to understand.
Perceptual tasks are ranked based on the accuracy with which people extract quantitative information when decoding each visualisation. The result is a decision-making framework that enables you to choose a visualisation based on the ease with which your audience can decode it. The easier it is to decode, the more likely that the message the audience takes from the visualisation matches the message that was encoded into it by the designer.
The work of William Cleveland and Robert McGill³ produced a ranking of perceptual tasks from easiest to most difficult to decode:
What this tells us is that if we design a visualisation that uses position in a common scale to show data (such as a column chart), it is more likely to be understood and decoded accurately than if we use a visualisation based on showing data using colour saturation (such as a heat map).
Visual perception principles
How the audience interprets the visualisation follows visual perception principles. For example, when the audience looks at a graph, they typically look at elements in a different order and not in a structured, sequential way. The key is to design in such a way that they can be guided around the visualisation.
Apply attention to the correct part of the visualisation by making conscious and deliberate colour choices to draw the attention of the audience to what the designer intended to communicate.
Finally, develop a sound understanding of the principles of gestalt theory to design your visualisations so that they are accurately understood by your audience. These are the principles of similarity, continuation, closure, proximity, figure/ground and symmetry.
I hope this introduction to data visualisation design has given you a starting point to begin exploring these principles in greater depth. As a designer, if you can master both sides of the data visualisation equation, you’ll soon be producing data visualisations, dashboards and reports that are effective, efficient and accurate. And you might just have some fun along the way.
¹ E. R. Tufte, “The Visual Display of Quantitative Information, 2nd Edition”. Graphics Press, Cheshire, Connecticut, 2001.
² W. Cleveland, “The Elements of Graphing Data, 2nd Edition”. Hobart Press, 1994.
³ W. Cleveland and R. McGill, “Graphical perception: Theory, experimentation, and application to the development of graphical methods,” Journal of the American Statistical Association, vol. 79, no. 387, pp. 531–554, 1984.
