Dashboard Design Best Practice (Part 2) - Effective use of colour
Read Part 1: Why consistent dashboard design is important
Written by Ming Huang, Front-end Developer at Panintelligence
This article will explain how following some simple guidelines for choosing colours, you can make your dashboard much less confusing, and exceptions in the data can be made more obvious.
You may also like: The importance of behaviour driven development(video)
Use colours to draw people’s attention
Specific colours are used universally to communicate particular messages. Without any further explanation, when you look at the following image you already know what the yellow and then red strips mean on the wire. This traffic light warning system can be used on dashboards to draw people’s attention, and certain colours are regularly used to indicate certain meanings. In a dashboard, we can apply principles such the ones below, so that people don’t need additional explanation when they try to decode what the chart is telling them.
- Use bright colours such as red, orange and green to draw people’s attention, and make sure these colours deliver the same meaning used elsewhere in real life, such as traffic lights.
- Always use the same colour to represent the same meaning. If you use red for danger in one chart, avoid using red for a different meaning on other charts.
- Avoid using different colours to represent the same meaning. If orange is used for a warning, also don’t use yellow for a warning.
Use colours only when it improves understanding
If you look at the two charts below, which one gives you a better idea about what’s going on? Although both charts emphasise that Newcastle has the lowest temperature, the colours on the left chart actually don’t offer additional meaning. By using different colours for all of the bars, it makes the exception less obvious.
Read Part 3: Enhancing your dashboard
Use colours consistently
When looking at the two charts below, you may easily notice that anything below zero is in red. If you then saw a chart like the one below in the same dashboard, you might start wondering what orange means because the value is quite similar to the red ones. It’s important to consistently use the same colour to represent the same meaning in the whole dashboard. If orange represent a warning, and red indicates danger, then this needs to be made clear to the users and remain the same throughout the dashboard and all charts.
Choose colours for less important information
When you look at the chart on the left, can you easily tell which bars are more important? How about the chart on the right? And how about this one? In these 3 charts, we consistently use bright colours to represent exceptions. When muted colours are used for regular information, the important data stands out by using bright colours.
With careful planning, the effective use of colour in your BI dashboard willlead to improvements in understanding. My recommendations are:-
- Use colours only when it improves understanding of a chart
- Use colours consistently to convey the same meaning across all charts
- Use bright colours to represent exceptions in the data
- Use muted colours to represent less important information