Ten Design Points for the Human Interface to Instructional Multimedia
by RONALD D. McFARLAND Nova Southeastern University Fort Lauderdale, Fla. Several years ago, I picked up my first multimedia package at the local software store and started it up. Following a long series of graphic splashes (resembling buckets of paint thrown against a clear window) plus several annoying advertising screens for the software company, the package finally displayed the first user-operable screen. At its center was a cluster of cramped text framed with a disarray of indistinguishable icons and an odd assortment of graphic buttons. Initially I was impressed, being somewhat of a techno-nerd. But the thrill of brightly colored images; noises that blasted, popped and whirred; plus the myriad icons and buttons presented soon grew to be an irritant -- one that outweighed any of the program's possible benefits. Needless to say, I soon gave up on the unnamed package since its presentation of subject material and other Human Interface issues became an obstacle to its basic use. The thrill was gone. Negative reaction is much too common with all-too-many educational multimedia packages on the market. Further, school systems and universities are spending their limited funds on multimedia software that may end up dusty on the library or media center's shelves, primarily because these packages do not meet the Human-Computer Interface (HCI) needs of the learner. Ten Ways to Build a Better Interface My interest in multimedia grew as I studied and constructed education- oriented multimedia projects. While completing graduate work, I focused on the uses and development of multimedia for educational purposes. During multiple iterations of developing a viable "pedagogically correct" multimedia project at Northern Arizona University, I categorized ten significant requirements for the Human-Computer Interface. In general, what distinguishes a mediocre multimedia presentation from a great one is the correct and consistent design of this interface. The following Human Interface guidelines for text and graphics usage in a multimedia package can serve as a checklist to integrate into the multimedia-development process or as general parameters for selecting well-designed educational software. Readers are encouraged to keep them in mind when they develop or review instructional multimedia. 1. Test that delivery of material relates to the knowledge of the user. Multimedia's greatest asset is its ability to engage learners. Engagement serves as the "bridge" to learners and is built best by ensuring that students can relate to the information (text and graphics) presented. The relationship of presented material to a learner's existing knowledge base, each known as a link, is a critical success factor in using multimedia for instruction. In general, a person will learn better if many links to prior experience are performed by the current material. This linkage is also known as "information mapping." 2. For each screen presentation, determine if words, illustrations or icons are most appropriate. Although our society, in general, is more textually oriented, the decision to use pictures, text, or both must be heavily weighed. Although "a picture is worth a thousand words" is a popular cliché, it is, in part, inaccurate and can pollute careful analysis. Illustrations should be used to support and complement text, and vice versa. A picture should not be used for presenting detailed information. For example, if one's presentation explains the design of integrated circuits, including voltages and impedance, a picture of an I.C. will not substitute for any of the textual information explaining these attributes. 3. Determine the attention value vs. learning and recall for each screen presentation. We are a visually illiterate society. Visuals comprise the marketing splashes for product sensationalism (sell the sizzle, not the steak) or entertainment. Our TV society is accustomed to passive presentation of visuals and this, unfortunately, has bled over to some multimedia software. (Has television pre-conditioned our expectations of multimedia?) While visuals are vital, they must conform to context and content. Plus, at times, we don't want active engagement. A learner can be bombarded by too much new information. To give them "absorption" time, passive presentation of review material or supporting visuals will provide learners with a bit of breathing room for newly acquired knowledge. 4. Verify that the packaging of information d'es not overpower the intended message. Again, we can overload users by providing too much, too fast. I have reviewed hundreds of educational multimedia packages. Many barrage learners with more information than is digestible at one time, which, consequently, defeats the learning process. To prevent learner frustration, limit the quantity of information presented to a few items per screen. Of course, the exact amount depends on the age and grade level of learners, but most often, it is best to present one, two or three (at the maximum) items on a given presentation screen. 5. Check that the inclusion of visuals and text truly augments the learning process. In essence, ask the question "D'es the illustration match the text?". Developers often feel compelled to put several graphics on a screen to give the product a certain razzle-dazzle. That's great! But a word of caution: carefully choose graphics and illustrations to ensure they contribute to the understanding of the text. If a graphic is totally unrelated to the intended textual message, it may only cause confusion. 6. Use color to enhance communication. Color supports communication when it is correctly used. Inappropriately used, it will tend to baffle or offend. Some general guidelines for using color in a multimedia presentation are: Use a soft, non-intrusive background color for the multimedia desktop. Pastels and soft grays provide the best backdrop. Eyes become fatigued when exposed to highly saturated colors for an extended period of time. Use a consistent color scheme for the entire presentation. If you decide to use a different color scheme for each subject area within the presentation, use complementary colors. Be aware of the "simultaneous color contrast effect" in which the same color used for an icon or illustration will appear differently depending on the background it is placed upon. Select appropriate colors for specific functions. For example, the color red signifies danger, warning, etc. Use red in graphics (illustrations and icons) to represent the urgency that red conveys. 7. Test the effect of how people process certain illustrations. Illustrations, in terms of the cognitive model, are interpreted differently based on the prior experience of the learner. The selection of illustrations needs to be made within the context of the pre-defined audience level. Testing of illustrations should be done independent of the presentation and on test groups that truly represent the intended users. 8. Test the usability of icons. An icon, by definition, is a small graphical representation for a programmed-process that is activated by clicking the mouse. Icons are great, but as the scenario below shows, they must be chosen with care. I was once asked to review several dozen icons for a small project. For the project's scope and depth, I first noticed that the number of icons was enormous, way out of proportion to the program's size. Second, five of the icons appeared to be the same. Each contained a small picture of a meter with its needle at a different position. At first glance, however, the needle's position was not clearly distinguishable. To remedy the confusion, four icons were eliminated and a selection menu was attached to the one remaining. Now when the icon was picked, the menu prompted users to select one of five processing options. In general, icon usability can be tested by presenting the icons to pre-defined test groups for interpretation. Should the vast majority correctly define the intended process that g'es with the icon, the icon's design is appropriate. However, if a significant number of the test group is confused about its intended meaning, the icon will need to be redesigned or replaced by a textual item like a menu selection list. 9. When text and visuals are used, ensure that the messages are not redundant. Words must support graphics and vice versa. If text and visuals are redundant, that is, if the words give the learner the exact information that the visual conveys, then learners may be confused (or bored). Only when the two are complementary, offering different yet related information, d'es the mix promote learning. One must eliminate the redundancy, either the text or illustration, or add enough more content. 10. Verify that the visuals and icons are culturally sensitive. Review illustrations, graphics and icons for unintentional, but culturally sensitive, misrepresentations. For example, if the multimedia product is to be exported, care must be taken to review the presentation for items that may be inappropriate or offensive due to divergent cultural contexts. In Conclusion In conclusion, the Human-Computer Interface (HCI) is an important design aspect that should be a primary focus in the design of any instructional multimedia software. The intent of the HCI is to keep the learner engaged by providing a clear and consistent interface and appropriate metaphors that support the learning process. These ten parameters for the Human-Computer Interface in the development or selection of a multimedia package will help keep learners excited about the material and coming back for more. Ron McFarland, a doctoral student at Nova Southeastern University in Ft. Lauderdale, Florida, is completing his dissertation in Computer Systems in Education involving educational multimedia in conjunction with the Dept. of Psychology at Northern Arizona University in Flagstaff, Arizona. E-mail:
[email protected].
This article originally appeared in the 02/01/1995 issue of THE Journal.