How to Animate a Picture in Adobe ImageReady

Animations have always been a popular way of attracting attention to a webpage. Whether a subtle design addition or a large rotating advertising banner, animated pictures can play a useful role in any website. An easy way to create an animation is to use software such as Adobe ImageReady, which allows you to create animated gif files. ImageReady encompasses many of the popular tools of Photoshop but with a greater focus on building animated pictures for use on the Web.

Instructions

1. Open Adobe ImageReady and create a new image by selecting "File" then "New."

2. Enable layers by selecting "Window" then "View Layers."

3. Create a new layer by using the "Create New Layer" icon at the bottom of the Layers window. Consider each layer as a separate frame in your animation. Select the new layer and draw your design onto the canvas using ImageReady's drawing tools.

4. Right-click on your first layer and select "Duplicate Layer." Draw your second frame on this new layer. Continue this process until you have built your entire animation on separate layers. You can hide the layers you are not working on by clicking on the eye icon next to them.

5. Show the animation palette by selecting "Window" then "Animation."

6. Click on the small arrow at the top right of the animation palette to bring up the animation menu. Select "Make Frames From Layers." Frames will be automatically generated that match the layers you created before. You can make changes to your animation by selecting the appropriate frame then editing its matching layer in the layers palette.

7. Click on the "Play" button to see your animation. You can save your animation as a .gif animation by selecting "File" then "Save Optimized As."

References

• Pixel 2 Life: Create Animated Gifs in ImageReady
• My Janee: Creating Animations in PS/ImageReady