Home > Articles

  • Print
  • + Share This
This chapter is from the book

Enhancing Your Frame-by-Frame Animation

Frame-by-frame animation can be a ton of work. Even with helpers like Onion Skin, it still requires that you draw each frame by hand. Just because it can be a lot of work doesn't mean it has to. For animation that has the same look as a feature animated movie, frame-by-frame animation is required, and it involves skill and patience. However, with a few tricks, you can pull off the same effects with a fraction of the work.

In this section, we look at a few tricks especially suited to frame-by-frame animation. You'll see more in Hour 21, "Advanced Animation Techniques."

Incorporating Pauses

There's no rule that says you must put a keyframe in every frame. If your framerate is left at the default 12fps (frames per second) and every frame is a keyframe, then the image changes 12 times per second. This may be unnecessary, and it becomes a lot of work when you consider the total number of frames you must draw. What if you don't always want the images to change every 1/12 of a second? Incorporating pauses is the answer—and it's very easy.

In the previous examples we inserted a keyframe in every frame, one after another. A keyframe is where you tell Flash that something new is appearing onstage. In addition, you're saying "this image should appear now and it should remain until a new keyframe comes." To incorporate a pause, you just follow a keyframe with a non-keyframe frame. If you want a 1-second pause (and you're running at 12fps), just follow your keyframe with 12 frames.

There are two ways to create pauses, either as you're making an animation or after you've made one. To incorporate a pause while creating an animation, either insert a keyframe (press F6) or insert frames (press F5) farther down the Timeline than the next frame. In Figure 7.8 you'll see five keyframes in a row, but then a pause was created by first clicking the cell in frame 11 and selecting Insert, Keyframe. The approach is slightly different when you want to edit an animation you've already created. To insert a pause (or increase one that already exists), click the keyframe you want to pause and select Insert, Frame. This effectively pushes out everything that appears later in the Timeline.

Figure 7.8 This frame-by-frame animation pauses after frame 5 because there isn't a keyframe until frame 13—therefore, nothing changes onstage between frames 5 and 13.

In a practical sense, pauses can enhance your animation. A pause can become a visual element of your animation. Suppose your stick man walks all the way across the stage; then you want him to walk back. You may want to include a pause when he's about to turn around. In Hour 21, we'll see how pauses can cause the audience to anticipate that a change is about to happen, which makes them pay closer attention.

Implying Motion

Two frames are all you really need for an animation. Suppose that Mr. Stick Man begins on the left side of the stage in frame 1. The next frame is a keyframe, and he's all the way over on the right side. Show this "animation" to enough people, and you'll find some who swear that they actually saw him move across the screen. In the real world there's no way to get from one place to another without traveling through all points between, but in animation, you don't have to draw every step.

To prove the two-frame theory, just make a simple animation of our stick man kicking a soccer ball. Draw a stick man in frame 1 with a ball near his foot. In frame 10, insert a keyframe and move the ball off to the right. Extend his leg so that it looks like he just kicked the ball. It's pretty amazing, but it looks convincing. If you add just one more keyframe at frame 4 and move his leg back a tad (as if he's about to kick), the animation looks great! Stick man stands (pause), he winds up (pause), and he kicks. Imagine how much more work it would have taken to draw all 10 frames.

Figure 7.9 With just three keyframes, we can make an effective animation that implies more motion than is actually occurring.

Creating implied motion is a great skill. In a way, we're trying to fool the audience, but it's more than that. Unnecessary animation is more work and can actually detract from your core message. It's hard enough to tell a story with animation—the last thing you need is a distracting animation that's superfluous.

The Flicker Effect

How do you make something blink? You just need one keyframe with an image in it, followed by another keyframe with nothing in it (also known as a blank keyframe), followed by another keyframe with the original image in it. There are several ways to do this, one of which is demonstrated in the following Task.

  • + Share This
  • 🔖 Save To Your Account