Adobe Flash CS4 Professional offers several ways to include animation so that you can make things move in your SWF files. For example, you can create tweened animations using the Timeline and Flash workspace, apply motion presets to a selection on the Stage, or, if you're so inclined, even make instances animate using ActionScript code.

If you have used previous versions of Flash, you will quickly notice that the way you animate has changed in Flash CS4. Don't be scared. First of all, it's easy. Secondly, there are many advantages to the new motion model, and you can do a lot more in your animations.

So if you've used animation in earlier versions of Flash and need to understand the changes, why they occurred, and migrate your skillset, then go read Motion migration guide for Flash CS4 Professional. If you just need to know how to use the animation features of Flash CS4, read on. If you're brand new to Flash, and want to get a quick overview of the core features and workspace, you might want to check out Creating a simple document in Flash CS4 Professional.

Requirements

To make this most of this learning guide, you need to install the following software and files:

Flash CS4 Professional

• Try
• Buy

Sample files:

• motion-is-awesomer.zip (ZIP, 16 MB)

Prerequisite knowledge

A basic knowledge of the Flash workspace.

Creating animations with Flash CS4

There are several ways to create animations in Flash:

• Create motion tweens and eases: To create motion-tweened animations, you create a tweened instance on a span of frames, and then make one or more changes somewhere on that span of frames. Flash then creates the animation that would occur to transition between those changes. Flash varies the object's size, rotation, color, filter, or other attributes between the changed frames you made to create the appearance of movement or motion, such as an instance moving across the Stage or fading in and out—or both at the same time. You can also use eases (preset eases or your own) to control the movement or appearance of your instances. To learn more about creating motion tweens and using eases, see Animation Learning Guide for Flash: Motion tweens and "Adding preset and custom eases to motion tweens" in Animation Learning Guide for Flash: Preset and custom eases.
• Create frame-by-frame animations: In frame-by-frame animations, instead of letting Flash automatically fill in the movement between two changes, you create the image in every frame. This is much like a "flip book" animation in which you draw each subtle change manually, and when the images are watched in succession, the subtle changes create the illusion of movement. For more information, see "Creating frame-by-frame animations" in Animation Learning Guide for Flash: Frame-by-frame animation.
• Apply motion presets: Motion presets include numerous pre-made animations that you can apply to instances on the Stage, which you can use as-is, for learning purposes, or as a starting point for further modification. Motion presets make it easy to animate a selection: you can simply make the selection, then choose a Motion Preset and click Apply. With motion presets, you can make things move in your document with pretty much no knowledge of animation. For information on motion presets, see Animation Learning Guide for Flash: Motion presets.
• Use tween instances: A very useful feature where you can give a motion tween an instance name and apply that motion to other instances in your document. For more information on using tween instances, see "Using Tween instances" in Animation Learning Guide for Flash: Using ActionScript 3.
• Copy ActionScript 3 code and apply it to instances in your document: If you don't want to write code at all, you can create animation on the Timeline and then "copy" the equivalent ActionScript 3 code for that animation and apply it to an instance. See Animation Learning Guide for Flash: Using ActionScript 3.
• Create shape tweens: Shape tweens are used to create morphing movements, such as paths that bend, or circles that change into squares. For information on creating shape tween animations, see "Creating shape tweens" in Animation Learning Guide for Flash: Shape tweens.
• Use inverse kinematics: You can make things move in Flash CS4 using the inverse kinematics (IK) feature. As much as we think IK is kind of cool, the Animation Learning Guide for Flash doesn't cover this feature. However, if you want to find out more, watch the IK screencast tutorial by Todd Perkins on Adobe TV or read "Animating with the Bone tool" in Creating animation in ActionScript 3.
• Write ActionScript code: You can create animation by writing ActionScript code—sometimes called "scripted animation." There are different ways you can manually script animation: writing ActionScript to handle all aspects of the animation or using prebuilt classes and simpler code to create animation. This Animation Learning Guide for Flash does not cover scripted animation. You can learn about scripted animation in the article, Creating animation in ActionScript 3.

Where to go from here

The Animation Learning Guide for Flash shows you how to use all of these animation types in Flash CS4 Professional, including the new and improved way of creating and editing motion tweens. If you like to animate, or just need to use it, read on. In fact, you would be crazy not to continue reading this guide.

After reading this gigantic guide to just about everything you could want to know about the functionality of animating with Flash, you will be ready to go forth with your imagination and create amazing cartoons, interactive applications, or whatever else you want force upon the interwebs.

Obviously, there's a lot more that Flash can do, even when it comes to animation. You can use scripted animation in your SWFs, or use inverse kinematics to move characters around, or learn about specific animation techniques on blogs or from your friends. Visit the 3D/Animation section of the Flash Developer Center to find the latest articles on animating with Flash.

About the authors