Data visualisation and graphs
The main example of this is colour palettes for data visualisations. The need for graphs occurs often, whether that’s in a sales presentations, or management reports. Those working with the brand require a set of colours that they can guarantee work together, whilst remaining distinctive enough that the data is distinguishable.
Recently we have begun the process of extending the colour palette for StudentCrowd, a review site for students. The original palette consisted of six colours, which was somewhat limiting when it came to more complex graphs. The majority of the additional hues were on the blue – green spectrum which meant the colours were too alike when transparencies started to be used. Lets take an example:
The tone of the colours were also too alike. A range in tonal attributes helps people read information at a glance, supports those with visual impairments, and for the rare occasion that it gets printed in black and white – it needs to still be readable!
Another issue we encountered with the StudentCrowd colour palette was around positive and negative colour values. The core colour is a coral, which is dangerously similar to red! Time and time again, the main brand colour (or close to) was utilised for negative messages, as it was the closest sensible colour within the range. It didn’t take long to realise that another shade of red was required! A shade that would remain distinctive as a warning, and remove the negative association with the main brand colour.
Call to actions
Often designers make the mistake of believing the entire palette needs to sit well together. But, on occasion a jarring colour is required. Take for example a big button asking someone to add a product into their basket. You need this to leap out of the page, rather than sit in harmony with the rest of the palette. Obviously, there is a balance and tension with this approach, but a tweak in contrast or vibrancy could make all the difference.
Range within your palette
Occasionally (bad!) designers put together colours in isolation and without context. They will create their colour palettes on a blank screen, without reference to the content of what will need to be designed. The resulting output are palettes that are unusable when applied to design. Colour palettes need range; range in tone and range in vibrancy. They need some colours that look subdued, and some that look vibrant, to make them truly useful. Let’s take an (over-exaggerated) example:
Lets take a look when we convert them to black and white:
And now, when applied (strictly) to a design, this is the result:
How to extend a colour palette
So, we’ve identified that colour palettes don’t work when they are limited to a few colours. But how do you go about designing a colour palette that takes all the above into consideration. Start by reading our blog post on How to develop secondary colour palettes.