Creating Video-Quality Animationwith Macromedia Director
Creating Video-Quality Animation
Though Macromedia Director is intended
primarily as an authoring tool for computer-based multimedia, it can also be used
to create broadcast-quality animation and visual effects for TV and video programs.
(In fact, this is one of the uses for which Director was originally designed, before
its interactive capabilites were expanded.) Using Director in video production does
involve some technical hurdles, however. The technology used to produce TV images
is significantly different from that used to produce computer images. Although Director
can produce top-quality images on a computer screen, getting it to produce high-quality
TV images demands specialized hardware and some unusual authoring techniques.
Part 1: Scan Converters
Attaching a Monitor to a Scan Converter
Working with a Scan Converter
"Legal" and "Illegal" Colors
Using the NTSC Palette
Importing Graphics from Other Applications
Increasing Contrast
Dithered Images and Custom Palettes
The broadcast video standard used in North America is called NTSC (for National
Television Standards Committee, the group that devised the standard in 1953). Other
broadcast standards, such as PAL and SECAM, are used in other parts of the world.
The discussion here will focus specifically on NTSC video, though the same basic
principles hold true for the other broadcast standards as well.
The images on your computer screen are digital images -- that is, every pixel
that makes up the image is individually defined in terms of hue, brightness and saturation.
By contrast, NTSC is an analog format, in which variations of brightness and
color are represented by fluctuations in an electromagnetic signal. These fluctuations
control the output of three electron guns, which sweep from left to right across
the TV screen. Each sweep of the guns represents one scan line.
An NTSC image consists of 525 scan lines. The lines are interlaced -- that
is, the television first draws all the odd-numbered lines and then draws all the
even-numbered lines. (Each of these sets of lines -- the odd-numbered lines and the
even-numbered lines -- is called a field.) Because the TV displays each field
very quickly (at a rate of 60 fields per second), your eye is fooled into thinking
you see all 525 lines at once.
In order to convert your computer's video output into an NTSC signal, you need a
device called a scan converter. Some computers, such as the Macintosh AV models,
come with scan converters built in. Others allow scan converters to be added via
a plug-in card or external device. Depending on its quality, a scan converter may
cost anywhere from a few hundred dollars to many thousands of dollars.
Scan conversion is a tricky business. The standard full-screen Director movie is
640 pixels by 480 pixels; the NTSC screen is 525 lines. Therefore, there's no one-to-one
correspondence between the pixels of the original image and the scan lines of the
NTSC image. The scan converter must add and delete pixels on the fly to make the
image fit. The inevitable result is a loss of image quality.
Converting a non-interlaced image to two interlaced fields presents additional problems
-- especially if your Director movie contains horizontal lines that are one pixel
thick. Depending on the locations of the lines, the scan converter may place some
of them in the odd-numbered field and others in the even-numbered field. The result
is a noticeable, annoying flicker on the TV screen as the two fields alternate.
The most expensive a scan converters contain complex circuitry that will correct
for these problems. Generally, however, you can get away with using a relatively
inexpensive scan converter if you prepare your Director movies according to the guidelines
in this article.
Return
Once you've installed a scan converter in your computer, you'll need to attach
a TV monitor. Many consumer televisions these days come with video and audio input
jacks. If your TV has such jacks, simply run a standard video cable from the scan
converter's output jack to the TV's video input jack. (If you plan to include sound
in your Director movies, you'll also need to run an audio cable from your computer's
sound card to the TV's audio jack.) If your TV doesn't have video and audio jacks,
give it away and buy one that does.
If you're serious about video production, you may want to use a professional NTSC
monitor instead of a consumer TV. Professional monitors generally have better image
quality and a variety of controls that allow you to adjust the image more precisely.
In addition, some scan converters can output video in Y/C mode (sometimes called
S-video) or component mode, which offer a much sharper image than the standard composite
mode. If you have such a high-end scan converter, it pays to buy a monitor with Y/C
inputs so that you can take advantage of that increased image quality.
If you plan to record your Director movies directly to videotape, you'll want to
plug the cables from your computer into the video and audio inputs of your video
recorder. Then plug your monitor into the video and audio outputs of the video recorder.
Return
Most scan converters come with driver software that allows them to work properly with your computer. The software usually includes several user-configurable options. The following are suggestions for setting these options to work best with Director.
Whenever you're working on a Director movie that's intended for NTSC output, do
as much of your work as possible directly on the TV monitor. (The best arrangement
is to put your stage on the TV monitor and keep all your other windows on the computer
monitor. To do this, go into Preferences, select a stage size of 640 x 480, and select
Screen 2 for the stage location.) By working directly in NTSC, you'll avoid the surprises
-- such as unexpected flicker or color changes -- that often occur when a computer
image is converted to NTSC.
Return
In the early days of television, limitations in glass-manufacturing technology
made it impossible to produce a rectangular picture tube. Instead, round picture
tubes were masked off to produce the illusion of a rectangular screen. Because the
TV picture tended to be distorted near the curved edges of the tube, the mask was
designed to be somewhat smaller than the actual image area. In effect, the TV screen
was cropping the edges of the image -- a process called overscanning.
Overscanning persists even on modern TVs, primarily because viewers are used to it.
(If TVs didn't overscan, there would be a black border around the edges of the image,
just as there is on most computer monitors.) When you create Director movies for
NTSC, you must keep in mind that the outer areas of the stage are going to be lost
to overscanning.
What makes this more of a problem is that the degree of overscanning varies from
one TV set to another. Low-cost manufacturing techniques, along with changes that
take place as a picture tube ages, mean that the image on one TV might be severely
cropped and skewed to the right, while the image on another TV might be barely cropped
at all but skewed toward the bottom. The difficulty -- not just for Director users,
but for anyone who creates video images -- is to make sure that all important elements
on the screen will be visible on all TV sets.
To
get around this problem, video engineers have defined two "safe areas":
Action Safe and Title Safe. The Action Safe area is the area that's visible on most
TV sets. It's roughly defined as 90% of the image area, which translates to a 576
x 432 rectangle on a 640 x 480 Director stage. The Title Safe area is a subset of
the Action Safe area; it's the area that's likely to be visible on even the most
badly adjusted TV sets. It's roughly defined as 80% of the image area, or a 512 x
384 rectangle on the Director stage. (The official formulas for specifying these
areas are much more complex, but the 90% and 80% figures are commonly used rules
of thumb.)
When you compose an image for NTSC output, you'll want the background to extend to
the edges of the 640 x 480 stage area. Any visual elements that appear over that
background should be confined to the Action Safe area, and any on-screen text (or
text-like elements, such as logos) should be confined to the Title Safe area.
The easiest way to meet these specifications is to create a reticle -- an
overlay resembling the illustration above. Create your reticle on a white background,
place it in the bottom channel of the score (so it won't be blocked by any other
sprites), set the ink effect to Background Transparent, and in-between it for the
entire length of your movie. With the reticle in place, you'll easily be able to
keep your sprites within the proper areas. If you want to see what your movie looks
like without the reticle, click the button to the left of the bottom channel to make
it invisible.
Return
When RCA began commercial TV broadcasting in 1941, TV was strictly a black-and-white
affair. Almost immediately, RCA, CBS, and others began working on ways to broadcast
in color. The best way would have been to scrap the existing system and start over,
but nobody wanted to tell the thousands of TV owners that their sets were suddenly
obsolete. The result was a compromise: in 1953, the National Television Standards
Committee proposed a standard by which color information could be added to the existing
black-and-white broadcast signal. The advantage was that programs broadcast in color
could still be seen on black-and-white TVs; the disadvantage was that the images
on color TVs would be somewhat muddy and difficult to control. (A joke sprang up
among broadcast engineers that NTSC stands for "Never Twice the Same Color.")
Today, we still live with that legacy.
Many Director users are horrified to see their sharp, brilliant colors (left, top)
reduced to unpleasant, fuzzy blobs when their movie goes through the scan converter
(left, bottom). Get used to it: no matter how expensive your hardware, your movies
will never look as good on the TV screen as they do on the computer screen. Once
you've accepted that fact, you can do what's necessary to optimize your graphics
for NTSC output -- even if this requires altering your artistic vision.
Return
The NTSC standard includes strict color specifications -- colors which fit these
specifications are considered "legal"; colors which do not are considered
"illegal." Illegal colors may bleed, tear, or appear fuzzy on the TV screen,
and they may even interfere with the audio portion of the TV signal. Pure black and
pure white are illegal colors, as are deeply saturated reds and blues.
Unfortunately, there's no easy way for a computer user to know whether a color is
legal. Just because a color works fine on your TV doesn't mean it will work fine
on other people's TVs -- especially if they're looking at an edited videotape that's
several generations away from the original.
The following are some possible techniques for making sure you're using legal colors:
Use
an image-editing program that includes an NTSC filter. The best such program
is Adobe Photoshop, which can detect colors that
fall outside the NTSC specifications (right, top) and automatically replace them
with the closest possible legal colors (right, bottom). Many other image-editing
programs also include NTSC filters -- however, not all of them are as reliable as
Photoshop's. (The "NTSC Video Safe" filter in Microfrontier's
Color It!, for example, will adjust a color's brightness to bring it into legal limits,
but does not affect hue or saturation.)
The NTSC
palette (left) is one of nine color palettes that are built into Director. Despite
its authoritative name, this palette does not include all legal NTSC colors. It's
simply an arbitrary collection of 254 colors that the developers of Director considered
suitable for NTSC video. (Pure black and pure white are included in the palette because
the Macintosh operating system requires them. Don't be misled into thinking that
black and white are legal colors -- they're not.)
If you want to create castmembers using certifiably legal colors, the NTSC palette
is a convenient tool. Keep in mind, however, that there millions of other legal colors
that are not included on the palette. Therefore, if you're seeking free artistic
expression, the NTSC palette may be unnecessarily limiting.
It's easy to create castmembers in Director using the NTSC palette: simply select
"NTSC" from the Palette window, open the Paint window, and draw.
If you want to create castmembers in another application (such as Photoshop), but
you still want to use Director's NTSC palette, the procedure is a bit more complicated:
This procedure not only saved your image, but it saved the NTSC palette as part
of the file. You can now import the newly created file into Photoshop (or your paint
program of choice) and follow your program's recommended procedure for saving the
palette. (In Photoshop, choose "Color Table" from the Mode menu and then
click Save.) Then close and delete the imported file. From now on, Director's NTSC
palette will be available for use in your paint program.
Note: Don't try to simplify the above procedure by skipping the Export step. You
may be tempted to copy your castmember from Director to the clipboard and then paste
it directly into your paint program. If you take this shortcut, however, the castmember
will automatically be remapped to the System palette, thus defeating the purpose
of the whole exercise.
Return
Whenever possible, it's best to create your castmembers from scratch using legal
NTSC colors. There will be times, however, when you need to include existing graphics
-- such as photographs or clip art -- in your Director movie. These files are likely
to include some, or many, illegal colors.
The preferred way to handle these files is to open them in Photoshop (or another
image editing application with a good NTSC filter), convert the illegal colors to
legal ones, save the file in PICT format, and import it into Director.
If the file you want to use is a simple drawing -- for example, line art with flat
color fills, with no blends or gradients -- you can probably get away with importing
it straight into Director. Just follow these steps:
The imported image will appear in the first available slot in the cast window,
with its colors remapped to their closest equivalents in Director's NTSC palette.
If you want to use a pre-existing graphic that includes gradients or blends -- for
example, a scanned photograph or painting -- do not follow the preceding steps.
Remapping the colors without dithering would cause the gradients to be transformed
into bands of flat color, giving the graphic a "posterized" look. (On the
other hand, remapping the colors with dithering would result in an image that's
prone to flickering. See the section on dithered images, later in this article.)
Director is a versatile program, but it can't do everything. Converting illegal NTSC
colors to legal ones is something it doesn't do very well. If you don't have Photoshop
(or an equivalent), go to a local place that rents computer time by the hour and
do the necessary image processing there.
Return
One of the biggest problems with NTSC is its inability to maintain sharp color
boundaries. This problem crops up whenever two areas of color butt up against each
other -- especially when the two colors are similar in brightness and saturation
but different in hue. For example, imagine a closeup of a sprig of holly: deep red
berries against deep green leaves. If this image appeared on TV- particularly on
a consumer-grade TV -- the boundary between the red and the green would smear badly.
If the image were videotaped and copied, the smearing would grow much worse with
each new generation.
The best way to avoid this problem is to look at your Director movie in black-and-white.
You can do this by turning the color control on your TV monitor all the way down,
or, on a Macintosh, by using the Monitors control panel to set your TV monitor to
256 grays. (Changing these settings affects only the way you view the movie -- the
original movie remains in full color.) As you view the movie, keep in mind this rule
of thumb: if a TV image looks bad in black-and-white, it will look even worse in
color.
This can be demonstrated by the illustration below, in which each color drawing has
its black-and-white version beneath it. The first column shows a sprig of holly with
deeply saturated berries and leaves. The color drawing seems okay, but when you look
it in black and white, you can see that the green leaves and the red berries both
appear as a nearly indistinguishable medium gray. Because the black-and-white image
is clearly not acceptable, the color image will be equally unacceptable when converted
to NTSC.
In order to make this drawing useable, you'd have to improve the contrast between
the berries and the leaves -- even if it means sacrificing a bit of realism. There
are several ways you might do this, as illustrated in the remaining columns of the
illustration:
|
|
|
|
|
|
|
|
|
|
|
Original drawing |
Leaves made brighter than berries |
Berries made brighter than leaves |
Berries outlined in black |
Any of these alternatives could be accomplished fairly easily in Photoshop, though
not very easily in Director. If you have trouble getting the result you want, you
might consider a fourth alternative: scrap the holly altogether and replace it with
an image that's more NTSC-friendly.
Check your images in black-and-white frequently as you work on your movie. If a castmember
(such as the sprig of holly) is going to present problems, it's better to know this
early on than to be surprised after the movie is finished.
Return
Color blends or gradients are usually represented in Director by dithering
-- that is, intermixing pixels of different colors in such a way that the eye
interprets them as smooth transitions. Unfortunately, dithered images usually don't
look very good when converted to NTSC. The scan converter sometimes exaggerates individual
pixels, making the dithering more obvious than it was on the computer screen. Dithered
images also tend to flicker.
The easiest way to avoid dithering is to use 24-bit graphics -- but this is usually
not a practical option. Unless you have a very fast computer, Director usually can't
animate 24-bit castmembers fast enough for satisfactory results. (See the Speed
Issues section later in this article.)
Assuming you're using 8-bit graphics, there are two ways to deal with the dithering
problem. The first, most obvious solution is to use castmembers that don't include
blends or gradients. Though this solution will limit your artistic possibilities,
it is technically the most satisfactory.
The other solution is to use custom palettes for your castmembers. A custom palette
is any selection of 256 colors from among the millions available on your computer.
Assuming your castmembers use no more than 256 colors, they can include blends and
gradients with no (or hardly any) dithering.
The problem with custom palettes is that Director can use only one palette at a time.
Therefore, if your background castmember is indexed to one custom palette and your
foreground castmembers are indexed to other custom palettes, the result will be a
surrealistic mess. The only way to work around this limitation -- other than using
24-bit graphics -- is to make sure that all castmembers that appear on the stage
at the same time are indexed to the same palette.
When you're dealing with the intricacies of custom palettes, a program from Equilibrium
Technologies called DeBabelizer is extraordinarily useful. DeBabelizer can automatically
analyze a batch of castmembers, create the custom palette that best fits those castmembers,
and then remap the castmembers to the palette. If you don't have access to DeBabelizer,
here's a less convenient way to accomplish the same thing with Photoshop (or an equivalent
paint program):
The imported castmembers will look fine on a TV monitor. Just make sure that the
custom palette is selected in the Palette channel whenever these castmembers are
on the stage.
Return
As you know, computer images have a tendency to flicker when they are converted
to NTSC. This is due partly to the fact that NTSC images are interlaced, and partly
to the fact that the 640 x 480 computer screen doesn't map neatly onto the 525-line
TV screen.
One-pixel-thick horizontal lines have the worst tendency to flicker. The solution
for this problem is simple: don't use one-pixel-thick horizontal lines in your
movies. If you must use them, blur them first. (See the section called Blurring,
below.)
Similarly, try to keep the thickness of your horizontal lines to an even number of
pixels. In other words, lines that are two or four pixels thick tend to flicker less
than lines that are three or five pixels thick. (This is only a guideline, not a
hard-and-fast rule. Depending on your scan converter and on their position on the
screen, lines with odd-numbered thicknesses may sometimes look okay.)
For similar reasons, some people will tell you not to use fonts with odd-numbered
point sizes. This, however, is generally useless advice. There's no fixed correspondence
between a font's point size and the number of pixels each character occupies on the
screen. What is important is to use a large enough point size so that the
horizontal strokes of each character are more than one pixel thick. (Watch especially
for crossbars, such as those in the characters A and T. Watch also for serifs at
the bases of Roman-style characters.) In general, you can avoid flicker problems
in text by sticking to bold fonts.
Return
AntialiasingAliasing, commonly referred to as "jaggies," is the stair-step
effect that occurs when diagonal or curved lines are displayed on a computer screen
(left, top). There is no way to prevent jaggies, but they can be camouflaged or disguised
through a process called antialiasing. Antialiasing is a way of filling in
the stair-steps with a subtle blend of foreground and background colors, so that
the eye sees a smooth line or curve (left, bottom).
Aliasing is a particular problem in images that are converted to NTSC, because the
stair-steps are usually one pixel thick -- and therefore tend to flicker. Since nearly
all castmembers include diagonal or curved lines, this can add up to jittering of
massive proportions.
Therefore, the one best technique for avoiding flicker is to antialias everything.
The result will look odd on your computer screen -- slightly fuzzy, as if you've
forgotten to put on your glasses -- but it will look wonderful on your TV screen.
There's one drawback to this miracle cure: working with antialiased castmembers is
-- in polite language -- a royal pain. Antialiasing a castmember requires that the
colors of its edges be precisely blended with the background colors. But in an animated
Director movie -- where castmembers are constantly in motion against the background
-- those colors are constantly changing.
Early versions of Director had a primitive antialiasing feature that allowed you
to select a range of cells and then choose a level of antialiasing: Low, Middle,
or High. Whatever quality level you chose, Director had to calculate the proper color
blends on the fly, severely slowing the speed of animation. The trade-off in speed
might have been worth it if the antialiasing looked good, but it never did -- even
at the so-called High quality setting.
Beginning with version 5 of Director, Macromedia added support for true, high-quality
antialiased text -- but entirely removed antialiasing for graphics. A company called
Media Lab has filled the gap with a set of
Xtras (Director add-ons) called PhotoCaster and AlphaMania, which allow antialiased
Photoshop graphics to retain their antialiasing when imported into and animated in
Director. If you have several hundred dollars to spare, you might consider buying
these very useful Xtras.
Of course, you can always import antialiased graphics into Director without the Media
Lab Xtras. In that case, however, you'll be unpleasantly surprised when you drag
these cast members to the stage (over a colored background) and apply the Background
Transparent or Matte ink effect. You'll see a white "halo" around each
antialiased castmember. This halo appears because the text was created against Photoshop's
default white background, and therefore the edges of the text were blended with white
rather than with the background color used in Director.
Return
There are several ways to eliminate haloes in antialiased castmembers. The best technique for a particular castmember depends on how that castmember is going to be used.
|
|
|
|
|
|
Original drawing in Photoshop |
Same drawing imported into Director; halo is evident |
Drawing antialiased using the "easy but imperfect" method |
Drawing antialiased using the "difficult but nearly perfect" method |
In Photoshop and similar programs, antialiasing can be applied only while a castmember
is being created. However, you can achieve a similar effect with existing castmembers
by blurring them against the proper background color. Photoshop offers many types
and levels of blurring -- experiment and see which works best for a particular castmember.
If you don't have access to a paint program, you can produce a serviceable blur by
using the Smooth feature in Director's paint window.
After you blur a castmember, you'll have to use one of the techniques described above
for eliminating the halo.
Return
NTSC video runs at roughly 30 frames per second.Each frame consists of two fields,
for a total of 60 fields per second. Therefore, to produce the smoothest possible
animation for TV, your Director movies will need to run at 30 frames per second,
and in some cases at 60 frames per second. (Many scan converters work best at a ratio
of one frame per field.)
If you have any experience with Director, however, you know that consistent speeds
of 30 frames per second -- or above -- are difficult to achieve. There are many design
decisions you can make that will increase speed, such as using 8-bit or 1-bit castmembers,
avoiding "stretching" or "squeezing" sprites, and animating as
few sprites as possible at once. Naturally, it also helps to have a fast computer
with lots of RAM.
However, if you can't achieve the speed you need within Director, there are some
other possibilities:
If none of the preceding options is practical, there is one other option: consider
using a slower frame rate. It's not always necessary to have perfectly smooth,
Disneyesque animation -- a rate of 15 or even 10 frames per second may be perfectly
adequate for certain tasks.
Using the Tempo channel in the score, you can even vary the frame rate within
a single movie. If your computer can briefly handle 30 frames per second, use
that rate for the most delicate effects and use a slower rate during the rest
of the movie. The NTSC scan converter doesn't care how many frames per second
you're feeding it -- the issues here are aesthetic, not technical. If the animation
looks smooth on your TV monitor, go with it.
Return
