Top Banner
Enhancing Student Learning by Incorporating Visualization and Navigation Tools In Web-based Learning by Toh Seong Chong, Ph. D. e-mail: [email protected] Center for Instructional Technology and Multimedia, Universiti Sains Malaysia Paper presented at Malaysian Educational Technology Conference, 2000  Abstract In a world of information overload, students need to be taught to process and communicate information in a dynamic non-linear manner. However there are  problems with the use of multimedia. The tools available today don’t help the students with what we believe to be most important, processing and communicating information. The authoring tools available make it possible for students to combine media into a glitzy presentation but they don’t help the students to synthesize the information and to think and communicate in a non- linear way.To overcome this situation, this paper discusses the design and development of various visualization and navigation tools that act as cognizant advisor, aide, facilitating the students to develop appropriate models of what is happening within hidden or difficult-to-perceive processes. These tools are developed at the Center for Instructional Technology and Multimedia, Universiti Sains Malaysia. Introduction Web-based Learning and Information Superhighway are two computer related buzzwords of the decade. Questions regarding the use of and the place of both in society abound. Both have captured the imagination of the media and are enjoying unprecedented coverage in the media and commercially. More and more educators are jumping into the bandwagon of WWW to use it as a vehicle for implementing instructional improvements (Reeves, 1997, Khan, 1997; Owston, 1997). Despite these potentially powerful uses, there are serious misunderstandings and misgivings among educators about the potential of the WWW to support learning. Many teachers and administrators assume that the WWW is a panacea, and that simply putting content on the Web guarantees better learning. Windschitl (1998) describes the folly of these assumptions and calls for more systematic research into the effectiveness and impact of the WWW in education. Effective Web-based lear ning depends on systematic and so und instructional design (Toh, 1999). Toh (1999) suggested that to promote and support active learning, the important problems that have to be addressed are: deciding how experiences that are incorporated within the Web-based learning environment that can best be presented to the learners;
12

Enhancing Student Learning by Incorporating Visualization and Navigation Tools

Apr 03, 2018

Download

Documents

Dr Toh
Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
Page 1: Enhancing Student Learning by Incorporating Visualization and  Navigation Tools

7/28/2019 Enhancing Student Learning by Incorporating Visualization and Navigation Tools

http://slidepdf.com/reader/full/enhancing-student-learning-by-incorporating-visualization-and-navigation-tools 1/12

Enhancing Student Learning by Incorporating Visualization andNavigation Tools

In Web-based Learning

by

Toh Seong Chong, Ph. D.e-mail: [email protected]

Center for Instructional Technology and Multimedia,Universiti Sains Malaysia

Paper presented at Malaysian Educational Technology Conference, 2000 

 Abstract 

In a world of information overload, students need to be taught to process and communicate information in a dynamic non-linear manner. However there are

 problems with the use of multimedia. The tools available today don’t help thestudents with what we believe to be most important, processing and communicating information. The authoring tools available make it possible for students to combine media into a glitzy presentation but they don’t help thestudents to synthesize the information and to think and communicate in a non-linear way.To overcome this situation, this paper discusses the design and development of various visualization and navigation tools that act as cognizant advisor, aide, facilitating the students to develop appropriate models of what ishappening within hidden or difficult-to-perceive processes. These tools aredeveloped at the Center for Instructional Technology and Multimedia, Universiti Sains Malaysia. 

Introduction

Web-based Learning and Information Superhighway are two computer related buzzwords of thedecade. Questions regarding the use of and the place of both in society abound. Both havecaptured the imagination of the media and are enjoying unprecedented coverage in the mediaand commercially. More and more educators are jumping into the bandwagon of WWW to use itas a vehicle for implementing instructional improvements (Reeves, 1997, Khan, 1997; Owston,1997).

Despite these potentially powerful uses, there are serious misunderstandings and misgivingsamong educators about the potential of the WWW to support learning. Many teachers andadministrators assume that the WWW is a panacea, and that simply putting content on the Web

guarantees better learning. Windschitl (1998) describes the folly of these assumptions and callsfor more systematic research into the effectiveness and impact of the WWW in education.Effective Web-based learning depends on systematic and sound instructional design (Toh,1999).

Toh (1999) suggested that to promote and support active learning, the important problems thathave to be addressed are:

• deciding how experiences that are incorporated within the Web-based learning environmentthat can best be presented to the learners;

Page 2: Enhancing Student Learning by Incorporating Visualization and  Navigation Tools

7/28/2019 Enhancing Student Learning by Incorporating Visualization and Navigation Tools

http://slidepdf.com/reader/full/enhancing-student-learning-by-incorporating-visualization-and-navigation-tools 2/12

• deciding how human-computer interfaces can be used to initiate, promote and sustaininvolvement in the learning activities;

designing interfaces in a way that enables the maximum pedagogic impact of the underlyingcomputer system to be achieved.

 Although many types of software can be used as cognitive tools for learning (e.g., visualizationtools, navigation tools, databases, spreadsheets, and authoring systems), this paper highlightsthe power of visualization tools and navigation tools when employed as intellectual partners inWeb-based learning. Before describing the various visualization and navigational tools, a brief discussion on key visualization principles will be useful.

Visual Cognition

Visual cognition includes all the mental processes involved in the perception of and memory for visual information (Pinker, 1984). Perception is the process of selectively attending to andscanning a given given stimulus, interpreting significant details or cues, and, finally, perceivingsome general meaning (Levie, 1987). Memory for visual information involves the cognitiveprocesses of storing and recalling information from visual stimuli.

Visual Perception

Visual perception is largely concerned with visually recognizing shapes and patterns of objectsdirectly in our visual field. Gestalt psychologists from the 1920s, such as Max Wertheimer, KurtKoffka, and Wolfgang Kohler, were among the first to be interested in visual perception. Gestaltperceptual factors build a visual frame of reference which can provide the designer with areliable psychological basis for the spatial organization of graphic information. To theGestaltists, the parts of a visual image may be considered, analyzed and evaluated as distinct

components. Also, the whole of a visual image is different from and greater than the sum of itsparts.

Three important Gestalt Principles are:

• Figure and Ground

• Similarity, Proximity or Contiguity, Continuity

•  Closure, Area, Symmetry

Visualization Tools

 A visualization tool is essentially a facility that enables students and trainees to obtain particular perspectives on and views of a collection of stored data or of a dynamic, ongoing process. Suchtools are usually highly interactive since they allow their users to have both fine-grained and

coarse-grained control over the view or system perspective that is presented. These toolsencourage the learner to form symbolic mental images of their world, since, according toCsikszentmihalyi (1990):

...playing with ideas is extremely exhilarating. Not only philosophy by theemergence of new scientific ideas is fueled by the enjoyment one obtainsfrom creating a new way to describe reality....When a person has learned asymbolic system well enough to use it, she has established a portable, self-contained world within the mind. (p. 127)

Page 3: Enhancing Student Learning by Incorporating Visualization and  Navigation Tools

7/28/2019 Enhancing Student Learning by Incorporating Visualization and Navigation Tools

http://slidepdf.com/reader/full/enhancing-student-learning-by-incorporating-visualization-and-navigation-tools 3/12

 The learner is motivated to use visual thinking tools because he or she enjoys theintellectual challenge of active visual construction of ideas, both as an individual and

as a participant in group activity. The chances for successful problem solving areenhanced by the application of visual thinking tools, and increase the learner'ssatisfaction as a result.

 A definition proposed by Hartley (1996) is: "Visual tools are symbols graphically linkedby mental associations to create a pattern of information and a form of knowledgeabout an idea." (p. 24). The crucial point here is that they are tools used for theconstruction of content knowledge, not just storage structures for ideas alreadydeveloped.

(a) Visualization Tool to link HTML with QuickTime Movie, AVI movie, and MPEGmovie

QuickTime Movie is one of the digital movie formats. Unfortunately most movie files that we see

on the Web pages are small and difficult to control. This section describes a tool to enable adesigner to link a HTML Web Page to a QuickTime Movie Player. See Figure 1. The movie sizecould be as large as 640 pixel by 480 pixel. Quality of the movie on the Web is smooth and theanimation is crisp and clear.

This is done by embedding a JavaScript in the HTML file as follows:-

<a href="javascript:openWindow('color_select.mov');"><br>

In order for this tool to work, QuickTime 3.0 System Software have to be installed into thecomputer system. This software will enable you to integrate video, graphics, music, sound,sprites, text, panoramas and animations into your documents. At the same time QuickTimePluggin will be automatically installed into the Internet Browser.

Page 4: Enhancing Student Learning by Incorporating Visualization and  Navigation Tools

7/28/2019 Enhancing Student Learning by Incorporating Visualization and Navigation Tools

http://slidepdf.com/reader/full/enhancing-student-learning-by-incorporating-visualization-and-navigation-tools 4/12

 

Figure 1: Visualization Tool linking HTML page with QuickTime Movie

The source code above can be easily modified to access Microsoft AVI movie files, and MPEGmovies. Using this tool the resulting Web Page will be linked to a QuickTime movie file withcontrollers (See Figure 1). This represents a powerful tool to visualize a learning process.

(b) Visualization Tool for Panoramas

 Another interesting visualization tool to link the HTML web page with QuickTime Virtual Reality(VR) movies to create panoramas. QuickTime VR is Apple's photorealistic virtual realitytechnology that makes it possible to explore places as if you were really there. All major applications that play QuickTime movies can also play QuickTime VR movies. QuickTime VRmoves the photographic image from the flat, 2D world into a more immersive experience,complete with 3D imagery and interactive components. Interactive content design andimmersive imaging allow the viewer to explore and examine detailed virtual worlds using a

computer and mouse, not cumbersome goggles, headsets or gloves.

Page 5: Enhancing Student Learning by Incorporating Visualization and  Navigation Tools

7/28/2019 Enhancing Student Learning by Incorporating Visualization and Navigation Tools

http://slidepdf.com/reader/full/enhancing-student-learning-by-incorporating-visualization-and-navigation-tools 5/12

 

Figure 2: Visualization Tool using QT Virtual Reality Panorama movie 

QTVR panoramas are in essence the view from a single point in space out to a surroundingenvironment. From the central observation point, called a node, a viewer can look in anydirection and may zoom into or out from a particular view by changing the zoom angle of their view. QTVR panoramas support the creation of hot spot areas, which function as an invisibleyet detectable mask on the final panorama. Developers can use these hot spots to linkpanoramas to other QTVR panoramas, QTVR objects, QTVR scenes, or other media such asgraphics, text, videos, and sounds via an authoring environment. Alternatively, the same hotspots can be used to link to other World Wide Web sites when the QTVR panorama is includedon a web page. The power of this visualization tool is tremendous. It can be use to visualizeobject, scenes and sequences that are difficult to perceive. At the Centre for Instructional andMultimedia, USM., we experimented with this VR technology to teaching difficult concepts inscience topics.

(c) Visualization Tools created using Macromedia Flash

One of the most recent exciting development is the creation of a Web-based vector graphicsmovie software called Macromedia Flash. Flash movies are compact, vector graphics, so theydownload rapidly and scale to the viewer’s screen size. The Flash Player resides on the localcomputer, where it plays back movies in browsers or as stand-alone applications. As you workin Flash, you create a movie by drawing or importing artwork, arranging it on the Stage, andanimating it with the Timeline. You make the movie interactive by making it respond to events

Page 6: Enhancing Student Learning by Incorporating Visualization and  Navigation Tools

7/28/2019 Enhancing Student Learning by Incorporating Visualization and Navigation Tools

http://slidepdf.com/reader/full/enhancing-student-learning-by-incorporating-visualization-and-navigation-tools 6/12

and to change in specified ways. When the movie is complete, you export it as a Flash Player movie, embed it within an HTML page, and transfer it and the HTML page to a web server.

 At the CITM we have created and experimented with numerous Flash movies. This technologyif properly designed and utilized has rich potential to enhance visual learning because thevector graphics are capable of fast animations. Figure 3 is a example of a Flash movie createdfor our CITM Web site. 

(d) Thinking-Process Maps Tools 

"Thinking-process maps are visual tools defined by fundamental and global thinkingprocesses, from constructing simple categories to developing new theories. ...[they] arevisually designed to reflect fundamental patterns of thinking." (Hyerle, 1996, p. 72). Theemergence of visual thinking language has evolved from the dynamic representations of 

systems analysis and the realm of concept mapping. Thornburg (1998) and Hyerle (1996)present overviews of schemes useful to education as well as industry and science. Thesemaps are designed to facilitate the constructivist visualization of ideas. See Figure 4.

Figure 3. Visualization Tool using Macromedia Flash

Page 7: Enhancing Student Learning by Incorporating Visualization and  Navigation Tools

7/28/2019 Enhancing Student Learning by Incorporating Visualization and Navigation Tools

http://slidepdf.com/reader/full/enhancing-student-learning-by-incorporating-visualization-and-navigation-tools 7/12

 

(e) Visualization Tools for Supporting Collaboration

Collaborative learning refers to instructional strategies whereby learners work together in pairs,small groups, or even large groups to accomplish shared goals. In the past, most coursewarepackages for the support of learning and training have been designed to support individual,isolated users working on their own personal computer systems each of which was located at aparticular location. End-user interface design to facilitate this mode of working is fairlystraightforward; the various approaches that have been used are well-documented in theliterature. Within such systems, learners and trainees form distributed learning groups andcommunicate with each other using interactive workstations that are connected together usingvarious telecommunications. Learners can benefit both instructionally and socially when theWWW is used to structure and guide groupwork. Given an appropriate instructional design, two

or more learners working together via the WWW might accomplish more than a learner wholearn alone by himself because the interactions among the learners may have more influenceon their learning than the interactions between the learners and the Web-based content. SeeFigure 5 shows an example of a collaborative support tool to enable learners to explore further the Solar System.

Figure 4: Thinking-Process Maps Tools

Page 8: Enhancing Student Learning by Incorporating Visualization and  Navigation Tools

7/28/2019 Enhancing Student Learning by Incorporating Visualization and Navigation Tools

http://slidepdf.com/reader/full/enhancing-student-learning-by-incorporating-visualization-and-navigation-tools 8/12

Figure 5. Collaborative Learning Visual Tools

(f) Adjunct Memory Support Visualization Tools

For many learning tasks, people need adjunct memory support visualization tools. Adjunctmemory support presents information that's needed to complete a learning task but isn't thefocus of the instruction—the value of pi, for example, or a list of detailed procedural steps. Thefollowing example shows a simulation sequence in which learners are asked to perform severalsteps.

Page 9: Enhancing Student Learning by Incorporating Visualization and  Navigation Tools

7/28/2019 Enhancing Student Learning by Incorporating Visualization and Navigation Tools

http://slidepdf.com/reader/full/enhancing-student-learning-by-incorporating-visualization-and-navigation-tools 9/12

 

In the above adjunct memory support visualization tool (Figure 6), clicking the Steps button inthe lower left corner of the screen causes the steps to appear in the window as a reminder.

 After performing the procedure a few times, most people will no longer need the help. But for new users, such memory support is critical. The screen designer have to keep visible on thescreen the information the learner will need to refer to during the instruction, especially torespond to questions. 

Navigational Tools

Navigation within systems has been and continues to be an area of interest and investigation.Whether or not the system or application is one which uses a hypertext database, researchers,designers, and users recognize the problem of keeping the user informed of where he is, wherehe came from, and where he can go and how he can get to a desired destination.

During the development of a multimedia application, storyboards and navigation maps areuseful tools for planning the application's content and navigational structure. During the design

Figure 6: Adjunct Memory Support Visualization Tool 

Page 10: Enhancing Student Learning by Incorporating Visualization and  Navigation Tools

7/28/2019 Enhancing Student Learning by Incorporating Visualization and Navigation Tools

http://slidepdf.com/reader/full/enhancing-student-learning-by-incorporating-visualization-and-navigation-tools 10/12

Figure 7: Earth Movements Tutorial with Navigational Controls

process the two development aids are integrated. A navigation map simply outlines theconnections or links among the various areas or parts of the content. It shows the logical flow of the content that will be supported via the user interactive interface. Basically the designer works

with four basic organizing structures, linear, hierarchical, nonlinear, or composite. Even though,users like to have control and to have a sense of freedom, it is important to provide landmarksand roadmaps or guides that enable users to be successful in navigating through the system.

 At the CITM, Yee (1999) designed a courseware entitled The Earth Movements incorporatingthese navigational tools.

Description of Earth Movements Tutorial  (Yee, K. F., 1999)

The purpose of this tutorial is for students to recognize and describe the various earthmovements resulting in natural phenomena such as volcanoes. An interesting feature about thiscourseware is that it enables students to engage in tasks or activities involving the comparison,selection and appreciation of the various types of earth movements.

Earth Movement Tutorial  is an application aimed to help students understand the mostimportant phases involved in the earth movements. The pages in this electronic book makesubstantial use of multimedia technology. It includes a navigation controller that enables linear (depth-first) and non-linear navigation . Non-linear navigation is achieved by selecting theappropriate menu buttons or by selecting the map button in the navigator controller. See Figure8.

Page 11: Enhancing Student Learning by Incorporating Visualization and  Navigation Tools

7/28/2019 Enhancing Student Learning by Incorporating Visualization and Navigation Tools

http://slidepdf.com/reader/full/enhancing-student-learning-by-incorporating-visualization-and-navigation-tools 11/12

Fi ure 8: Visualization Navi ational Ma Yee K. F. 1999  

The user location (where am I?) within the courseware is always explicitly posted through pageheadings and highlighted indicator buttons at the left of the chapter name in the navigator controller. Within the map, the highlighted block shows the last page visited by the user (See

Figure 8). These intuitive cues keep the user oriented throughout the tutorial.

Conclusion

Many organizations are now making increasing use of computers as support aids for teaching,learning and training processes. Invariably, the successful deployment of computer systems inthese pedagogic situations depends critically upon the use of appropriately designedinstructional software. Within such software the importance of end-user interfaces is paramountsince it is the interface subsystem that provides the basic mechanisms by which all human-computer information is exchanged. If these interfaces are not to mask or stifle the pedagogicprocesses they are intended to promote, they must be relatively easy to use, unconstrainingand supportive of the tasks that are to be undertaken within the given learning/training domain.This paper has considered some of the more important visualization and navigational tools that

are needed when designing end-user interfaces for use in instructional software - given that itsultimate goal is to develop rich cognitive structures that can handle demanding real-lifesituations.

References

Csikszentmihalyi, M. (1990). Flow: The psychology of optimal experience. New York: Harper Perennial.

Page 12: Enhancing Student Learning by Incorporating Visualization and  Navigation Tools

7/28/2019 Enhancing Student Learning by Incorporating Visualization and Navigation Tools

http://slidepdf.com/reader/full/enhancing-student-learning-by-incorporating-visualization-and-navigation-tools 12/12

Hartley, J. (1996). Text Design. In D.H. Jonassen (Ed.), Handbook of research for educationalcommunications and technology (pp. 795-820).New York: Simon & Schuster Macmillan. 

Hyerle, D. (1996). Visual tools for constructing knowledge. Alexandria, VA: Association for 

Supervision and Curriculum Development.

Khan, B. H. (Ed.). (1997). Web-based instruction. Englewood Cliffs, NJ: EducationalTechnology.

Levie, W. (1987). Research on pictures: A guide to the literature. In D. Willows & H. Houghton(Eds.) The psychology of illustration, volume 1: Instructional issues ( pp. 1-50). New York:Springer-Verlag.

Owston, R. D. (1997). The World Wide Web: A technology to enhance teaching and learning?Educational Researcher, 2 6(2), 27-33.

Pinker, S. (1984) Visual cognition: An introduction. Cognition, 18, 1-63.

Reeves, T. C., & Reeves, P. M., (1997). Effective Dimensions of Interactive Learning on theWorld Wide Web. In Web-Based Instruction, Khan, Badrul H. (Ed), Educational TechnologyPublications, New Jersey.

Thornburg, D. D. (1998). Brainstorms and lightning bolts: Thinking skills for the 21st century.San Carlos, CA: David D. Thornburg and Starsong Publications.

Toh. S. C., (1999). Designing Effective Interactive Multimedia Courseware: Use and Misuse.Proceedings of the Malaysian Education Technology Conference (META, 1999), PortDickson, Malaysia.

Windschitl, M.. (1998). The WWW and classroom research: What path should we take?Educational Researcher, 2 7(1), 28-33.

Yee, K. F. (1999). The Earth Movement Multimedia Courseware. Centre of InstructionalTechnlogy and Multimedia, USM.

Author’s Note: Dr. Toh Seong Chong is a lecturer at the Centre for Instructional Technologyand Multimedia, University of Science Malaysia. His research interests include InteractiveWeb-page Design, Multimedia Courseware Design and Rapid Prototyping of Courseware.For further details concerning this paper please contact: him at [email protected] or browsethe CITM Web-page URL http://www.ptpm.usm.my