This article talks about the differences between hand-drawn lighting effects, and the automatic version you can do using Flash 8, Photoshop, After Effects and other image/paint and compositing software.

Hand-Drawn Light

In special effects animation, the shady area of an animated element such as a character’s skin, is called the tone. So called because it’s a darker tone, or shade of the skin colour.

Just two colours for each element: Base and tone

Technically a lighter equivalent should be called a tone as well, because it’s a lighter tone… but in animation terminology a tone’s light counterpart is generally called a rimlight. A good example of a rimlight is the silver lining on a cloud. It’s created when the character/element is in front of the lightsource, even if only slightly. Here’s the same image as above with the rimlight added to the character.

Now he’s got tone and rim for each of his base colours (except the eye).

Yet another type of lighting effect is the highlight. This is a reflection of the lightsource, usually bouncing off high-gloss surfaces, like eyeballs, wet elements, shiny hair, etc. So here’s the same image with all of those lighting effects put together.

Notice again how all of these lighting effects show the volume of the character.

In my work you’ll usually see at least two colours for each element. For example, ever since the ‘Prowlies’ movie, Bitey’s fur usually has at least two colours: base colour and tone. In LittleFoot however, I went nuts with his lighting effects and Bitey had four colours for each element:

  1. Skin: Base, tone, rimlight, underlight (sometimes highlight)
  2. Fur: Base, tone, rimlight, highlight (sometimes underlight)
  3. Horns/Hooves: Base, tone, highlight
  4. Teeth: Base, tone, highlight
  5. Tongue: Base, tone, various highlights

As you can see from the images above, when you create these lighting effects by hand, you have ultimate control over them. They can be used to show contours, such as muscle and bone structure (Bitey’s ribs, above), as well as depth and volume (clumps of fur, ridges on horns).

Automatic Light

In the daily routine of a special effects animator, the task of animating tones and rimlights is probably the most common. It’s one of the first things an effects animator learns to do, and so as your skills grow and you progress toward learning new and more interesting effects (smoke, explosions, magic, fire), the simple tone and rimlight effects are soon considered the most boring and tedious.

There are digital ways to create what’s called an offset rimlight. It offers very little control over the lighting effect, but it can save a lot of time if used cleverly.

Offset Rims in Flash

If you use Photoshop, After Effects or any program other than Flash, then you might be able to work out how to achieve this effect on your own. Here’s how I do it in Flash though.

  • First of all, the element must be a movieclip symbol, because we’re using Flash 8’s Filters (no, the following cannot be done in earlier versions of Flash).

In this example, I’m applying an offset rim to a column of dark smoke. There is no inner detail drawn on the column.. it’s just a flat object painted with one colour.

Now, once the element is a movieclip symbol, you can select it on the stage and apply the following filters through the Filters tab (Window > Properties > Filters).

  1. Click the blue ‘Add Filter’ icon, then choose ‘Drop Shadow’.
    A default black shadow appears below and behind your smoke column.

    We want this drop shadow to appear INSIDE the smoke.. not behind it. To create a convincing rimlight, we also want it to be a lighter colour.

  2. Check the ‘Inside Shadow’ box and the shadow will now be inside the smoke column.
  3. Change the colour of the Drop Shadow (which you could now call a tone, or rimlight). In the image below, the colour I chose for my rimlight was a lighter version of the sky. This makes a more realistic ambient rimlight effect.

  4. Experiment with the other values in the Filters panel. Increase the blur to get the ambient effect, rotate the angle and watch how it affects the whole thing. You can also add more drop shadows for multiple lighting effects. In the example below, I’ve added a firelit offset rim.

— — —-
Once again these digital effects should be used carefully because they have a very mechanical feel. Experiment with them though and you’ll learn what you can get away with, to make your lighting effects animation easier.

Finally, you will eventually see the limitations of using a digital offset rim. The internal detail on Bitey’s body (ribs, fur, horns) were created with hand-drawn lighting effects. These cannot be done with offset rims.

Likewise, if you wanted internal detail (billowing clouds) on the smoke column, you’d need to draw it. However, if you see fit you can combine the digital with the hand-drawn effects to get exactly what you want. Ah, the possibilities..