Designing Instructional Web Sites

Navigation

Usability

Aesthetics

Accessibility
Dr. Watson
Bobby

Multimedia
Pictures & Sound
Animation
Video

Interactivity

Evaluation

Web Design

Copyright © 2001
Bonnie Skaalid
University of Alberta
bonnieskaalid@hotmail.com



 

 

 

 


. . .

Animation

Do's

used when time or movement is an integral part of understanding
animation (motion) can increase learning of a complex procedural task

used for:

  • explaining relationships between system components not normally visible
    • (iodine)
    • flow through electronic circuits
    • cellular processes
  • showing continuity in transitions
    • proving the Pythagorean theorem by animating the movement of various squares and triangles as they move around to demonstrate that two areas are the same size
  • indicating dimensionality in transitions
    • zooming boxes can indicate one screen was enlarged from another
  • illustrating change over time
    • showing population change by fading from one density map to the next over time
  • multiplexing the display
    • buttons which change color when the mouse rolls over them
    • help labels which appear when the cursor is on top
    • menus which pull down when you hold the mouse down
  • enriching graphical representations
    • an eraser icon which erases pixels to explain its function

 

Don'ts

 

do not use animations that continue endlessly


never use the Blink command