Use a neutral colour where feedback isn't positive or negative

[duncandewhurst]

Following on from OpenDataServices/cove#845 where we changed the colour of UI elements with feedback about errors to red, I now find that the green colour used for other UI elements suggests positive feedback, when in fact they are just informative rather than positive or negative.

I suggest we use green for positive feedback (passing checks, successful conversion etc.), red for negative feedback (validation errors, unsuccessful conversion etc.), yellow for warnings (additional fields, additional open codelist values) and a neutral colour for UI elements which are just informative.

[morchickit]

Just to say that Green-Red-Yellow is a problematic colour palette for people who are colour blind. Try this to find an appropriate palette - https://colorbrewer2.org/#type=sequential&scheme=BuGn&n=3

…

On Wed, 17 Jun 2020 at 00:44, Duncan Dewhurst ***@***.***> wrote: Following on from OpenDataServices/cove#845 <OpenDataServices/cove#845> where we changed the colour of UI elements with feedback about errors to red, I now find that the green colour used for other UI elements suggests positive feedback, when in fact they are just informative rather than positive or negative. I suggest we use green for positive feedback (passing checks, successful conversion etc.), red for negative feedback (validation errors, unsuccessful conversion etc.), yellow for warnings (additional fields, additional open codelist values) and a neutral colour for UI elements which are just informative. — You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub <https://github.com/OpenDataServices/cove/issues/1284>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AAY7HOYQPFNBUHMUQMIZM3LRW77VNANCNFSM4OACNCYA> .

-- Mor Rubinstein Programme and Product manager, 360Giving Tel. +44 (0)20 7812 3773 | +44 (0)7946 894610 Skype: mor.rubinstein Twitter: @morchcikit <https://twitter.com/Morchickit> Sign up for our newsletter <https://us10.campaign-archive.com/home/?u=216b8b926250184f90c7198e8&id=91870dde44> 360Giving is a company <https://beta.companieshouse.gov.uk/company/09668396> and a registered charity <http://beta.charitycommission.gov.uk/charity-details/?regid=1164883&subid=0>. Read our privacy notice <http://www.threesixtygiving.org/privacy/> to find out how we collect and use personal data.

[duncandewhurst]

Good point, thanks @morchickit.

Any of the 3-class qualitative colourblind safe options on there look good to me

[Bjwebb]

Is picking colourblind safe colours helpful if we don't have a key?

[robredpath]

A lot of the colour-blind-safe options from the site that @morchickit provided (thanks for that, Mor!) seem to rely on light vs dark for creating a distinction. I had a quick Google, and https://www.tableau.com/about/blog/2016/4/examining-data-viz-rules-dont-use-red-green-together-53463 was a top result.

There's a couple of points in there that I think are relevant here:

• Colour shouldn't be the only thing that you use to distinguish between states
• Shapes/symbols/text can be used to distinguish between states.

This has all come about because OCP's colour scheme is very green-heavy, and users found it confusing that something could be green, even if it was indicating an error. An alternative could be to make the whole interface much more grey (like the homepage already is), and only use colour alongside symbols. In the 360Giving Data Quality Tool, for example, we use tick/cross/question mark in green/red/orange in some places.