# Chapter 4

# Considerations for the Internet

CONTENTS

- Thinking about Your Intended Audience
- Graphics
  - Color Depth
  - Palettes
- Director Tools
  - Vector Graphics Tools
  - Tiling
  - Text
- Sound
- Testing Your Movies
- From Here…

A certain Web site I've visited occasionally gives me two options: enhanced with Shockwave and nonenhanced. I always choose nonenhanced. Why? Because I am looking for fast information. Shockwave takes time, and if the user is there only for quick information, he or she will not be willing to wait for fancy stuff. To decrease download time, you will need to be careful in how you construct your Shockwave Web pages so that the user is not annoyed with too many enhancements.

This chapter contains a few suggestions for limiting the size of your director movie:

- Limiting graphics size and color depth
- Keeping file size down with features of Director
- Adding efficient audio to Shockwave files
- Testing your movie at the lowest level

## Thinking about Your Intended Audience

You may have already created a Director movie that you would like Shocked on your Web page. If it's already a relatively small file, this may be no problem. But if you're like me and love to add every detail and feature possible, you end up with a 5M Director movie. Even after it's compressed, it's ridiculously large. So it's best to keep the Internet in mind as you create.

Are your viewers really interested in fancy stuff, or will it be more of a bother than an enhancement? Are they visiting your page to find information or to be entertained? A balance between aesthetics, excitement, and functionalism is necessary.

Download time was discussed in chapter 1, "Multimedia on the Web." You'll soon realize that file size will consume your thoughts as you create. The more you can pack into a small file, the better off you'll be. Of course, certain people will be willing to wait longer than others, but the last thing you want is someone going to your Web page, seeing "`13% downloaded of 300k`" at the bottom of the screen, and not being willing to wait for your fantastic work of art to arrive. To ease this download time, you might consider having a very compact Shockwave movie come up immediately to mesmerize the viewer with some text or a special effect while the final Shockwave movie downloads in the background. See chapter 13, "Internet Lingo for Shockwave," for more on how to do this by using network Lingo commands.

## Graphics

Obviously, smaller physical size means smaller file size. You may want your logo to dominate the screen as it spins, dances, or sings, but if it means the viewer has to wait five minutes just to see a silly animation, it's not worth it. Use the minimalist ideal: Less is more.

### Color Depth

We mentioned color depth of bit-map images in chapter 2, "Suggested Tools." Afterburner compresses 8-bit and 1-bit images the best, so it's good to stick to those two in your Director movie, though you may experiment with other depths. As you can see in table 4.1, as you increase bit depth, the number of possible colors for each pixel increases-and more possibilities mean bigger file size.

Table 4.1 Color Depth Chart

Bit Depth | Number of Colors
`1-bit` | 2 colors
`2-bit` | 4 colors
`4-bit` | 16 colors
`8-bit` | 256 colors
`16-bit` | 65.5 thousand colors
`24-bit` | 16.7 million colors

The more 1-bit images you can use, the better. Consider this example: A 100-pixel square image in Director that is 1-bit is only 1.2K, while the same size image that's 8-bits is 19.5K! That's quite a difference. It's also easier to get away with 1-bit images when they are animated because the motion can hide their simplicity.

Not only is 8-bit the highest depth you should use due to file size, it also includes the largest audience on the Internet. Many Internet viewers may have video cards that can display only 8-bit color, so even if you created something in high color, they could not see it. Their computers would automatically dither the image down to 8-bits.

Note
Dithering is the process the computer uses to simulate colors that aren't in its palette. For example, you create an image in 24-bits that uses a particular hue of orange. When you convert it to 8-bits, the palette may not contain that exact color. If you choose the option of dithering colors, the computer will simulate that orange hue by speckling pixels that are similar in color next to each other (perhaps pixels of red and yellow). Just like in Neoimpressionist Georges Seurat's pointillistic (divisionistic) paintings, your eye mixes the actual colors it sees to appear as the intended color, like an optical illusion. Sometimes an image dithers beautifully, and you can hardly tell a difference from the original high-color image. Other times you get speckles of ugly colors that may look awful. If the latter occurs, you may decide to go back and adjust the colors of the original until the dithered image looks good.

Images with large areas of flat colors will compress much better than images with areas of various dithered colors. You may choose not to dither the image when you convert it; you can remap the colors to the nearest hue in the palette.

### Palettes

High-color images (16- and 24-bit) have no palette. They use a system that defines the properties of the actual color. Eight-bit images and lower use a color palette. Each pixel in an 8-bit image has a number associated with it that corresponds to a color location in the palette, so a certain hue of red may be number 137 in the palette.

In converting your high-color image to 8-bits, you can choose either the computer's system palette or an adaptive palette. The system palette is the same on any computer (though Windows and Macintosh have different palettes). The adaptive palette chooses only colors that are needed for the particular image and creates a custom palette, so it looks much better. Director has system palettes for Windows and Macintosh built in, as well as several other built-in palettes.

Caution
If the viewer's computer is running in 8-bit mode, your custom palette can override their system palette and cause the rest of the screen to sort of "go crazy." For example, an image on the screen accesses color #86. This may be green in the system palette, but your custom palette puts red into position #86, and all pixels that used to be green now show up as red. To protect against this, stick to a system palette. If you're ambitious, you can leave certain colors in the palette that are needed by the system and put your own into other positions; however, this chapter won't go into detail about doing that. If it's not important that you accommodate people with 8-bit displays, go ahead and make custom palettes.

## Director Tools

Director contains various tools that can create graphics, buttons, text, and other elements. You may find that you want to create these things in other programs such as Photoshop, but Director's tools can often do the same thing and will use much less space in the movie's final file size.

### Vector Graphics Tools

Consider using Director's tool buttons to create boxes, circles, and other simple graphics. To use the same example mentioned earlier, the 1-bit, 100-pixel square that was 1.2K could be drawn with the Director tool as a vector graphic and will only use up 64 bytes! Clicking the "i" in the cast member window will display the selected member's size within the movie. By selecting more than one cast member, the "i" button shows you the combined total.

Remember, vector graphics only need to define lines, angles, shapes, and other "drawing" features. This will almost always result in smaller file size than bitmap graphics that need to define every pixel of an image. Refer to the sidebar, Bit Map versus Vector Graphics, in chapter 2, "Suggested Tools," for more on the differences.

### Tiling

Tiling is a useful feature in creating nice backgrounds using very little file space. If you have ever used the `<body background="filename">` tag, you are familiar with tiling, or repeating an image over and over throughout a certain area. Director comes with eight built-in tiles, most of which are fairly basic. But you can create your own tiles from a cast member. See the example in chapter 8, "Special Effects and Other Shockwave Techniques," for more information on the tile feature.

### Text

Text compresses very nicely with Afterburner. You may be tempted to create text in your graphics program and import it as a bit map, but if this isn't essential, you can use Director's tool to create text. Version 5 of Director has improved the text features to offer anti-aliased text. When using the text tool in Director 5, the text is merged into the stage like a bit map so that the user does not need to have the same fonts installed on his or her system. However, the field tool (which allows text to be modified by lingo or by the user) leaves the text as a certain font, size, style, and so on. It's important to remember that the viewer may not (and probably doesn't) have the same fonts installed on his or her system. It's best to stick to the standard fonts available on most computers when you use fields. Shockwave will automatically select a similar font when the movie is created on one platform and played on another. Table 4.2 shows some common fonts for Windows and Macintosh.

Table 4.2 Standard Fonts

Windows | Macintosh
Arial | Helvetica
Courier | Courier
MS Serif | New York
MS Sans Serif | Geneva
Symbol | Symbol
System | Chicago
Terminal | Monaco
Times New Roman | Times

Tip
If you're counting every kilobyte and want to reduce a few more, here's an easy way. Director has a default font mapping table that it uses (and that Afterburner uses) for every movie, whether it uses fonts or not. By specifying your own font map, one that is nearly empty, you can slim the final .DCR file by a few K. First, create a simple text file with almost nothing in it. A semicolon indicates a comment, so one of these is fine. Next, go to Movie Info in Director and declare this text file to be your font map. Save your movie. That's all you have to do! If you do use fonts, but want your own font mapping table, read the font map text file (fontmap.txt on Windows systems). It will explain more on how to do this. Then you can delete all of the Macromedia comments to have your own bare-bones font map.

## Sound

Audio can be a great addition to your Director movie if it's used efficiently. A good sound effect can turn a dull animation into a fun enhancement. However, sounds take up a significant amount of space in the movie. Afterburner for Director 5 will compress the audio, but don't expect miracles. For lengthy audio, you may decide to stream the audio file separately. See chapter 18, "Shockwave for Audio," to learn how to do this.

Keep the length short. Every second of audio can rack up the Kilobytes of the final movie. If possible, use sounds that can be looped. Four beats of music can sound like a whole soundtrack if looped well. You may wish to choose sounds that are useful in more than one situation in the movie.

High sampling rates mean big file size. You may have a fantastic sound clip that is stereo, 16 bits, and 44.100 KHz; but a three-second sound at that rate would be 516K! Reducing to mono, 8- bit, 11.025 kHz is most space-conscious. If the audio sounds too awful at that rate, use 22.050 kHz. Though you may be able to reduce a sound to lower than 11.025 kHz, certain sound cards may have difficulty with this.

Note
Again, remember your viewers. I once worked with a guy who had a little "blip" sound every time he pressed a key on his keyboard. It was fine for him, but it would drive me crazy after ten minutes. If you loop a sound, give an option to turn it off or fade it out after a while. Just about every sound effect collection has the ever-popular vomiting, toilet-flushing, and slip-on-a-banana-peel slide whistle. But not everyone will love those sounds as much as you do.

Currently, Shockwave offers no support for MIDI. It could be very efficient in terms of file size, but may not be practical since there are so many different sound cards with different MIDI instruments either built in or connected. Unless a standard map were used, you could never be really sure if your piano sound ended up as a piano or a clarinet. But I've been surprised enough to know that I shouldn't say something is impossible. It could be that MIDI will soon join the Internet multimedia gang.

## Testing Your Movies

Be sure to test your Shockwave creations at the lowest common denominator. You may have a 166 MHz Pentium with 64M of RAM and a 28.8 Kbps modem. However, your grandmother-old-fashioned as she may be-still has a 486 66 MHz computer with 8M of RAM and a 14.4 Kbps modem. To evaluate your movie, be sure to test it on the slowest system you think viewers may have. Testing on both Windows and Macintosh platforms is important, too, to be sure everything works for all viewers. You may decide to leave Grandma in the dust and make a 500K Shockwave file that runs only on high-performance machines, but the size of your audience will be limited.

## From Here…

You're learning that there are a lot of things to keep in mind when creating Shockwave files for the Internet. The reward of the Internet is that so many people can all view the same information, but the limitation is that you have a large audience to consider.

- Chapter 5 "Limitations of Shockwave and the Web": Further limitations of Shockwave on the Web and ways of dealing with them.
- Part II, "Creating Basic Animations": Beginning with Shockwave, we'll start with a few basic animations to enhance your site.
- Chapter 6 "Liven Up a Page: Animations for Fun": From start to finish, you'll step through the process of creating and putting a Shockwave file on your Web page.