Creating Animated Gifs Using Layers in Photoshop 5 and Gif Animator 3

Part 3: Let's Color It!


Floodfill the Right Way
This is the fun part, but let me warn you:  there is only one way to do it correctly.  Each section of the animation that is the same color in each frame is colored with the floodfill tool (paintbucket) at the same time (unless you want to make a log of the RGB values.  I don't.).  This prevents annoying color shifts from occurring that detract from the quality of the cartoon.  The face and hands are colored in frames 1-23.  Then the next section, such as the monitor, is also colored in each frame in sequence.  If this regimen is followed, the coloring of the animation is quite simple.  However, after each floodfill is done, it is imperative that one look carefully at that section for parts of the cartoon that are missed by the floodfill .  That part must be colored by hand.

When the floodfill (paintbucket icon on toolbox) tool is selected, the default tolerance is 32.  That is good enough for most fills, but some places in the drawing are too narrow to allow the color to "seep in."  Upon examination, it is seen that some pixels are still pearly white.   We must give them some color by choosing the pencil tool.  Double-click the icon and and a properties dialogue box appears.  On the dropdown menu for options (whose default is "Normal") choose "Multiply."    This enables one to color an area without changing the black lines of the cartoon, which would really change things for the worse. At this point, enlarge the view of the frame by choosing Ctrl++ (the keyboard also has an = sign on it) or choose View>Zoom In.  This enlarges the frame so one can get a clear look at the uncolored pixels and fit the paintbucket into the pixel.  If one misses the pixel, whole parts of the drawing's black lines are  immediately colored something other than what was intended.  If this occurs (and it will!), choose Ctrl+Z.  That will undo the mistake.

Now carefully color the unpainted pixels, making sure to avoid recoloring adjacent colored pixels. As the name implies, the Multiply option on the pencil tool adds color to a pixel each time it is colored.  This could cause another kind of color shift that is not desirable. 

One Last Thing
Occassionally the merge-down actions that were done in the previous section of this tutorial cause a "graying" of the black lines  which make up the drawings.  If this happens, carefully do a floodfill of the grayed area with fully-saturated black.  This should solve the problem.

This clean-up is necessary after each small section is colored in each frame.  If it isn't done, it must be done in Gif Animator with its Pixel Editor, which has far fewer options than Photoshop, but is excellent for simple corrections that might have escaped notice in this phase of the animation's creation.

After following these directions, the results are a completely colored animation that has consistent color from frame to frame.  Click on the example at the right to get a fair idea of what this looks like. 

Time to animate this thing! We'll go to
the Animation Factory Site for that,
until I finish the last part
of this tutorial.

WB01343_.gif (599 bytes)To's gif animation assembly instructions


Elandee Home Page



bg6_icon.jpg (7434 bytes)





bg7_icon.jpg (1907 bytes)