Getting Loopy with Shockwave

Film loops are a powerful tool for creating elaborate animations

By Bob Schmitt
April 11, 1997

This column is an excerpt from the book, Shockwave Studio: Designing Multimedia for the Web, available now from O'Reilly & Associates.

In the last Studio column we looked at how Shockwave's Cast and Score structure offers many advantages for creating complex animations. In this column, we'll take a look at film loops, a technique which can help you control more elaborate animations.

What is a film loop?

In Macromedia's Shockwave, we use a grid to score cast members of an animation across a sequence of frames. A film loop is a way to encapsulate the Score sequence information of a sprite (one of the cast members of an animation) and place it as a single sprite in the Shockwave movie. This saves Score space, and is especially useful if you have sprite animations of varying lengths repeating their actions within a longer animation.

In this tutorial, we'll show how to create the film loop shown below, use it in the score, and write a Lingo script that runs the animation.



A Shockwave film loop in action.

Creating a film loop

To create a film loop, you begin by creating a normal, timeline-based animation in Director. The next step is to highlight all of the frames to be included in the film loop (See Figure 1).



Figure 1. Highlighted frames of the film loop in the Score.

Do this by clicking on the the first sprite in frame 1, holding the shift key down, and clicking on the last sprite in frame 27. Next, make sure you have the cast window open and simply drag the frames from the score window into an empty space in the cast window (Figure 2). This brings up the Create Film Loop dialog box. Name the film loop and click OK.



Figure 2. Internal Cast of the film loop.

To use your new film loop, first delete the timeline-based animation from the score, then drag the film loop you just created from the cast window to sprite channel 1 of frame 1 in the score (Figure 3).



Figure 3. Score window with channel 1 in frame 1.

In this example, the film loop occupies only one frame (a film loop might span several frames in other movies). Regardless, the movie ends when it has played through the frames. With only one frame, the movie would end before the film loop has even started. To keep the film loop moving, we need to write a Lingo script that loops the movie in frame 1 (Figure 4).



Figure 4. Lingo script that loops the movie in frame 1.

Start by double-clicking in the script channel of frame 1. This brings up an empty Score Script window. On the line after on exitFrame, type go to the frame and close the Score Script window. You can now check your film loop by selecting Control/Play.

Obviously this simple example doesn't exactly excite the mind to the possibilities of film loops, so let's look at how film loops can help when things get a little more complicated.

Another use for film loops

In the opening banner headline for his site The 40K Miracle, Gabriel Jensen layers 10 separate graphics together to create a very realistic spotlight effect.

The first layer of the spotlight effect is an oval filled with a custom tile created from the brick graphic (the left-most image in Figure 5). In the score, this graphic appears in sprite channel 1. Placed over this are nine layers (sprite channels 2 through 10) of concentric light yellow circle graphics (Figure 5). (Also in Figure 5 we've made these graphics black so it is easier to see the nuances of each ring.)



Figures 5. Spotlight layers. Click the image for more detail.

All of these yellow graphics have their ink effects set to Background Transparent, which makes the white background of the graphics transparent. Also, each yellow graphic has their sprite-blend property set to a different percentage. The sprite-blend property lets you control the opacity of a sprite. You set it in the Sprite Properties dialog box by entering a percentage into the Blend field (Figure 6).



Figure 6. Sprite Properties dialog box
with blend percentage indicated.

Each of the nine yellow graphics have their blend property set to incremental degrees of opacity, creating a soft, glowing effect around the edges of the spotlight area. The effect is very subtle, yet provides a realistic sense of warmth to the lights. Figure 7 shows a composite of all the layers of the circle graphics filled with different percentages of black, which demonstrates the cumulative effect of these graphics.

As the movie progresses, more and more spotlights turn on until the whole scene is awash in lights. By the end of the movie, there are 10 spotlights on the stage at the same time. Unfortunately, Director's score offers only 48 sprite channels -- meaning only 48 graphics can appear on the stage at any given time. At this point, you may be wondering, if there are only 48 sprite channels and each spotlight takes 10 channels each, how can there be 10 lights on the stage simultaneously? The answer is simple: film loops.

By capturing the information for the 10 sprites that make up the spotlight into a single film loop, Gabriel was able to place the film loop on the stage multiple times, using only one sprite channel instead of 10. In the end, the 10 lights on the stage take up only 10 sprite channels.

As you can see, this becomes a powerful tool for controlling different aspects of elaborate animations. Film loops not only allowed Gabriel to put more content on stage at any given moment, but gave him more control over moving and animating the spotlights. Imagine if he had to animate each spotlight's movement across multiple frames by having to select and move a group of 10 sprites rather than the single film loop. The score would be a nightmare.



Figure 7. Composite of all layers filled
with different percentages of black.

Film loops upon film loops

Additionally, film loops can be captured into other film loops. For example, once Gabriel had finished his animation, it would be possible for the entire animation -- film loops and all -- to be captured into another film loop. This entire complex animation could, ultimately, be represented as a single sprite in the score.

Consider the advantages of this technique. Imagine a Shockwave movie of a television, in which you wanted the user to be able to switch channels -- each channel showing a different animation. With film loops, it would be as easy as swapping one sprite for another each time the user clicked the channel changer.

This technique has endless applications and can be a very powerful addition to your Shockwave repertoire.