3 ms·

What would you suggest as a solution ? I considered swapping Hue for Lightness in order to increase contrast changes. Would you be interested in testing out som

What would you suggest as a solution ? I considered swapping Hue for Lightness in order to increase contrast changes. Would you be interested in testing out some variants ?

floatingatoll 6y ago
Your Hue choices are selected from a pool of 16 with various mutators applied. Hue alone isn't a viable path forward, so finding a translation of Hue to a non-Hue representation that doesn't worsen the diagram is essential. You could apply repeating surface textures inside each slice, rather than showing a solid color, so that Hue 1 shows repeating dots, Hue 2 shows repeating lines, Hue 3 shows repeating triangles. You could use a Braille-like 2x2 grid to represent the 4-bit Hue space as circles and lines within each slice. If you imagine that each slice has 4 walls, replacing the missing fourth wall of the innermost slices with the innermost corner, then you could map the binary representation of 2^4 hue (such as 0110) onto "bites" out of the walls. For example, given 0110, map the 0s onto "bites" and punch a small hole into two adjacent walls of the slice; given 0000, punch a small hole into all four walls. ASCII art of what I mean by "punch a hole into the wall", for Hue 0111 (one zero, so one hole punched). This is an uncurved slice, because ASCII art. ____________ | | | __ | |____/ \____|
- franky47 6y ago
  That's a great suggestion, I love the "hole punching" idea (although it'll probably end up looking like Swiss cheese). The key is to find a solution that looks good enough when zoomed out to ~64px square, which is tricky for details, especially in the inner ring where sections are packed so close from one another.
  - floatingatoll 6y ago
    I imagine that's why square hashes are more common than circles: the raw information density problem.
kop316 6y ago
The primary issue in colorblindness is: 1) One confuses two types of colors as the same one (e.g. red-green, blue-yellow, etc. colorblind) or 2) Colors that are close together appear to be the identical (Like the case that I saw, half of the row looked exactly the same to me, the the entire row looked the same until I looked close). Perhaps a mix of shapes and colors would make it more obvious? Or constrasting the border colors too to hightlight closer difference (like if you have "f8" and "f0", which has a hamming distance of 1, you make the boarder somehow highlight the differences. Don't get me wrong, I think it is a neat idea! I just want you to be aware.
- franky47 6y ago
  Thanks for your feedback. Are the color-blindness simulators in Firefox devtools good enough to reproduce your experience? Or do you have tools that you'd recommend?
  - kop316 6y ago
    You're welcome! I am happy to help. > Are the color-blindness simulators in Firefox devtools good enough to reproduce your experience? I have honestly not used them, sorry.... (I don't make GUIs). I am looking at the docuymentation, and I am a bit disappointed though. By far the most common issue is contrast loss like they say: https://developer.mozilla.org/en-US/docs/Tools/Accessibility_inspector/Simulation https://developer.mozilla.org/en-US/docs/Tools/Accessibility... The condition to not see one color completely is incredibly rare, and not seeing any colors even more so. By in large the issue is constrast loss.
jerf 6y ago
Given the nature of what you're trying to do, arguably, there is very little for you to do. As you've already observed, "normal" human visual acuity is already wildly incapable of perceiving 2^256 different possibilities as distinct anyhow. If normal humans are 200 bits short of the desired 256 (and I'm still feeling generous claiming we could distinguish 2^56 different images of this type, but it's a nice round number to make my point here), color blind people are 203-ish bits short or so. It's not that materially different. Normally when discussing being color-blind sensitive we're discussing not embedding 2 or 3 bits of information into colors that can't be distinguished by those who are color blind, but in this case, we're trying to jam massively more bits than anyone can handle into an image, so it's not clear that much is called for other than tweaking where the bits get lost a bit. Or, to put it another way, relative to the desired goal, we're all already massively "colorblind". Those who are what we humans would call colorblind are, in relative terms, hardly at a disadvantage at all for once, because we're all so many orders of magnitude short of the mark.
thehappypm 6y ago
I am also colorblind. The gold standard is to use a color palette that is engineered for color blindness, which uses a suite of color-blind-friendly colors and heavily utilizes lightness. Here's a good article on an example from Tableau: https://public.tableau.com/en-us/s/blog/2013/10/choosing-colors-accessibility https://public.tableau.com/en-us/s/blog/2013/10/choosing-col...
- kop316 6y ago
  I didn't know about this, thanks!
FalconSensei 6y ago
You can use less hues/shades, and make the shape change instead. That's also easier to commit to memory. If a friend's avatar is a circle with shades of green/purple, and another friend is a gem with shades of green/purple, the hue doesn't matter as much.

What would you suggest as a solution ? I considered swapping Hue for Lightness in order to increase contrast changes. Would you be interested in testing out some variants ?

floatingatoll 6y ago

Your Hue choices are selected from a pool of 16 with various mutators applied. Hue alone isn't a viable path forward, so finding a translation of Hue to a non-Hue representation that doesn't worsen the diagram is essential. You could apply repeating surface textures inside each slice, rather than showing a solid color, so that Hue 1 shows repeating dots, Hue 2 shows repeating lines, Hue 3 shows repeating triangles. You could use a Braille-like 2x2 grid to represent the 4-bit Hue space as circles and lines within each slice. If you imagine that each slice has 4 walls, replacing the missing fourth wall of the innermost slices with the innermost corner, then you could map the binary representation of 2^4 hue (such as 0110) onto "bites" out of the walls. For example, given 0110, map the 0s onto "bites" and punch a small hole into two adjacent walls of the slice; given 0000, punch a small hole into all four walls. ASCII art of what I mean by "punch a hole into the wall", for Hue 0111 (one zero, so one hole punched). This is an uncurved slice, because ASCII art. ____________ | | | __ | |____/ \____|

franky47 6y ago
That's a great suggestion, I love the "hole punching" idea (although it'll probably end up looking like Swiss cheese). The key is to find a solution that looks good enough when zoomed out to ~64px square, which is tricky for details, especially in the inner ring where sections are packed so close from one another.
- floatingatoll 6y ago
  I imagine that's why square hashes are more common than circles: the raw information density problem.

kop316 6y ago

The primary issue in colorblindness is: 1) One confuses two types of colors as the same one (e.g. red-green, blue-yellow, etc. colorblind) or 2) Colors that are close together appear to be the identical (Like the case that I saw, half of the row looked exactly the same to me, the the entire row looked the same until I looked close). Perhaps a mix of shapes and colors would make it more obvious? Or constrasting the border colors too to hightlight closer difference (like if you have "f8" and "f0", which has a hamming distance of 1, you make the boarder somehow highlight the differences. Don't get me wrong, I think it is a neat idea! I just want you to be aware.

franky47 6y ago
Thanks for your feedback. Are the color-blindness simulators in Firefox devtools good enough to reproduce your experience? Or do you have tools that you'd recommend?
- kop316 6y ago
  You're welcome! I am happy to help. > Are the color-blindness simulators in Firefox devtools good enough to reproduce your experience? I have honestly not used them, sorry.... (I don't make GUIs). I am looking at the docuymentation, and I am a bit disappointed though. By far the most common issue is contrast loss like they say: https://developer.mozilla.org/en-US/docs/Tools/Accessibility_inspector/Simulation https://developer.mozilla.org/en-US/docs/Tools/Accessibility... The condition to not see one color completely is incredibly rare, and not seeing any colors even more so. By in large the issue is constrast loss.

jerf 6y ago

Given the nature of what you're trying to do, arguably, there is very little for you to do. As you've already observed, "normal" human visual acuity is already wildly incapable of perceiving 2^256 different possibilities as distinct anyhow. If normal humans are 200 bits short of the desired 256 (and I'm still feeling generous claiming we could distinguish 2^56 different images of this type, but it's a nice round number to make my point here), color blind people are 203-ish bits short or so. It's not that materially different. Normally when discussing being color-blind sensitive we're discussing not embedding 2 or 3 bits of information into colors that can't be distinguished by those who are color blind, but in this case, we're trying to jam massively more bits than anyone can handle into an image, so it's not clear that much is called for other than tweaking where the bits get lost a bit. Or, to put it another way, relative to the desired goal, we're all already massively "colorblind". Those who are what we humans would call colorblind are, in relative terms, hardly at a disadvantage at all for once, because we're all so many orders of magnitude short of the mark.

thehappypm 6y ago

I am also colorblind. The gold standard is to use a color palette that is engineered for color blindness, which uses a suite of color-blind-friendly colors and heavily utilizes lightness. Here's a good article on an example from Tableau: https://public.tableau.com/en-us/s/blog/2013/10/choosing-colors-accessibility https://public.tableau.com/en-us/s/blog/2013/10/choosing-col...

kop316 6y ago
I didn't know about this, thanks!

FalconSensei 6y ago

You can use less hues/shades, and make the shape change instead. That's also easier to commit to memory. If a friend's avatar is a circle with shades of green/purple, and another friend is a gem with shades of green/purple, the hue doesn't matter as much.