Do you ever stare at a map in a car-sharing app and think, "Umm, why does this whole area look… the same?"
Yeah. That happened.
Turns out, I’m slightly colorblind. I found out relatively recently - roughly a year and a half ago. Never had a problem with colors before in my life that could actually affect something. Never used any colorblind mode in games or apps. But apparently, I struggle to tell apart low-saturation greens and reds - they all look like barely different grey to me. You know, all those colors designers love using to indicate important things like "park here" or "you will get fined here." Soo I got a bit "lost" when I rented a car using a local car-sharing app.
They have a map showing the "allowed" parking zone in a greenish grey, and the "not allowed" area in a regular grey. To me they both looked… well, grey.
The only zone I could clearly tell was the bright red “you can't park here under any circumstances” - thanks, at least, for that...
But everything else - who knows? A grey blob.
I spent 20 minutes driving around trying to figure out where the hell I was allowed to park. Couldn’t tell - grey blob. But for some reason one area of grey blob punishes me for leaving car there and other area of grey blob is fine.
Ended up parking next to another car from the same service - and that's how I accidentally found the "parking allowed" zone.
Later, at home, I increased my OLED screen brightness to max, opened my eyes as wide as I could (to really absorb all those photons), and finally saw it - the "no parking" zone is slightly warmer grey and the "parking" zone is sliiiighlty green-ish. No way to tell apart by just glancing at a phone while driving though.
Dear designers of this app: go to hell. Color is not enough.
If you rely only on subtle color differences to provide critical functionality, you're actively punishing users with colorblindness. And not just them - anyone in sunlight, low brightness, or on a low-quality screen won't see it too.
Some free to use UI ideas:
- Bold outlines with more saturation
- Text labels
- Pattern overlays
Or, if you want too keep those shades of grey for majority of users, imagine this: color blind mode.
It’s not hard. It’s just often… forgotten. Never thought that I would be the one shouting into the void about colorblindness, but now when I actually paid with time and money because of this... I have a valid reason.
Lesson learned, I guess? I’m not dumb. The design was.