Thankfully, the "No Neck Joe" piece that I chose was divided into only three scenes - the intro title scene, the "meat" of the animation, and the closing scene. Flash allows you to divide your animation into scenes, which provides a convenient organizational system when authoring. The scenes show up in the program as tabs that can be arranged in any order, so if you're working on a project and want to move a scene to another spot in the animation, you simply grab the corresponding tab and move it to the new position. It didn't really apply to this particular animation, but it's a smart little feature nonetheless.
The opening and closing scenes had a series of colored bars, much like a TV test pattern, as a background. Fortunately I had a still frame of just the bars, so I opened Photoshop, resized the image, minimized the color palette, saved it as a GIF, and then imported it to Flash. I set the Pencil tool to draw rectangles, and, using the eyedropper tool to get the appropriate colors, recreated the background by "tracing" the rectangles of the original image. I then saved the background as a symbol, and deleted the GIF image.
With the background in place for two of my three scenes, I dropped in the remaining elements. The opening and closing credits all used the same font, but rather than track down the font Craig McCracken had used, I decided it would be easier, quicker, and more fun to manually trace the titles using Flash's paint tools. In most situations, I would advise against this, but creating the credits from scratch really seemed to lend itself to the cartoony feel of the animation. I set my pencil tool to smooth lines, and drew, as best as I could (remember, I was using the mouse through all of this) the shape of each character. I created two layers for each block of text - one for the black component, and a second for the white outline underneath. It's possible to create symbols with multiple layers, or even nest symbols-within-symbols, so I used this feature wherever possible.
The opening scene featured only the words "No Neck Joe," which wasn't too hard. But the closing scene listed the director, producer, and animator credits, so I made the executive decision to opt for a much easier "The End" and list the credits later in HTML text (which is a good example of the kind of economized thinking you have to do when converting animations for the Web). I then turned each block of text into separate symbols. A simple alpha transparency served as a fade-up from black, and then it was only a matter of popping the text in and out to complete the "scenes."
All that remained was to fill in the meat of the animation.
next page»
