Foundations

Data principles

Effective data visualisation needs to strike the right balance between four fundamental principles: accuracy, intuitiveness, engagement, and data granularity. Understanding these core principles will help you choose how you want to visually represent the data and decide which data chart gives you the visual language for evaluating a chart’s effectiveness.

---

Types of Data Visualisations

The bar chart

We have two types of bar chart a vertical and horizontal. Both can be used depending which suits the data more. For example when there are longer labels of text the horizontal chart should be used. See example below.

Key points:

• Horizontal charts are best for showing data with longer titles
• Don’t use if the data exceeds more than 8 bars - use a table instead
• Label each bar with what it’s displaying, as well as the value

Vertical

Horizontal

The donut chart

The donut charts are made up individually but can be used as part of a set to show a number of data points. Below is an example of four percentage values in a set. There is space for a brief description under each chart. Text length should be kept to a maximum of two lines or roughly 70 characters.

Key points:

• Don’t use more than four data values as part of a set
• Text in labels should be kept to a minimum of three lines
• These charts are readily available form 1-100% in the Sketch Library

The line chart

The line graph is used to show data-sets with multiple journey paths. Only to be used on a white background as not to confuse the data.

Here we add our shape markers. This is our approach to show data, not just by relying solely on colour, but by introducing shapes were aiding visual impairments such as colour blindness and meeting accessibility standards.

Key points:

• The line chart shows continuous data over time
• Use to show larger granularities of time (yearly, or quarterly)
• Spotting overall trends and shapes of data

The pie chart

Pie chats should show 5 data points as a maximum and each slice expresses a part-to-whole relationship to the data.

Key points:

• Colour should be used to differentiate between the slices
• Best used when trying to workout the share of the data
• Each slice should add up to the sum of the whole

Pie chart (solid)

Pie chart (ring)

The Table

A table is a good way to showcase a large amount of information which has a variety of columns and data to show for each entity. A table should be used instead of, or along side a data chart if the the data becomes to complex.

Key points:

• Showing large amounts of data with many variables
• Showing values across multiple categories and measures
• Consistent vertical & horizontal alignment is essential for fast comparison between values

---

Accessibility

An important part of designing clear visualisations is making data accessible to everyone. To do this we:

Provide alternatives

Users with vision issues might have trouble understanding visual presentations of data, even with assistive software.

Others might simply have trouble understanding data presented in a chart or graph.

To support the needs of different users, always provide multiple formats for data visualisations.

Consider use of colour

Colour is critical for visualisation, but can cause issues for users with colour blindness and low vision. Colour should be used in a way that supports the interpretation of visual information for all users.