How to make an animated GIF image

Creating an animated GIF, as shown in the example below, requires an image editor with this extra ability. In this document we'll be explaining how to create an animated image online as well as in Photobie, an excellent and free image editor but an editor with these capabilities.

Computer Hope animated gif

Important things to know

Before following the steps involved in creating an animated image, it's important to keep the below things in mind.

  1. The completed animated image must always be a .GIF image, .JPG or .JPEG images do not support animation.
  2. An animated image is comprised of multiple images. Each of these images must be the same size.
  3. The image should not exceed 256 colors.
  4. Internet browsers can be set so animated images are not seen. If disabled the visitor would only see the starting frame. Keep that in mind.

Creating an animated image online

Before creating an animated image online you must first have each frame of the animated image you want to use. If you have not yet done this we suggest first creating each of the images you want to use in the final animated image. If you do not have an image editor on the computer you can use Photobie as recommended below to create your images or use one of the other image editors.

Once you have your images created, visit the web page and upload each of the images to the web page.

Note: At the time of creating this document the website required the images be uploaded in JPG format but finalized with an animated GIF.

Creating an animated image using Photobie

  1. Download and install Photobie to your computer.
  2. Once the program has been opened, open each of the images you want to use in your animated image.
  3. Determine one picture that will be your starting frame and then select the image that will be the next frame. Click Region and then Select whole image region or press CTRL+A to select the complete image.
  4. Click Edit and then Copy or press CTRL + C to copy the image.
  5. Select the picture that you determined to be your starting frame earlier and then click Edit and then Paste as new layer or CTRL + V.
  6. Once done you should have a new layer in the starting frame. Repeat steps 3-5 for each additional image (frame) you want to use in the animated image.
  7. Once all images have been added as layers into the starting image, click GIF_Animation and then Animation Control Panel.
  8. In the Animation Control Panel you should see each of the layers. If you do not, click the green arrows to refresh the image view. Clicking the green box with a play triangle in it will play the animation. If it's going too fast select one of the frames and increase the millisecond delay time.
  9. Once the animation looks good click the blue diskette icon to save the animation.

Additional information

  • See the GIF89a definition for further information and related links.