Want to read Slashdot from your mobile device? Point it at m.slashdot.org and keep reading!

 


Forgot your password?
Close
typodupeerror
×
Graphics Programming Software IT Technology

Developing for Color Blindness? 57

Posted by Cliff from the improving-software-accessibility dept.
Satan's Librarian asks: "I develop software in the music industry. Most of the software is very graphical, with lots of knobs, buttons, and various other custom controls. Recently I realized one of my interfaces would be difficult for someone who was colorblind - fortunately before it shipped. How do other developers avoid this? Is there software available on XFree86, Mac OS X, or Windows that can let you run in a modified-color mode to emulate the various kinds of colorblindness? I've found one site with some cool demos of how colors are perceived with the various types of color blindness, and a lot of self-help sites and software to help people who are colorblind, but no software to help developers and graphics artists avoid causing people difficulties in the first place yet - although from the demos and articles, I expect the algorithms would be trivial. Seems to me that if the statistics I keep seeing for colorblindness are correct (~8% of males, ~2% of females), this could be an often ignored problem that excludes a lot of people from some software. If you're colorblind, how do you deal with websites and software that was poorly designed for you? Is it a problem often?"
This discussion has been archived. No new comments can be posted.

Developing for Color Blindness? More

Developing for Color Blindness?

Comments Filter:

  • Colorblindness references (Score:5, Informative)

    by Anonymous Commando ( 6326 ) on Monday July 14, 2003 @06:54PM (#6438240)
    Visibone [visibone.com] has a good page [visibone.com] dedicated to the more common forms of colorblindness, including a link to an excellent article [btexact.com] that has downloadable color palettes [btexact.com] (for Photoshop and Paintshop Pro, but I would assume that the Gimp would also be able to make use of those palletes) that you can apply to screenshots / mockups / etc. to simulate colorblindness. Not quite as seamless as having a "colorblindness" video mode, but still useful for determining a color palette to use.

  • Hardcoded colors (Score:5, Informative)

    by drdink ( 77 ) <smkelly+slashdot@zombie.org> on Monday July 14, 2003 @06:56PM (#6438250) Homepage
    I am visually imapired, and the biggest complaint I have about software, especially for Windows, is products that have their own hardcoded colors or widget sets.
    I set my Windows to be white on black, and you would be surprised at how many programs have hardcoded black text, and as a result show up as black on black. I have notified many vendors about problems like this. Even Mozilla has suffered from this.
    If there is any advice I can give you, it is that you *must* allow color customizatino of all things, either by using the OS/toolkit's theming, or by giving your own interface.
    This includes text areas, menus, radio buttons (I've seen black on black ones), check boxes, ...
    • Thanks for the insight!

      The toolkit theming is a great idea. For a lot of the music-oriented applications, simple preferences just won't cut it because the applications are too graphical. Check out Reason [propellerhead.se], GuitarPort [guitarport.com], or Project 5 [cakewalk.com] for some good examples of the types of interfaces I'm talking about.

      What I'd really like to do is make sure that every interface we work on works for colorblind people before it ships, so they won't have to find an artist to reskin it. Many of the apps I work on have an insa

  • Hire a colour blind person (Score:5, Insightful)

    by keesh ( 202812 ) on Monday July 14, 2003 @06:59PM (#6438276) Homepage
    Or maybe just look for one already working with you. From the statistics, it's fairly likely that even small companies will have at least one colour blind person... Far easier than messing around with wierd software hacks which may or may not actually work.
    • but there are various types of color blindness. Different people have different impairments. these pictures [toledo-bend.com] are a common example. if a person is color blind to one of those sets of colors, the number in those circles will be not be visible to them. (disclaimer: IANAED. I am not an eye doctor)
      • For a good description of the various types, try here [aol.com]. At least the section on "protoanomaly" matches me to a T. :)

        A more visual explanation is available here [members.shaw.ca].

        Heh.. I nearly ended up flunking kidergarten until a parent teacher conference; my mother asked if they had tested for it or even considered it, and they said 'no'. $#@$ing crayons boxes with the wrappers removed. :) "Color 4 blue" "Color 5 purple".

  • good reading (Score:4, Informative)

    by shdragon ( 1797 ) * on Monday July 14, 2003 @07:00PM (#6438282) Homepage Journal
    Visibone [visibone.com] carries free color blind palettes for photoshop, etc...

    Also, required reading [btexact.com] for anyone wanting to see just how color blind people see.

  • Web design (Score:1, Informative)

    by Anonymous Coward

    Try web design circles. These issues come up from time to time. For instance, Dive Into Accessibility [diveintoac...bility.org] has a lot of good stuff not limited to web design.

  • Living with color blindness (Score:4, Interesting)

    by rubinson ( 207525 ) <rubinson @ e m a i l.arizona.edu> on Monday July 14, 2003 @07:15PM (#6438389) Homepage
    My color blindness is fairly severe -- red/green, red/black, brown/green, and trouble distinguishing shades. Some people who try to accomodate the color blind only think about red/green -- that doesn't help me.

    The cardinal rule for accomodating color blindness is this: don't make color the sole distinguishing aspect. Use text, symbols, whatever -- just make sure that you're using something other than color for identification. Best suggestion -- remove all color from your application and see if you can still use it. If you can, I'll be able to too. (Assuming, of course, that I can distinguish the identification from the color. Black text on a red widget doesn't help me. Think high contrast.)

    • Contrast (Score:4, Interesting)

      by fm6 ( 162816 ) on Monday July 14, 2003 @07:32PM (#6438498) Homepage Journal
      Contrast is a particularly important issue, and not just for the color blind. Too many web sites use color combinations that are hard to use unless you have a pretty good monitor and it's carefully configured and the user has near-perfect color vision.

      Here's one thing that I find frustrating: web design pundits love to talk about color palettes, and how using the correct one can supposedly maximize monitor compatibity and sight-impaired accessibility. But that's an obsolete concept, based on video adapter limitations that no longer apply. What I would find useful is sets of color pairs that could be used in combination to maximize contrast, and still design a web site that looks cool in full-color mode.

  • GIMP It. (Score:5, Informative)

    by frantzdb ( 22281 ) on Monday July 14, 2003 @07:17PM (#6438403) Homepage
    Recent versions of the GIMP have a color-blind display filter. This allows you to see what things would look like to a colorblind person. Because it is a display filter, you can turn it on and off as you work on a UI element.
    --Ben
  • My father has sight problems from diabetes. He has a problem with blues, and clarity. I have him running XP on a 19" monitor at 800x600, and that is sometimes not enough. Usability and layout are more important than using colors to differentiate between controls. I just got him into email and surfing a few years ago and I see how he struggles with colors on the screen, even when viewing a simple local news site. The ones he has good luck are ones with very large contrasts in colors. He visits casino sites t
    • Just in case you check your replies - I ended up writing a simulator / magnifier / color modifier that might be of some help. For deficient blues, my suggestion is to convert the blue hues to greyscale.

      Anyway, it's just a prototype (meaning: i wrote it, i run it, it works on my machines, use at own risk), takes a lot of processing power, and is mainly for me to test my interfaces with, but it could be helpful - It's available here [codevis.com].

      it's bizarre that I haven't found more programs that do this.... you'd t

  • Vischeck (Score:4, Informative)

    by ZarKov ( 99672 ) <shaunm.wolfram@com> on Monday July 14, 2003 @07:28PM (#6438480) Homepage
    First, thank you for taking the time to make your program more accessible. Color-blindness is one of the most common accessibility issues, but it's very easy to overlook. Here's some suggestions:

    * Don't rely on color alone. If you can provide indications other than color, and use color only as a supplement, it will make your program more accessible not only to color-blind people, but also to people with other visual impairments as well.

    * Don't hard-code your colors. It requires very little programmer effort to store color values in a config file somewhere. This way, even if you screw up, users can still make the software usable for themselves.

    * Actually check your colors. I don't know of any software to make your desktop run in a "color-blind mode" (though I'd love to see such software). But there are tools you can use to check screenshots and such. Vischeck [vischeck.com] is a great site that has software to simulate different types of color-blindness on images and web pages. You don't have to download anything. You can just upload an image to Vischeck, and it will transform it and give it back to you.
    • Thanks Zarkov,

      VisCheck is awesome. That's exactly what I was looking for functionality-wise, only I'd really like software that I could run with more options and as color filter for either a single window or the entire desktop.

      I think I may at least have an idea how to spend my next free weekend though. It looks like it'd be easy enough to do inside our internal GUI framework by preprocessing the graphics in testing builds, but something that was quick and easy to use on any program would be much mo

  • Colorblindness is so misunderstood... (Score:5, Informative)

    by AlphaOne ( 209575 ) on Monday July 14, 2003 @07:32PM (#6438500)
    Being "colorblind," I'm amazed at how misunderstood it is!

    The site you give only shows some of the most severe cases... most people who have color perception problems (as they typically are not blind to color) see almost all colors properly. The examples given are a complete *absense* of the indicated cones, not the typical "color shift" problem, where the red or green (and sometimes blue) cones have the wrong pigment in them and respond to slightly different colors.

    This is the type of blindness I have... my red cones are just a slightly "wrong" color red.

    Because of this, I have trouble decriminating between very light greens and yellow. Orange and green, if close enough on the color wheel, can also be confusing. UPS trucks look forest green to me in certain types of light (especially sunset) and bright brown in others.

    HOWEVER, I can identify almost all colors in a controlled environment.

    To give a good example most people could relate with... in MacOS X (my OS of choice :) ) the green and yellow interface buttons (for minimize and maximize) look like SIMILIAR colors, but I can distinguish between them.

    Say someone flashed me a card that was that color yellow and asked me whether it was yellow or green. I'd probably be right about 75% of the time, whereas someone with normal color vision would get it right every time.

    I have somewhat average color blindness, meaning that most people have about as much trouble as I do.

    However, a smaller percentage, about 3%, have very severe problems where they almost literally cannot see color at all. Greens appear black, reds are grey or pink, and blue and violet are just purply.

  • The big color-blind pitfalls (Score:5, Informative)

    by phamlen ( 304054 ) <phamlen&mail,com> on Monday July 14, 2003 @07:37PM (#6438524) Homepage
    I'm moderately colorblind (y'all have WAY too many names for 'blue' - "purple", "mauve", "navy blue", etc.) I have even been known to take black and white photographs of fall foliage because I really can't see the subtle colors in the fall (yellow looks like green to me, red looks like brown).

    I'm not sure that I have a good answer for the writer, but I have some suggestions:

    1) Use icons to convey meaning, not just colors. So put up a triangle with an exclamation point instead of just writing text in red.

    2) It really doesn't matter that we can see the colors, just that we can differentiate them! Most of us cheat by seeing contrast rather than hue - that is, if I see a dark purple and a light blue, I can see the difference between them easily. It's just when they have the same intensity that I get stuck.

    3) we're pretty good at distinguishing a couple of colors - not so good with lots of them. So pick only a few colors - and change the intensity so they don't overlap.

    4) Consider building a "simplified" UI (ie, a graphically minimal UI). In my experience, I can operate fine through a minimal UI - usually because the colors are reduced. And I never mind losing out on the "pretty" interface because I can't see the colors anyway.

    5) Sometimes the ZOOM interface works wonders. If I can enlarge a picture 10x, I can usually see the subtle differences in the interface. It's just when they are really small and close together that I can't tell the difference.

    I hope this helps.

    -Peter Hamlen

  • How about modifying gamma ramp? (Score:3, Interesting)

    by mr3038 ( 121693 ) on Monday July 14, 2003 @07:42PM (#6438551)
    Most recent graphics cards allow loading user defined gamma ramp. Does anybody know if colorblindness could be emulated with suitable gamma ramp only and perhaps even way to generate one? If the effect is created by hardware, every application could be easily tested and one could toggle the "colorblindness mode" on and off on the fly.

    Colorblindess emulation modes that require cross-mixing color channels would require more than a simple gamma ramp modification AFAIK but if you're just interested if some colors are distinguishable, monocrome emulation should do just fine.

    • Good idea, but at least on my primary development box (ATI Radeon 9000, latest drivers, Win2k), it won't let me adjust the end points of the gamma curves for each color.

      Meaning - might work for the colors inbetween, but anything with a 0xff value on r,g, or b is still going to show like it's full on. I should check the drivers for XFree86 though - if they have similar functionality there in an open source driver that I've got a matching card for it should be fairly trivial to implement truely configureab

  • yuk-yuk-yuk

    mod down as unfunny

  • Wow... (Score:2, Insightful)

    by ae0nflx ( 679000 )
    I never thought I'd see an article about this. This is really cool. I'm colorblind myself and this is a huge problem for me.

    I do essential everything using positioning. I have an excellent memory for where I put things and where things are located on the desktop and on menus, etc. etc.. I use OSX as my primary desktop and I can't tell any of the stinkin' buttons apart. I especially have trouble with iTunes when in its shrunken format.

    Another problem is my love of web design. Although not as much of
    • Just speaking as a developer, if something is hard for you to use, or if they're doing a great job at making it accessible, *please* send the company an email. I've never received feedback regarding color issues on the products I've worked on, but I'm sure they've been there and it'd usually be easy enough to fix for a version change or patch release and would be at the top of my list if I knew about it.

      Obviously - it works better with smaller companies where people talk to each other and are a bit more

      • On that note, thanks to the makers of the game "Frozen bubble" for adding the colorblind option.
        It works great.

        Others take note.. they simply added shapes, and the color problems went away.
    • Check this out: Gamers with Disabilities FAQ [gonegold.com]. It covers the gambit of disabilities, but mentions Alpha Centuari and Civilization 3 near the bottom as supporting colorblind modes, and has some other interesting links.
      • Yes. When we used to play Age of Empires III all the time, I'd have to get people to use certain colors on the characters, or else the minimap was essentially 'stealthed' to that character.. or worse, two characters mixed together (ally or enemy?)
      • Sorry, but you read that wrong. These games were being given kudos for supporting a color-blind palette version of their games.

        A red-green colorblind friend of mine was very appreciate of the alternate palette for Alpha-Centauri

  • Color Schemes (Score:2, Interesting)

    by Sunlighter ( 177996 )

    I have a friend who is colorblind and so I have put some thought into this. I think the best thing to do is support color schemes (which can be read from a file or something) and have four color schemes in addition to full color:

    • Red-Cyan (for people who have trouble distinguishing green and blue)
    • Green-Magenta (for people who have trouble distinguishing red and blue)
    • Blue-Yellow (for people who have trouble distinguishing red and green)
    • Grayscale (for people who have trouble distinguishing red, green, an

  • Apple User Interface Guidelines (Score:3, Informative)

    by Zachary Kessin ( 1372 ) <zkessin@gmail.com> on Monday July 14, 2003 @09:41PM (#6439245) Homepage Journal
    Apple at least used to publish a set of UI Guidelines which talked about this issue. I last saw them 10+ years ago but they said never make color be the only thing that seperates two objects. (They also point out that not everyone has a color monitor, which was much more true in the late 80's).

    If you can find a copy of the Apple UI guidelines they are very good reading. If not try looking at your UI in black and white, or at least in fewer colors than you normally do. Not everyone has a big fancy monitor and video card you know.

    • Apple at least used to publish a set of UI Guidelines which talked about this issue.

      And they used to follow such guidelines, too. However, as time has elapsed, Apple has decided not to follow their own guidelines (everybody has color monitors right now anyway, right?). See buttons in the corner of every window in MacOS X for an example. If you haven't seen MacOS X, the close (red?) and maximize (green?) buttons look just the same. Much have been said about QuickTime user interface, too.

  • Joe Clark's book, Building Accessible Websites [joeclark.org] has an very good chapter on colorblindness [joeclark.org]. It has an excellent explanation of colorblindness based on two full weeks of scientific research and interviews with researchers in colour vision, which will prove useful even for non-web development.

    You can also use this greyscale bookmarklet [squarefree.com] (IE only) to get a rough idea of how a web page may look to some colorblind users.

  • In Mac OS X 10.2, you can open System Preferences -> Universal Access. There's a button there called "Set display to grayscale", which will do as it says. This is great to check things like this (also useful for web design).
    • Greyscale may be great for simulating perfect color blindness, but lousy for the common case. For partially color-sighted people (which includes nearly all color blind people) as well as fully-sighted people, the colors actually distract from brightness variations. We unfortunate slightly color blinded people are too distracted by color saturation to see subtle differences which you may be depending on.

      A better solution is to use a specialized palette, or to convert reds to greens (RGB-wise, not perceptu

  • vischeck.com [vischeck.com] has a tool to change the colors of websites to show what they might look like to someone who suffers from colorblindness. Here's slashdot through a colorblind eye [homeip.net].

  • In the majority of my applications, colour is more of a style thing than actual functionality, but when it is, there are build in methods that can explain functionality without being related to colour.
    eg. Using tooltips on the specific colours, or make use of a status bar for when they mouseover specific items.

    It may also be worthwhile to create a UI based on text (and little graphics), for the colourblind, as well as people who get pissed off at fancy interfaces.
  • Are there common color schemes that Windows come with for these color blindness folks?

    Thank you in advance. :)
    • Windows has a color scheme called "High Contrast" which works well for most common forms of color blindness. The problem is that a lot of apps hardcode colors, which effectively short circuits the color scheme.

      If you are developing an app, and you are concerned about accessibility, you shouldn't hardcode colors. Instead there are constants like "default foreground color" (I don't remember the exact constants, but you can look them up yourself). That way you won't override the user's color settings.

      Micr

  • Common enough to bite me (Score:4, Interesting)

    by oren ( 78897 ) on Tuesday July 15, 2003 @01:18AM (#6440190)
    I wrote a path-finder program using Dijkstra's algorithm (and then A*, etc.). At any rate, it dynamically displayed its results showing a red path over a green graph (you can see where this is going...).

    It was working very nicely and the animation was very fun to watch. I was proudly demonstrating it to a co-worker - "See how it just sniffs this dead-end and back-tracks left here?". He looked bewildered: "I don't see anything". Exasperated, I pointed to the bright red line of the path: "Here, *this*! - what are you, color blind?".

    Him: "Yes".

    Oops.

    I spent the next 5 minutes apologizing and then another half hour adding user control over the animation colors so he could see the results. And never took this for granted again.
  • This is exactly what the high contrast-themes in most window-managers are for (even Windows 3.11 had those).

    Here are some good articles/pointers to find out more about designing with high contrast colors in mind:

    Hig High Contrast Color Design [sapdesignguild.org]

    Effective Color Contrast Design [lighthouse.org]
  • The key thing, as others have identified, is to use color + something. Or, put another way, something + color.

    The something can be things like line weight, line pattern, object/symbol shape, position, and/or font style.

    A good example is that links are typically in a different color *and* they are underlined.

    For a row of status "lights", you might have a lower and an upper set of "lights" (really, round icons) where the lower one is green and the upper one is red. To make things really clear, add labels

  • Charge Indicators (Score:3, Insightful)

    by sadida_333 ( 160109 ) on Tuesday July 15, 2003 @09:58AM (#6442171)
    With all of the talk about software, let's not forget one of the worst offenders, battery charge LEDs.

    "The indicator will be red while charging and turn green when charged."

    Fantastic. That doesn't help me a bit :)

    If you ever work on a charge indicator, please add a blink pattern as well.

    Multi-color LEDs are evil to color blind folks.
  • Of course the other comments on not relying on colour as indicators is important, but remember 'colourblindness' is a very wide range of problems that don't mean the same thing.

    For example, I have a red/green and slight red/blue colourblindess. I can tell you the difference between red and green. I can tell you the difference between red and blue. I can read a stoplight. But if you put red text on a green background or vice versa, it is very difficult to read. This is especially a problem around Chris
  • This isn't much help for software, but for web page designers there is a page that will allow you to see how your page looks to those who are colorblind. Color Blindness Check [q42.nl] Unfortunately it requires IE5+ and Direct X to work.
  • I do it all the time for my clients. Look at the colors they pick. http://www.justinlovejewelry.com/
  • I have Protanomaly progressing towards Protanopia. I've been this way since birth and it gradually7 gets worse as I age. It's compounded by the fact that I also have detatched retinas that seriously hampers my sight as well. I can speak for most colorblind people when I say, don't worry about it. Chances are, we'll figure it out anyways. We've spent our lives learning how. It's second nature. I've beaten many a player at games like Bust-A-Move and other color-matching things, even though I often can'
    • Thanks! BTW - from the people I've known with disabilities (er, including myself if you count repetitive-motion-injuries and the resulting nerve damage and a few minor mental issues), I know most people are more than smart enough to tackle their problems. I just don't want to write interfaces that suck where people have to deal with such problems at all!

      If you actually get back to this thread, are still willing to test, and have a fairly heavy duty PC with 32-bit Windows on it, I went ahead and wrote a s

  • In terms of utilities, iChat is by far the best for those of us who are colorblind. It has an option that allows you to use shapes to designate the status of a buddy. It is very helpful as the red and green always look the same because it uses very small circles. Most certainly recommended.
  • Still a prototype, requires lotsa processor, only runs on Windows, might have bugs, etc.

    But, it works for me. Thanks to everyone for all their input! I've learned a lot about color blindness and how to better design my interfaces.

    If you're colorblind, the simulator might also be useful to you. It's basically a fancy screen magnifier with color mods. Feel free to try it out, but it's at your own risk.

    Here's the info page. [codevis.com]

Slashdot Top Deals

Remember to say hello to your bank teller.

Close