Hey there,
Just a topic to collect some info about colors in Sonarr and colorblindness.
First off, I’m moderately deuteranomalous color-blind. Sometimes I realize it’s actually sever, but it could be much worse, at least I’m still trichromat.
This means I can still make out red and green but in fewer shades and it can be rather difficult at times. This applies to purple-blue, red-green, yellow-orange, red-brown and a large variety of shades.
When I put them next to each other I can discern there is a difference, but when seen apart I cannot accurately identify the color, so I rarely try.
FYI, 5% of the male population has this, so over 1350 users of Sonarr.
About 1% of the male population has more severe forms of color-blindness. From complete red-green color-blindness to an even smaller percentage that cannot see any color at all.
While working on Sonarr I kept my eyes on it to make sure the colors chosen didn’t impede color-blind people too much.
For example, the Missing (red) and Downloaded (green) colors on the calendar are still discernible to me, albeit borderline, primarily because the calendar tiles are large enough. On the vertical stripes on the Upcoming list Missing vs Downloaded is not discernible, not without close inspection.
However, that 1% category will not be able to for the main calendar tiles. And might even confuse Unmonitored (gray) with Unaired or Missing.
On Air vs Downloaded is easy even for me, but take away red entirely and those two colors are the same.
That said there are two ways to deal with it:
- Install a browser extension to modify the css style (Stylebot for Chrome for example)
- Add a color-blind option in Sonarr to apply those style changes.
This topic is to collect some screenshots and come up with a decent stylesheet.
Normal:
For me Missing and Downloaded is largely the same, the rest still okay for me
Simulated Deuteranomalous:
This is how I see it, hopefully anyway, lemme know what you see.
Simulated Severe form (just simulated both tritanope and deuteranope, not accurate but you get the idea):
Just to make a point how severe it can be. At this point I give up on colors and look purely at brightness. Without comparison I wouldn’t be able to pick out most of em.
The above simulations are not that accurate, just like it’s impossible to wrap a newspaper around a basketball and still be able to read all of it. But it gives an impression of the limitations of other people.
The chosen primary colors in Sonarr are sufficient to deal with most color-blind users, but the 1% needs extra help. Picking other colors will not help them, coz they won’t be able to tell them apart, or the other 1% won’t be able to. Best is to use patterns.
For example:
With vertical stripe for ‘missing’ (both Missing, and On Air)
With diagonal stripe for ‘unmonitored’.
The same vertical stripe may need to be applied to Unaired as well, since it’s missing too.
In any case, the intention is to add a single checkbox option to the UI section to enable the styles.
@markus101 What do you think.