Design Theory Site Design Page Design Screen Design Research: Color MultiMedia Teacher Resources Table of Contents Home Page Copyright © 1999 by Bonnie Skaalid

Materials should be designed in shades of gray, black and white first, with color added later in a fashion which adds to instructional effectiveness. Here are the reasons why this is good advice: many people suffer from some type of color deficiency ranging from weakness in certain colors, mainly red and green, to full loss of color (it is estimated that 8% of the population experience some type of color deficiency ). [4] aging also affects the perception of colors users may be accessing your design via monochrome monitors - if important distinctions are shown by varying colors, this information will not be available to these users. Many researchers have cautioned about the use of color in instructional materials: "...excessive or inappropriate use of color can inhibit performance and confuse the user" [5, p. 265]. "Unless used carefully and sparingly, color can make the tasks of reading text and interpreting small objects slower, less accurate, and more painful...color reduces legibility...color produces fuzzy edges...[and] color tires the eyes". Horton (1991, p. 164 cited in [2]) "Color can be a powerful tool for communication if used correctly... use appropriate highlighting and deemphasis techniques to convey meaningful semantic distinctions" [1, p. 429]. If used incorrectly, however, color can interfere with functionality. Guidelines Based on the Physiological Properties of Color Murch [3] discussed screen color use based on the physiological properties of the eye, discussing how the number and distribution of rods and cones in the eye affected the perception of line and color. His recommendations are on this page: Murch's Guidelines for Color Uses of Color - Affective, Structural & Cognitive Schaeffer & Bateman [4] discuss color in terms of its affective role, its structural uses and its cognitive uses. The affective role of color concerns how color can be used to motivate or generate an emotional response. Structural uses for color involve assigning functional meanings to various colors - menu items in one color, instructions in another color and error messages in a third color so that color can help the user to differentiate between the functions of various text messages. Color can also be used to attract the user's attention to convey messages which must be addressed quickly. The cognitive uses of color involve: highlighting salient features color coding, which may help with retrieval of information decreasing the cognitive load by using colors with accepted meanings - ie. red - stop, yellow - caution, green - go) simplifying complex information - using color to organize information by differences or relationships Pett and Wilson (1996, p. 31) list the following suggested uses of color: Use color to add reality Use color to discriminate between elements of a visual Use color to focus attention on relevant cues Use colors to code and link logically related elements Be consistent in general color choices throughout materials Use colors such as highly saturated red and violet to attract attention and to create an emotional response Use highly saturated colors for materials intended for young children Consider commonly accepted color meanings such as red and yellow are warm, green and blue are cool, red means stop, green means go, etc. When producing materials for persons from varied cultures consider the meanings they attribute to colors. An extensive list of guidelines for the use of color is available at: PDF file [6] http://www.extension.usask.ca/Papers/Misanchuk/AECT95/A&SPartI.pdf Here's an example of what not to do when picking background colors and text colors. Can you read the blue text on the blue background? The bottom line on color: design conservatively, possibly starting with black and white do not make color the only way to discriminate between choices use it appropriately to serve the purposes of clarity and functionality.   [1] Marcus, A. (1995). Principles of effective visual communication for graphical user interface design. In Baecker, R. M., Buxton, W., & J. Grudin (Eds.) Readings in Human-Computer Interaction: Toward the Year 2000. San Francisco, CA: Morgan Kaufmann.   [2] Misanchuk, E., Schwier, R. & Boling, E. (in press). Visual design for instructional multimedia. [3] Murch, G. (1995). Color graphics - Blessing or Ballyhoo (Excerpt). In Baecker, R. M., Buxton, W., & J. Grudin (Eds.) Readings in Human-Computer Interaction: Toward the Year 2000. San Francisco, CA: Morgan Kaufmann. [4] Schaeffer, R. & Bateman, W. (1996). So many colors, so many choices: The use of color in instructional multimedia products. (ERIC Document Reproduction Service No. ED 397 835) [5]Shneiderman, B. (1998). Designing the user interface: Strategies for effective human-computer interaction (3rd ed.) . Reading, MA: Addison-Wesley Publishing. [6] Schwier, R. A., & Misanchuk, E. R. (1995). The art and science of color in multimedia screen design, part I: Art, opinion, and tradition . Paper presented at the Annual Conference of the Association for Educational Communications and Technology, Anaheim, CA, February 8-12, 1995. (ERIC Document Reproduction Service No. ED 381 143)   Screen Research: [Screen Grid and Layout [ [Line Length] [Screen Density] [Font Selection & Leading] [Icons, Buttons, & Menus][Color] Page Design:[Multimedia & Web Page Design Principles] [Screen Design Research] [Screen Resolution & Size] [Writing Style] Main Level: [Home Page] [Design Theory][Site Design] [Page Design] [MultiMedia] [Teacher Resources] [Table of Contents]