Designing for colourblindness?

Designing for colourblindness?

Postby c_xong » 01 Jul 2016, 04:26

A lot of games, especially older ones, use lots of colours as part of their gameplay. Older games have things like palette swapping, or colour-coded stuff (like keys).

Just recently it occurred to me that doing so is bad for colourblind users. Check out these doom keys as seen by red-green blindness:

Doomkeys_deuteranopia.jpg
Doomkeys_deuteranopia.jpg (6.19 KiB) Viewed 7908 times


Those keys are supposed to be blue, red and yellow. There's a bit of brightness variation between red and yellow but it's very subtle, especially for the smallest icons at the bottom. If you're still not convinced, here's a pop quiz: what's the colour of these doors, red or yellow?

doomdoor_deuteranopia.jpg


So have you encountered a situation where something is unclear for colourblind users, and how did you get around it? Is there an open source game that could do with better accessibility for colourblind users?
User avatar
c_xong
 
Posts: 234
Joined: 06 Sep 2013, 04:33

Re: Designing for colourblindness?

Postby L » 01 Jul 2016, 05:26

Not the dev, but frozen bubble's colorblind mode adds shapes inside the bubbles like crescent moons to help tell them apart.
L
 
Posts: 22
Joined: 02 Aug 2011, 18:02

Re: Designing for colourblindness?

Postby c_xong » 01 Jul 2016, 08:10

That reminds me, a year ago I helped out on FreeBlocks, a tetris attack / bejewelled clone, and it initially had the same problem - the blocks were identical except for colour. I managed to convince the author to add a shape inlay. See before/after pics:

hqdefault.jpg


XDBQy0o.png
XDBQy0o.png (37.21 KiB) Viewed 7884 times


I would have preferred it if we went further and had different shapes altogether, like bejewelled or animatch do, but I guess doing that will contradict the games name :p
User avatar
c_xong
 
Posts: 234
Joined: 06 Sep 2013, 04:33

Re: Designing for colourblindness?

Postby onpon4 » 01 Jul 2016, 12:21

SuperTux has this problem both with flowers and map spaces, and with the colored light puzzles. I solved this in ReTux by no having the colored lights and by using the animated blue space for all unsolved levels. (The flowers aren't a huge problem in ReTux because I only used two of them and the ice flower is noticeably brighter than the fire flower. Also, ReTux's design makes it possible for you to check at very little cost by shooting.)

I avoided this problem in Pacewar by adding a "colorblind mode", where shapes are placed over both the victory meter and the ships to distinguish the teams.

I still haven't figured out a way to fix the Project: Starfighter bullets in a way that doesn't look ugly (and it's important since there tends to be quite a lot of bullets on the screen, but only the red ones are dangerous to you). It needs to not make the bullets substantially larger and preferably shouldn't change the size at all. I would be open to any suggestions.
onpon4
 
Posts: 596
Joined: 13 Mar 2014, 18:38

Re: Designing for colourblindness?

Postby charlie » 03 Jul 2016, 21:03

onpon4 {l Wrote}: still haven't figured out a way to fix the Project: Starfighter bullets in a way that doesn't look ugly

Have you tried reducing the bullets to grayscale and then tweaking the colour versions until the greyscale ones are distinguishable?
Free Gamer - it's the dogz
Vexi - web UI platform
User avatar
charlie
Global Moderator
 
Posts: 2131
Joined: 02 Dec 2009, 11:56
Location: Manchester, UK

Re: Designing for colourblindness?

Postby onpon4 » 03 Jul 2016, 23:59

No, that's not something I've considered. I suppose that would have to be an option if I do it that way (since gray bullets would look quite bland to non-colorblind players, I imagine). Thanks for the suggestion.
onpon4
 
Posts: 596
Joined: 13 Mar 2014, 18:38

Re: Designing for colourblindness?

Postby charlie » 04 Jul 2016, 00:41

onpon4 {l Wrote}:No, that's not something I've considered. I suppose that would have to be an option if I do it that way (since gray bullets would look quite bland to non-colorblind players, I imagine). Thanks for the suggestion.

I'm not saying make the bullets grayscale. I'm saying try turning them grayscale (in an editor) to see the difference, and then tweaking the colours (which would be IG) until you can distinguish their grayscale equivalent.
Free Gamer - it's the dogz
Vexi - web UI platform
User avatar
charlie
Global Moderator
 
Posts: 2131
Joined: 02 Dec 2009, 11:56
Location: Manchester, UK

Re: Designing for colourblindness?

Postby onpon4 » 04 Jul 2016, 01:58

Yeah, that could be possible, too. I don't know, though; dark green is kind of ugly, too (it would have to be green that's darkened since darker colors are not as visible against the dark backgrounds).
onpon4
 
Posts: 596
Joined: 13 Mar 2014, 18:38

Re: Designing for colourblindness?

Postby leilei » 04 Jul 2016, 20:32

Some Free (with a capital F) pixel shaders could be useful for debugging...
User avatar
leilei
 
Posts: 154
Joined: 03 Apr 2012, 02:53

Re: Designing for colourblindness?

Postby charlie » 05 Jul 2016, 11:46

onpon4 {l Wrote}:Yeah, that could be possible, too. I don't know, though; dark green is kind of ugly, too (it would have to be green that's darkened since darker colors are not as visible against the dark backgrounds).

Got another idea. Animate the bullets. You could do a simple pulse animation. Faster pulses = your bullets. Slower pulses = their bullets.

Or another idea. Outline one side's bullets. Can use 2 shades of the same colour that way.
Free Gamer - it's the dogz
Vexi - web UI platform
User avatar
charlie
Global Moderator
 
Posts: 2131
Joined: 02 Dec 2009, 11:56
Location: Manchester, UK

Re: Designing for colourblindness?

Postby onpon4 » 05 Jul 2016, 12:04

Thanks for those suggestions. None of them are simple due to Starfighter's coding, but I'll look into those solutions when I get to addressing the problem. :)
onpon4
 
Posts: 596
Joined: 13 Mar 2014, 18:38

Re: Designing for colourblindness?

Postby charlie » 05 Jul 2016, 12:50

Or a final suggestion - different shapes. One squarish (X-ish), one round?
Free Gamer - it's the dogz
Vexi - web UI platform
User avatar
charlie
Global Moderator
 
Posts: 2131
Joined: 02 Dec 2009, 11:56
Location: Manchester, UK

Re: Designing for colourblindness?

Postby onpon4 » 05 Jul 2016, 16:13

That one is just as difficult as outlines. Starfighter bases its collision rectangles on the size of images, and bullets are only two pixels high. So to do something like that (and that does seem like it would be ideal), I'll need to change Starfighter to use a fixed bounding box for bullets. Anyway, thanks again; I have a few different ideas to try now. :)
onpon4
 
Posts: 596
Joined: 13 Mar 2014, 18:38

Re: Designing for colourblindness?

Postby charlie » 05 Jul 2016, 17:02

Ok, one final suggestion then.

bullet-suggestion.png
bullet-suggestion.png (549 Bytes) Viewed 7526 times


Or lined instead of checked:

bullet-suggestion2.png
bullet-suggestion2.png (524 Bytes) Viewed 7525 times
Free Gamer - it's the dogz
Vexi - web UI platform
User avatar
charlie
Global Moderator
 
Posts: 2131
Joined: 02 Dec 2009, 11:56
Location: Manchester, UK

Re: Designing for colourblindness?

Postby onpon4 » 05 Jul 2016, 18:41

That was actually the first solution I tried. :) Unfortunately, it's no good; the bullets move quite fast, so pixel-level differences like that are not discernible during gameplay.

Don't worry, though. I'll get it fixed somehow. It's just a matter of when I get to it.
onpon4
 
Posts: 596
Joined: 13 Mar 2014, 18:38

Who is online

Users browsing this forum: No registered users and 1 guest