Enhancing Learning on Websites: Applying Instructional Design & Cognitive Principles, Papers of Web Design and Development

Download Enhancing Learning on Websites: Applying Instructional Design & Cognitive Principles and more Papers Web Design and Development in PDF only on Docsity! Instructional Design Principles Running head: APPLYING INSTRUCTIONAL DESIGN PRINCIPLES Applying Instructional Design Principles to Web Site Design Stacey Rowland ABED 4118: Web Site Design, University of West Georgia September 5, 2008 1 Instructional Design Principles Applying Instructional Design Principles to Web Site Design Introduction Instructional Design is defined as “the practice of arranging media and content to help learners and teachers transfer knowledge most effectively. The process consists broadly of determining the current state of learner understanding, defining the end goal of instruction, and creating some media-based ‘intervention’ to assist in the transition” (Instructional Design, 2008). The instructional design process is guided by research-based learning theories of how the mind processes information. It is necessary to draw from learning theories and instructional design principles when designing a website in order to clearly understand how learners process and encode information presented on the web. This paper presents a literature review of instructional design principles and their applicability toward designing an educational or informational website. Review of Literature Cognitive Principles and Instructional Design Implications Instructional technology must be used in a way that is grounded in research-based theory of how students learn. Cognitive psychology, a branch of psychology that examines internal mental processes, provides a sound base for understanding how technology can be used to foster student learning in the online environment (Mayer & Moreno, 2007). One theory that has greatly influenced the instructional design process is the cognitive load theory. Feinburg and Murphy (2000) define the cognitive load theory as “the amount of ‘mental energy’ required to process a given amount of information. As the amount of information increases, so does the cognitive load on our mental resources. When the amount of information and instruction exceed the capacity and limitations of our mental resources, then learning will be inhibited” (p. 354). Sweller (1988) 2 Instructional Design Principles Anderson (1991; 1992) presented a study whereby students who listened to a narration explaining how a bicycle tire pump works while also viewing an animation generated more knowledge than did the students who listened to the same narration without viewing an animation. Another study concluded that students who read a text containing captioned illustrations (verbal mode) placed near the corresponding words (visual mode) generated about 65% more knowledge than students who only read the text (Mayer & Morene, 2007; Mayer, 1989; Mayer & Gallini, 1990). By utilizing auditory narration combined with visual representation--a verbal mode and a visual mode—students are better able to build connections between the information presented, thus retaining more of the information (Mayer & Moreno, 2007). Split-attention effect. “The split-attention effect is apparent when the same modality (e.g. visual and visual) is used for various types of information presented within the same display. To learn from these materials learners must split their attention between these materials to understand and use the materials provided” (Split-Attention Effect, 2008). Feinburg & Moreno (2000) assert that too much cognitive load will be generated by text and graphics competing. The learner has to switch between text and graphics, and is forced to keep information-elements in working memory for a longer time, causing a higher extraneous load (Martens, 1999). To decrease this load, the learning materials should be redesigned by integrating the text and graphics such as inserting text into the graphic image. This will reduce the amount of visual switching required, thus facilitating the learning process (Chandler & Sweller, 1991; Sweller, Chandler, Tierney, and Cooper, 1990). Mayer & Moreno (2007) suggest that it’s best to present words as auditory narration rather than as visual on-screen text. Mayer & Moreno (2007) conducted an experiment where the students who viewed an animation depicting the formation 5 Instructional Design Principles of lightning while also listening to narration generated 50% more information than did students who viewed the same animation with on-screen text consisting of the same words. The on-screen text and animation overloaded the visual information processing system causing a split-attention affect, which impeded the working memory. The redundancy effect. Feinburg and Murphy (2000) assert that instructional design theory views use of redundant (repeating) sources of information as ineffective to the learning process because it places increased demand on cognition. “The redundancy effect says that if one form of instruction (such as the spoken word) is intelligible and adequate then providing the same material in another form (such as lines of text on a screen that mimic the words being spoken) are redundant and can actually hurt understanding” (Byrne, 2007, p. 1). Mayer and Moreno (2007) assert that it is better to have coherent summaries of information that highlight relevant words and pictures than having long versions of information. A study was conducted where students who read a passage explaining the steps in how lighting forms along with corresponding illustrations obtained 50% more knowledge than students who read the same information with additional details inserted in the materials (Mayer, Brove, Bryman, Mars & Tapangco, 1996; Harp & Mayer, 1997). The study proved that a concise presentation “primes the learner to select relevant information and organize it productively” (Mayer & Moreno, 2007, p. 5). Application to a Web Site Design Project The instructional design techniques derived from the split-attention effect, redundancy effect, and modality effect can be applied to the design of an information or educational website. Since the screen elements or objects must be interpreted by the user, this consequently occupies some of the user’s mental energy (Berry, 2000). Therefore, information on the website must not 6 Instructional Design Principles only be designed in a form that is attractive, but also in a format that is usable and minimizes extraneous cognition. Extraneous cognitive load can be minimized by the following:  Design a consistent, easy to follow layout: A complex design with too many fonts, objects, navigation tools, and layout patterns will cause a higher extraneous cognitive load because each component has to be perceived and interpreted by the learner. Thus, a design which displays consistency with text, graphics, navigation, and layout will have a lower cognitive load (Berry, 2000).  Use only meaningful graphics and integrate with text: The use of graphics should be meaningful, as opposed to frivolous or irrelevant (Nielson, 2002). Graphics should also be integrated with text information in order to reduce the amount of visual switching required (split-attention effect) and promote the retaining of information.  Display text and graphics in a way that facilitates quick reading and scanning: When graphics are integrated with text, as opposed to forcing the user or learner to look in two different places for the information (split-attention effect), then the learner is absorbing the information quicker. Nielson (2005) recommends that web content should be short, easy to scan and concise. This will facilitate quick reading and visual scanning which is necessary to avoid the redundancy effect.  Display text, graphics, or video in a way that is consistent with a dual-processing model of working memory: This can be achieved by providing captioned illustrations or graphics alongside corresponding text as well as integrating an audio file to be included with a corresponding graphic or illustration. The modality effect can also be achieved by integrating a short video. The video provides auditory narration as well as a visual representation of the material, thus separating the visual and auditory channels and 7 Instructional Design Principles Instructional design. (2008, September 3). In Wikipedia, The Free Encyclopedia. Retrieved August 30, 2008, from http://en.wikipedia.org/w/index.php? title=Instructional_design&oldid=236081423 Martens, R. (1999). Split-attention and modality effects in case-based multimedia learning. Research fellow project proposal. Retrieved August 28, 2008, from Educational Technology Expertise Center Open University of the Netherlands Web Site: http://www.ou.nl/Docs/Expertise/OTEC/Projecten/onderzoeksvoorstellen%20PDF/ voorstel_08_hta.pdf Mayer, R., & Gallini, J. K. (1990). When is an illustration worth ten thousand words? Journal of Educational Psychology, 82, 715-726. Mayer, R., & Anderson, R. (1991). Animations need narrations: An experimental test of a dual- coding hypothesis. Journal of Educational Psychology, 83, 484-490. Mayer, R. E., & Anderson, R. B. (1992). The instructive animation : Helping students build connections between words and pictures in multimedia learning. Journal of Educational Psychology, 84, 444-452. Mayer, R. E., Bove, W., Bryman, A., Mars, R., & Tapangco, L. (1996). When less is more: Meaningful learning from visual and verbal summaries of science textbook lessons. Journal of Educational Psychology, 88, 64-73. Mayer, R. E., & Moreno, R. (1998). A cognitive theory of multimedia learning: Implications for design principles. Paper presented at the ACM SIGCHI Conference on Human Factors in Computing Systems. Retrieved July 23, 2008, from http://www.unm.edu/%7Emoreno/PDFS/chi.pdf 10 Instructional Design Principles Nielson, J. (2002, May 12). Top ten guidelines for homepage usability. Message posted to http:// www.useit.com/alertbox/20020512.html Nielson, J. (2005, December 5). Talking-head video is boring online. Message posted to http://www.useit.com/alertbox/video.html. Penney, C. (1989). Modality effects and the structure of short-term verbal memory. Memory and Cognition, 17, 398-422. Split attention effect. (2008, July 3). In Wikipedia, The Free Encyclopedia. Retrieved August 30, 2008, from http://en.wikipedia.org/w/index.php? title=Split_attention_effect&oldid=223358231 Sweller, J. (1988). Cognitive load during problem solving: Effects on learning. Cognitive Science, 12, 257-285. Sweller, J., Chandler, P., Tierney, P., & Cooper, M. (1990). Cognitive load and selective attention as factors in the structuring of technical material. Journal of Experimental Psychology: General, 119, 176-192. 11