Creating Animated GIFs:
A Learner's Guide
Aim:
The aim of this lesson is to provide teachers with the knowlege and
skills necessary for them to be able to design, create, and publish animated
graphics on the World Wide Web.
Rationale:
"A picture is worth a thousand words." How many words is a moving
picture worth?
Textbooks are filled with pictures, charts and graphics because these
graphic elements can convey ideas in a different way than words can.
So much of the real world involves motion; how much better can a
moving picture represent real-world ideas and information than a static
graphic.
So much animation on the World Wide Web today is used to add
"cuteness" to a page rather than to convey real information that the usefulness
of this media is often overlooked. Animations can be a powerful tool in working with
students who are visual learners. For example, a math teacher might use an animated GIF
to demonstrate the idea of a derivitive, showing a graph with a chord between two points
that approaches the tanget of the curve as the interval between the two points gets
progressively smaller.
Objectives:
At the end of Part I of this workshop, participants will have the knowlege
and skills necessary to construct an animated gif from a series of graphics
that are in gif format.
At the end of Part II of this workshop, participants will have the
rudimentary knowlege and skills necessary to create a series of frames
from which an animated gif can be built.
Audience:
This lesson is written for the beginner web designer, in particular
for teachers wishing to create web pages that will enhance their students'
learning experiences.
Pre-requisites:
It is expected that participants in this workshop are comfortable with
the following computer skills:
Part I:
- basic mouse skills: single-click (to select objects), click-and-drag
- and drag-and-drop (to move objects), double-click (to open objects)
- manipulation of windows on the desktop (opening, closing, repositioning,
- resizing)
Part II
- rudimentary knowlege of a graphics software package such as Adobe Photoshop.
Learner's Guide |
Background Reading |
Download Frames
Putting Frames Together |
Creating GIF Frames