Make your own free website on

Animated GIFs in ImageReady 2.0
With ImageReady 2.0, Adobe has improved the production processes for creating simple animated GIFs. Like Photoshop, ImageReady uses layers to organize and compose graphics. In addition, a Frames palette provides a multicell canvas similar to a filmstrip. Animation is created by moving, editing, and turning on and off layers in each frame.

For any given layer, a frame will remember only three parameters: position, opacity, and layer effects. When you change the parameters on frames to create movement, the other layers will keep their original properties. If you want to change properties, such as scale or rotation, or apply a filter, such as Gaussian blur, you will have to create an extra layer in each instance to achieve your desired effect.

Organize Your Animation
Prepare your file by putting the art that you want to animate onto separate layers. In our example, we've put the letters C, H, O, and W on separate layers, since the hungry iguana will eat them at different times. Because we'll simply be changing the position of the letter, we will only need one instance of that letter on each layer, and ImageReady will remember the different positions on each layer. But we'll have to duplicate the iguana's jaw on a separate layer because we will be rotating and "physically altering" the pixels that compose this piece of art. By creating a frame with the jawopen layer turned on and the jaw layer turned off, and designating a quick frame delay below the frame preview box, we will produce the illusion of a hungry lizard.

  1. Open a file to animate. 
  2. Decide which objects you will animate and put them on separate layers. 
  3. Create as many frames as needed by dragging the first frame to the Duplicate icon in the Frames palette.

Copy Across Frames
After all this hard work spent creating the feeding iguana, we forgot to add the product shot! No problem. With the "Match Layer Across Frames" feature, you can wow the client with a quick turnaround.

  1. Paste and position your new art in the first frame of the animation. If needed, move your new layer up or down in the Layers palette to put it behind or in front of other objects. It helps to label your layers for quick reference. 
  2. Now select the layer, in this case Mighty Rex Can; go to the arrow in the upper right corner of the animation palette; and select "Match Layer Across Frames." This step will add a new layer to every frame across the animation. You'll now see the can of iguana food in your banner ad:

This technique is used to create motion in animation. Essentially, tweening uses a beginning and an end point to generate frames to connect the two points. If you're familiar with Macromedia Flash, this concept will be familiar to you. Tweening in ImageReady is quick and simple.

  1. Open a file to animate. 
  2. In the first frame, place the objects on separate layers that will have different animation paths. 
  3. Duplicate the first frame by dragging it to the Duplicate icon. 
  4. Position the layers so that they are where you would like them to end in the animation. 
  5. In the upper right corner of the Animation palette, select the Options arrow and choose Tween. 
  6. In the dialog box, choose Tween. If you are animating more than one layer, choose all layers and the parameters you'd like to animate. 
  7. In the same dialog box, enter the number of frames you would like ImageReady to create between frames. The more frames you select, the smoother the animation will be. Take into consideration that these additional frames will increase the file's size. 
  8. Click OK, and ImageReady will create the frames.