Print this page


James Herndon

  Inclusive Web

01/04/2013

Making a Colorful Video Game Work for Color Blind Gamers

Tell a Friend

Inclusive gaming requires game developers to take into consideration users that may have a range of visual impairments and disabilities. James Herndon offers inclusive tips. 

Zuma, a tile-matching puzzle video game created by PopCap Games, continues to be one of the most popular free games on the internet. During play, colored balls roll around the screen on a set path, and players attempt to eliminate these balls by firing like-colored balls at them from a stone frog’s mouth, in an attempt to prevent the balls from falling into a hole.

Unfortunately, the need to differentiate between ball colors makes Zuma very difficult for color blind players. In the paid version of the sequel game, 'Zuma's Revenge!' players have a “Color Blind Assist” option. When this option is selected, the balls that are normally colored green become gray. 

Image: screenshot of Zuma, an online video game   Image: Zuma screenshot

Images: (left) Screenshot of Zuma, an online video game that requires color identification in its game play;
(right) 'color blind assist' option in the game turns green colored balls into gray.
Image courtesy: sphotos.xx.fbcdn.net
 
Many websites take the same approach as the original Zuma game, and use colors to signify categories of information. However, this doesn’t serve the purpose, because 1 in 12 men and 1 in 250 women experience some form of color blindness, and are thus unable to distinguish one category of information from another.

If you want your web content to be fully accessible to color blind visitors, here are a few recommendations:

  1. Make sure that the colors you use do not convey important information.
  2. Exaggerate the difference between foreground and background colors.
  3. Don’t use colors with a similar lightness, no matter how much they differ in saturation.
  4. Lighten the lighter colors and darken the darker ones.
Following these recommendations will make your web content accessible to a much larger number of visitors. For more information, please visit the following pages on the Web Accessibility Initiative home page: Contrast (Minimum) and Contrast (Enhanced).
 
This post has been reprinted with permission from Equal Entry.
 
*****************************************************************************************************************************************************************************

Related Resource

Blog: Digital Empathy for Customers of All Abilities by Robert Pearson | Read full article.

Publication: Making Television Accessible - G3ict and ITU Report | Download Free PDF (3.4 MB).
 
Event: G3ict - Assistive Technology Leadership Forum for AT Centers Around the World at ATIA 2013 Orlando | January 30, 2013 - View Event Details.