• Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint


The most demanding aspect of cel animation is the drawing of individual frames, each of which varies very little from the previous one. An animation at 24 fps showing a character walking may require seven drawings per walk cycle.

Animating a Walk Cycle

The walk cycle is a typical goal in cel animation drawing. The cycle often broken down into 10 drawings— 5 for each step. The last frame is the same as the first, however, so you actually need to draw only nine frames. The number of drawings changes as the walk speeds or slows; you need more frames for a slower walk. Figure 4.5a shows two extremes of a single step, plus the three inbetweens. Notice the body's position relative to the baseline, and the registration point.

Figure 4.5a. Animating a walk cycle.

As a character walks in a walk cycle, its body remains basically in position, while the legs go through their motions. Notice, however, that the body rises as the leg straightens below it and dips as the legs angle to the front and back. This rise and dip are crucial to making a walk look normal; otherwise, the legs would grow and shrink during the walk.

Figure 4.5b. The entire walk cycle.

The step of the cycle duplicates the first step's frames, using the opposite legs (see Figure 4.5b). The last frame of the second step is the same as the first frame of the first step, so it isn't drawn.

In fact, however, cel animation drawing is not as terrible as it may sound. In the first place, inbetweening is much easier than drawing the original extremes, because you're drawing only relatively minor changes between the extreme poses. More important, for most of the history of animation, animators have used layers to simplify their work. This means that you draw every frame of a character's movement, but the background doesn't change. If you look at Disney or Warner Bros. characters, for example, you can see that the characters themselves are relatively simple. The backgrounds contain much of the detail in a given scene.

In traditional animation studios, the layout artists and director design the characters and scenes; the animators draw extreme poses for the characters; and assistant animators, also called inbetweeners, draw the frames in between the key frames. The animator may draw frames 1 and 5, for example, while the assistant animator draws frames 2, 3, and 4. This system ensures that the more skilled animator draws a character's major changes, while the assistant animator simply interpolates between the animator's drawings.

If you're not lucky enough to have an assistant, you'll be stuck doing the inbetweening, but by breaking action down into poses, concentrating on drawing frames halfway between poses, drawing frames between those breakdown drawings, and so on, the task becomes much less difficult, if not much less tedious.

Digital Drawing

Digital tools are available to replace a variety of traditional tools used in the drawing phase. These tools include animation software with built-in onionskinning tools, as well as highly versatile painting and drawing software that can be made to simulate onionskinning; as well as digital hardware that can replace the animator's drawing disk.


Onionskinning is the mechanical difference between cel animation drawing and standard figure drawing. In onionskin draw-ing, the artist uses semitransparent paper called onionskin, which resembles its namesake, and draws characters and objects one at a time on each sheet of paper, continually referring to the overlying and underlying drawings to make sure that the lines and motion of the character work from frame to frame. Overlapping two extreme drawings makes figuring out the inbetweens much easier.

Digital Onionskinning

Totally Hip Software's WebPainter integrates onionskinning, as does CastPainter, the company's product designed for creating Macromedia Director animations. Similarly, Meta-Creations' Painter (see Figure 4.6) has an onionskinning feature that allows you to clone images by using natural media-style brushes, and Macromedia's Director supports onionskinning for creating cast members.

Figure 4.6. Painter's onionskinning lets you see underlying frames of animation as you work.

In Photoshop and other paint programs that support multiple layers, you can simulate onionskinning by increasing the transparency of the current layer so that you can see the underlying layer (see Figure 4.7). When you finish a frame, you simply drag the transparency slider back to zero to view the completed frame. Similarly, in vector illustration programs with layers or floating objects, you can see objects as they overlap, and you can turn layers on and off to simulate onionskinning. This is not the same, however, as seeing a dimmed version of the underlying drawings, which stay out of your way visually when you are drawing new layers.

Figure 4.7. Photoshop's opacity slider doubles as onionskinning.

Animation Disk

The animation disk is a standard fixture in a cel animator's studio. The disk is a plastic, metal, or plywood circle, about 17 inches in diameter, with an translucent white-glass window mounted in the center and a backlight that can be dimmed or turned off altogether as you work. The disk is used like a drafting table, but as the animator works, he or she can rotate the disk to keep the drawing at the optimum angle for the most comfortable hand and wrist stroke at all times. Artists usually work with greater precision when their arm is resting on a solid surface so that they can draw with small movements of the hand, rather than with clumsy movements of the arm.

The translucent glass drawing surface and backlight allow you to see through multiple layers of onionskin, and turning off the backlight and turning on the overhead light lets you concentrate on the current drawing. Some animators switch these lights on and off so frequently that they use a foot switch to operate them, although I've found that a dimmer switch within in reach of my left (non-drawing) hand does the trick.

An important component of the drawing disk is the small strip of pegs along one or two edges of the drawing pane (see Figure 4.8). Onionskin paper is prepunched to fit over this row of pegs, so that each drawing is always exactly registered to the next and all the layers are held securely in place as the artist works. When the finished drawings are moved to a photographic reproduction device, such as a scanner or a copy camera stand, they are placed on another matching set of pegs; thus, the registration of each drawing is perfectly maintained when the images are scanned.

Figure 4.8. Drawing disk with sliding registration pegs.

My animation disk, from Chromacolour, has its peg bars mounted on two sliding rulers that can be locked down by tightening screw knobs. These rulers allow me to move subsequent frames of animation by precise increments when I animate moving characters. This allows me to keep frames of an animation super imposed as I do my inbetweening, but finished frames appear to move relative to the background. (I tape the first frame into position, slide the peg bar over by the predetermined distance, and draw the second frame. When scanned, the second frame appears to be offset by the measured distance.)

Frank Thomas and Ollie Johnston emphasized in their book the importance of drawing with the peg bars mounted on the bottom edge of the disk, rather than at the top. This practice allowed them to quickly flip through a stack of drawings with the fingers of one hand to visualize the motion of characters. They claim that this simple deviation from the norm (pegs at the top) actually gave them a great competitive advantage against other studios in golden age of animation, when cel animation techniques were first evolving, because it allowed them to fine-tune characters as they drew. Some artists, however, dislike the pegs' poking them in the hand as they work. (See Appendix A.)

Several companies supply drawing disks, as well as other animation equipment and supplies. I have included references to some of these suppliers on the book's Web site.

Build Your Own Animation Disk

To make an animation disk, you'll need a drafting table or other suitable drawing surface that's at least 2 feet wide and 2 feet deep, into the center of which you're willing to cut a 16 1/2-inch-diameter circular hole.

Figure 4.9 shows a simple schematic drawing of the parts of an animation disk.

You can substitute wooden dowels for a commercially made peg bar, and these dowels can be set to match the holes made by a standard three-hole punch.

Figure 4.9. Drawing disk with sliding registration pegs.

If you don't want to cut a hole in a table to accommodate a drawing disk, or if you're planning to do only a limited amount of cel drawing, you can get by with a simple drawing board, a sheet of opaque glass or plastic to draw on, and some kind of pegs to keep your drawings in alignment.

Pen Tablet

For artists who find it easier to see what they're drawing under their pencil tip than in front of them on-screen, but who want to eliminate the scanning step required by drawing on onionskin, an alternative is to use a digital drawing tablet with a pencil-tipped input device (Figure 4.10). I have one of the beautiful tablets made by Wacom Technologies Inc.; this tablet has transformed my ability to draw directly into the computer, which I used to find very frustrating. I attached a set of tape-on peg bars to the tablet, and I draw normally onto onionskin on the tablet. Although the device isn't backlighted, I can use it with one or two layers, which is an adequate substitute. As I draw, artwork is immediately input into my painting program of choice. Most programs, including Photoshop and Painter, support Wacom's erasing pen, which lets you erase pencil lines and get the corresponding effect on-screen. I keep the erasing pen handy for this purpose. Working this way is a little weird at first, but it eventually becomes second nature.

Figure 4.10. Wacom ArtZ II 12 × 12 tablet with nonmarking and mechanical pencil-tipped styli.

The cordless input stylus, or pen, on the left in Figure 4.10 features a mechanical pencil tip, which lets you draw on onionskin and have the lines input into your painting program. Also notice the taped-on peg bar along the unit's bottom edge. This peg bar lets you draw on onionskin, although without the benefit of a backlight.

A very expensive alternative to the Wacom tablet is the Wacom LCD tablet, PL 300, which lets you draw with a pressure-sensitive cordless pen right on your computer's video display. This backlighted unit is ideal for digital onionskinning, because it lets you draw directly on top of previous frames and it can easily be mounted on an animation-disk-style frame. The tablet, however, costs about $2,000.

Constructing a Peg Bar

If you're on a tight budget, you can construct your own peg bars and onionskin by purchasing a ream of translucent drawing paper from an office-supply store and punching it with a standard three-hole punch. Take a thin, flat piece of hardwood molding and sand the long edges down on one side, so that the mold ing slopes almost flush against a flat surface. Lay the edge of one of the prepunched pieces of paper over the wood strip and mark the hole positions.

Drill a hole into each spot and glue a short length of dowel into the holes. Make sure that you sand or file the edges of the pegs round, so that they don't catch on the paper holes. The objective is to make the strip so that the holes in the paper exactly match up to the dowels, preventing the paper from moving, stretching, tearing, bunching, or wrinkling. Leave enough room at the ends of the strip so that you can tape it to your tablet or scanner.

Limited Animation

Limited animation—as popularized in television cartoon series such as "Yogi Bear," "The Flintstones," and "Beavis and Butt-head"—uses animation of only critical components of a scene to create the impression of full screen movement. This technique is a lot like using paper cutouts of a character's body parts and animating them by pushing them around on a frame.

In limited animation, it's normal for only a character's mouth and eyes to move, even as other characters in the scene remain stock-still. (Occasionally, the character's head may nod slightly, or a hand may make a slight gesture.) This is a big time-saver over traditional cel animation, in which every one or two frames each frame of every character is a new drawing. The tradeoff is characters that look considerably stiffer and less lifelike than those in full animation. In full cel animation, for example, squash and stretch is used to animate the entire face for each move of a character's mouth in dialogue, and squash and stretch is often used for the body as well. In limited animation, the mouth often moves without squash and stretch in the rest of the face or body.

Often, limited animation uses automatic animation techniques to maximize the use of single drawings. For animation of characters walking, for example, the characters are sometimes filmed from the waist up, so that the legs are invisible, and the cutout characters are simply auto-animated across the screen with a slight bounce to represent the up-and-down movement of each step.

Animo, a very expensive cel animation tool, specializes in limited animation by letting you set up dynamic linking of drawing objects, as is common in 3-D animation systems. You can create a drawing for a horse character, for example, and then animate the horse by animating the digital skeleton of the character. The drawing actually bends and moves according to the movements of the skeleton.

To create a talking, limited-animation character in Photoshop or FreeHand, draw the character's face without a mouth; then create a series of layers containing the appropriate mouth drawing for each phoneme. You can create a frame of animation for each syllable of the character's speech simply by making the appropriate layer visible and then exporting a frame (see Figures 4.11a through 4.11b).

Figure 4.11a. He ...

Figure 4.11b. ... l …

Figure 4.11c. ... l …

Figure 4.11d. ... o!

Limited animation is a good approach for GIF animations, because you can save GIF files by using frame optimization, and only the part of the animation that changes from frame to frame is saved. This makes for a much more compact file than you get with full-frame animation.

  • Creative Edge
  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint