ScoilNet Web Publishing Centre
Glossary
Using Animated GIFs
1 Details
2 Examples
3 Resources
4 Step-by-Step
Using Frames
Using Image Maps
Adding Multimedia
Using Tables
Using Animated GIFs - Step-by-Step

Tutorial
Creating an animated GIF

This tutorial will outline how to construct an animated GIF. The creation process is similar across many software applications, however during this tutorial we will focus on one particular graphic application. This application is called Animation Shop, and it is a module of the popular Paint Shop Pro 5, available for download from www.jasc.com or on many popular magazine cover-CDs.

Step 1 Run "Animation Shop"

In Paint Shop Pro 5, click FILE_RUN ANIMATION SHOP

We will use the "Animation Wizard" to help us through the process. Click FILE_ANIMATION WIZARD

Read and accept the default values offered at this stage by clicking Next in the subsequent dialog boxes.

Step 2 Choose your images for your animation

The following shows the images that will function as frames for your animation. The first image is highlighted in the screen-shot – face1.GIF.

Click Add image(Area 1.) and choose face1.GIF, the graphic you saved earlier. You will see your chosen graphic placed in the image list area (Area 2.). Now repeat this procedure and choose face2.GIF. Now click Next to finish the animation.

You will now see the frames of your animation as illustrated here in Animation Shop.

Notice the individual frames (Areas 1.) as well as the "selected" frame (Area 2.) which you can identify by its red top/bottom border. Right-clicking (or alternatively choosing EDIT_FRAME PROPERTIES) will give you access to fine-tuning settings which we will examine in more detail later.

Step 3 Save your animation

Now choose FILE_SAVE to save your animation. You will see this dialog box.

This dialog box invites you to specify a balance between image quality and size (Area 1.). Note also that by using the slider (Area 1.) you change the file quality/quantity characteristics (Area 2.).

Step 4 View your animation

You can now view your animation using the "View Animation" button in the toolbar.

Congratulations! You have created an animated GIF. There are however a few settings you can use to improve the presentation of your animation.

Step 5 Fine-tuning your animation settings

Your will see that the animation you have created is presently too rapid to be functional, but this can easily be adjusted by the fine-tuning process we mentioned earlier i.e. by right-clicking on a frame and choosing PROPERTIES. In the ensuing dialog try setting the display time to 50 milliseconds for both frames.

Note: The Duplicate function facilitates creation of a number of frames from one frame. The Image transition and Text transitionfunctions allow you to create special effects.