Module 9: Interactive Animation
Introduction: Animation and Interactivity
Educators—like us, in schools and government and business organizations—look to multimedia to make content interesting and to help learners comprehend.
Computer animation can aid learning in many content areas, including math, science, art, and foreign languages. Computer animation is useful when folks neeed to see concepts or perform actions that can be difficult to see or do in real life. In this tutorial, we will discuss interactive animation, look at some different types of interactive animation, value some of the advantages of interactivity, and try out the Cognitive Interaction Model.
Objectives
By the end of this module, you will be able to:
- Define interactive animation
- List some of the benefits of interactive animation for learning
- Describe several types of interactive animation
- Design an interactive animation
- Identify examples of regular and interactive animations
First, let's review what we mean by "animation" and "interactivity."
Connect:
What is animation?
We ordinarily associate “animation” with TV or movie cartoons. The word actually means to breathe the life into something. Cartoon animation involves the illusion of a moving image created by the consecutive display of series of static images. While there are different types of animation (for example, cell animation, claymation, and stop-motion), our focus in this module is computer (digital) animation. Computer animation works pretty much like cartoons or the other types of animations, by "flashing" a series of still images rapidly to create the illusion of motion. You'll find computer animation in computer games, educational programs, movies, and elsewhere.
What is interactivity?
This is a little more difficult, as people define interactivity in many different ways.
This tutorial focuses on human-computer interactions. We can think of “interactivity” as a dialog between user and computer. The user manipulates an input device such as a mouse or keyboard, which activates a computer application. The computer application responds to that action in the form of visual and/or aural output. In interactive learning environments, learners actively participate in learning tasks and receive immediate response or feedback. Appropriately designed, this can lead to greater interest, motivation, and accomplishment of learning outcomes (Sims, 1999).
What are the differences between regular and interactive animation?
Computer animation may be categorized as regular (continuous) animations and interactive animations. The differences between regular animation and interactive animations are:
| Regular Animation | Interactive Animation | |
|---|---|---|
Control |
Does not allow users to pause, stop, or rewind. | User can start, pause, stop, or rewind. |
Participation |
Does not allow users to participate. Users watch the same scenario continuously. | Users actively engage in the animation. They can select, move, or drag an object by using keyboard or mouse. |
Feedback |
Does not provide feedback. | Provides immediate feedback. |
Examples of regular animation:
Examples of interactive animation:
Why use interactivity?
In regular animation, users view but don't control the animation. Adding interactivity to this type of animation may help engage learners and enhance learning (http://www.sve.man.ac.uk/mvc/Research/Previous/icam/whatis/).
Jones and Scaife (2002) compare static and animated diagrams to demonstrate dynamic processes and their influence on cognitive interactions. They concluded that animated diagrams are more effective than static ones because learners show greater confidence and attention while working with animations. Nevertheless, learners did not respond clearly and completely to specific questions about the animations. The learners reported that animations were too fast, too complex, and lack user control. The researchers suggest that when animation presents complex information, let learners control the pace, repetition, and feedback.
Students often have difficulty understanding complex scenarios presented with video or still diagrams. Video can sometimes be more expensive to shoot or require large amounts of storage. In some cases, interactive animation can be used to present complex ideas more economically and with greater effectiveness. For instance, learners with little experience of hip surgery may have difficulty understanding it by reading a book or watching a video. However, interactive animation may help them grasp the basics: http://www.edheads.org/activities/hip/.
What are the advantages of interactive animations in education?
- Interactive animations allow students to learn intricate topics and help them enjoy the content.
- Interactive animations that have audio, graphics, feedback, and questions increase learner's interest in the topic and strengthen their skills.
- Interactive material makes it possible for users to see and manipulate things that cannot easily be shown and handled in other media (atoms, for example).
- Some scenarios are too hazardous to be practiced in the classroom, but may be practiced safely with interactive animation.
- Interactive animation may help provide learners approximate feelings of a real life experience.
- Interactive animation may help learners visualize a novel or abstract idea or situation.
- Learners improve practical skills by both watching and doing.
- It captures attention and motivates learners.
- Interactive animation may reduce cognitive load so learners can process instructional tasks more deeply using elaboration, organization, and other learning strategies.
Why is the cognitive process important in interactivity?
Probably the most important thing to remember about interactivity is that it is cognitive interaction that results in improved learning. To the extent that physical interaction (clicking, dragging, and the like) fosters cognitive activity (remembering, selecting, organizing, and integrating), it may enhance learning.
Think of interactivity as the interaction between inside (cognitive structures) and outside (physical, interface) representations.
Here is an example of an interactive animation designed to stimulate cognitive interactivity: http://edweb.sdsu.edu/canal/lockthru00.htm. (This is part of an experiment with 8 different treatments (versions) involving varying degrees of interactivity and feedback. The version you see here is the "full" version with all the interactivity and feedback.)
- The purpose of the animation is to teach learners how canal locks work.
- The users answer several questions at the beginning of the animation. This helps them enliven prior knowledge.
- During the animation, learners have control. They can interact with the animation in a variety of ways, including controlling the pace. This reduces the cognitive load for the learners, so they can organize the information well.
- The animation explains the activity as a step-by-step procedure and guides students to perform the steps using their mouse. This helps the students gain confidence and facilitates recall.
- After the animation, learners also answer questions. In this case they have the opportunity to connect new information to existing knowledge. Also these questions assist the learners to interpret the information they learned.
- The animation provides both visual and aural feedback.
- In terms of physical interactivity, it can be classified as drag and drop or release, mouse click.
Here are two more examples:
- http://www.mbayaq.org/lc/kids_place/tidepool/tidepool.asp. The instructional activity in this case is to find out which animals presented in the animation live in a tide pool. The behavioral process is to drag an animal object and drop it into the tide pool.
- http://www.classzone.com/books/earth_science/terc/content/investigations/es0602/es0602page02.cfm?chapter_no=investigation. The instructional event is to demonstrate the rock formation process. The behavioral process is a mouse click on an object and option.
Designing an interactive animation
Interactive Animation Examples
An excellent way to learn about interactive animation and its types is to examine some examples. First, look at some of these examples:
Knee surgery: http://www.edheads.org/activities/knee/
Room planner: http://www.jordans.com/roomplanner.asp
Simple machines: http://edheads.org/activities/simple-machines/index.htm
Earthquake: http://tlc.discovery.com/convergence/quakes/interactives/makeaquake.html
Meiosis: http://www.cellsalive.com/meiosis.htm
3D Catapult Designer: http://www.forgefx.com/demos.htm
Pheromones trails: http://www.forgefx.com/demos.htm
Math tutor: http://www.sci.sdsu.edu/mathtutor/demos.htm
Geology: Face your spheres: http://www.tki.org.nz/r/wick_ed/science/spheres.php
Fractions: http://www.learningmedia.co.nz/staticactivities/online_activities/flitting_with_fractions/
United States history: http://www.animatedatlas.com/movie.html
Music: http://pbskids.org/africa/piano/haveflash.html
3D Topographic maps: http://www.forgefx.com/demos.htm
Dance: http://www.bbc.co.uk/cbeebies/balamory/josie/danceathon.shtml
Anatomy of a Rover: http://www.pbs.org/wgbh/nova/mars/rover.html
Nasa: http://ic.arc.nasa.gov/destination/iss/flash/index.html
Maintenance: http://www.forgefx.com/demos.htm
Animal and plant cell: http://www.cellsalive.com/cells/cell_model.htm
There are plenty of flash projects: http://eduscapes.com/flash/explore.htm
Now, find some interactive animation examples that might be helpful as you design your own article for the Encyclopedia of Educational Technology. When you are searching interactive animation examples, you have an opportunity to practice the "cognitive interaction." Ask yourself these questions as you explore an interactive animation:
- What are the learning goals of the event?
- What type of cognitive strategies is used to provide meaningful learning?
- What kind of functional interactivity is used?
- Do you think the type of the animation is appropriate to teach the content expressed in the learning goals?
Here are some search terms when you are using search engines for the examples of interactive animations on the Internet:
- animation + interactivity
- interactivity
- interactive animations
- interactive animation types
As you looking for good examples, notice some examples of poorly designed interactive animations and figure out why you think they are less effective?
Designing an interactive animation
Let’s get started constructing an interactive animation. In this section, we will give you some hints that will be useful when you are planning your project. Consider the factors described below:
- Who is the target audience? What are the characteristics of your audience? Ages, demographics, etc.
- What is the content of your project? What are the opportunities of this content? Why do you think there is a need for this content?
- What are the purpose and the learning goals of the project?
- What audio, video, and visual elements will be included?
- What cognitive and meta-cognitive strategies would you like to use so that your learning task would be meaningful? (e.g., asking questions, interpretation, critical thinking)
- What kind of functional interactivity are you planning to use to meet the goals of your project? (e.g., mouse over, drag and drop, mouse click, manipulate the variables, etc.)
- What kind of feedback or guidance are you planning to provide for your users? (Text, audio, narrative)
Reflect: WHEW!
You've really accomplished a lot since beginning this course! You've participated in a team project to create a video program from scratch, and by now you've probably also tackled at least one of the multimedia tools you've selected to learn.
Shortly we'll begin another project, this one to build an educational multimedia web page. So this might be a good time, when the editing on your video is completed, to sit back with your Jonassen book and peruse some of the articles.
Don't forget to write about what you read for the course list serv .
More on interactivity
Some additional resources that may interest you:
- The rapid e-learning blog: 3 ways to define interactive rapid e-learning
Page updated June 12, 2012
