My first order of business was to create baseline symbols for each of the characters and the background elements. I imported the first still image of the scene into Flash and used the handy Trace Bitmap feature (not to be confused with the manual tracing I did earlier). This function analyzes a bitmap image and converts it to vectors which can produce somewhat uneven results. In the case of "No Neck Joe," the film grain of the animation left unpleasant artifacts that rendered the vectored image more or less useless. So once again I resorted to tracing, treating the scene in much the same manner as I did the opening and closing text. It increased my workload significantly, but also allowed me to make sure that every single element used only the barest minimum of vectors. I was very careful to isolate everything on its own layer so it'd be easy to create symbols later.
Once I had that initial still image traced, I broke it down into its component elements. This meant isolating the individual characters and background elements of the scene, and saving them as symbols - six symbols all told.
Luckily, three of the six main symbols were background elements and didn't change over the course of the animation, and two of the three remaining symbols were characters who barely moved. However, the third character, No Neck Joe, was a different story. Since he moved quite a bit throughout the animation, I had to break him down into a series of "children elements" - body parts such as torso, eyes, pupils, mouth, right arm, and left arm - which I turned into symbols and nested them under the "parent" No Neck Joe symbol.
My next task was to isolate all of Joe's pertinent keyframes. Over the course of the animation, Joe's happy smile turned to a frown, and then an angry snarl. He also blinked, squinted, and knitted his brow. The challenge was to find the most efficient way to create these expressions. Many were just pairings of different sets of eyes and mouths, and could be reused several times. And making Joe look right or left, up or down didn't involve symbols at all. It was simply a matter moving his pupils.
Even with these labor-saving techniques, animating Joe still required over twenty-five children symbols. Trying to manage all these symbols revealed one of Flash's UI limitations: it doesn't readily differentiate between parent symbols and their children, and it can be very difficult to keep track of things once you start working with a volume of nested symbols. The PC version of Flash also has a bug that prevents the pull-down list of symbols (when in "edit symbols" mode) from scrolling down to reveal the symbols that "fall off the page" (i.e., further down in the alphabet). This forces you to use the tab menu on the far right side of the screen, which only allows you to scroll through one symbol at a time. Tedious.
Whenever I located a unique facial component for Joe, I would crop the still image to frame only that particular expression. I would then import it into Flash, position it on Joe in the proper place, and create a symbol by tracing the articulation.
Once Joe was fully articulated, I set about animating him. Since every symbol can also be a sub-sequence, I decided to animate Joe within the parent Joe symbol. This might seem counterintuitive, but I wanted to keep the main animation scene as clean as possible by only working with the six original symbols (which represented over fifty children symbols). Having that many symbols all occupying the same 640 by 480 space can get pretty messy, and the chances for screwing up the animation rises dramatically.
Luckily, there was very little interaction between the characters in this animation, so the sub-sequence approach worked well (as long as I made sure each sub-sequence was the same length as the scene sequence). If I had to work with an animation that featured interacting characters, however, I would have to animate each parent symbol individually, without the context of the stage or other characters. This could prove impossible. It would be really nice if Flash provided for some way to edit subsequences from the stage, rather than the symbols environment. Hopefully, with sufficient prodding, future releases will support this feature.
Since I didn't have a QuickTime movie to use as an animation reference, I had to use the still images, which I had the foresight (thankfully) to number sequentially. I looked at each image in Photoshop to figure out how Joe had changed since the last still frame, and then adjusted the sub-sequence accordingly. I used my own discretion to figure out how long Joe held any particular expression, adding or deleting frames whenever an expression seemed too long or short. Whenever I wanted to turn off the visibility of an expressive component, I would insert a blank keyframe in the layer of the component. And when I wanted to make a new articulation visible, I merely added a keyframe in that layer. Considering the number of keyframes I used, the sub-sequence process went surprisingly quickly. That said, next time I'll make damn sure I have a QuickTime on hand because I have qualms about deviating from the original animator's exact pacing.
With Joe animated, the piece was really beginning to take shape. All that I had left to do was articulate the remaining two characters, which wasn't too difficult since they sit motionless on the stage for about ninety-five percent of the animation. In fact, all they did was look down (at a fallen Joe), smile, looking at each other, and give each other the thumbs up, which required about ten child symbols each. The work was very similar (if more simple) than animating Joe, but I now had to be careful to time their sequence accurately with Joe's. Several hours later, I was ready to watch the animation play out in its entirety.
