␡
- Animating with the Blur Filter
- Animating with the Drop Shadow Filter
- Animation Refinements
- Flash Filter Checks
Like this article? We recommend
Like this article? We recommend
Like this article? We recommend
Like this article? We recommend
Animating with the Drop Shadow Filter
- Download and open the jumpshadow_final.fla file into Flash Professional 8. Choose Control > Test Movie to preview the filter animation you will create next. Notice that the border’s shadow changes in strength and location depending on the position of the border image. The drop shadow filter is perhaps the most important and popular filter, and you will learn how to work with its various filter properties and settings as you re-create this animation.
- When you finish previewing the animation, close the Preview window as well as the jumpshadow_final.fla file. Download and open jumpshadow.fla into Flash. Move the playback head back and forth between Frame 1 and Frame 48. Notice that the Timeline animation sequence is composed of a series of seven keyframes and seven motion tweens. To create the drop shadow animation, you will add a drop shadow filter to each of the seven keyframes and modify their settings.
- Move the playback head to Frame 1 and select the border with the Selection
tool. Click the Filter tab on the Properties inspector and from the left side of
the tab, click the Add Filter button (+). Select Drop Shadow from the list of
filters (see Figure 6).
Figure 6 Add a drop shadow filter to the first symbol of the border.
- Match the settings in the Filters tab to the ones shown in Figure
7. Make
sure that the Color is set to black and the Knockout, Inner Shadow, and Hide
Object options are all unchecked. The Distance and Angle settings establish how
far and at what angle the shadow will be positioned from the object. The Blur
settings establish how diffuse or sharp the edges of the shadow will be. The
Drop Shadow filter offers a number of different options so you can carefully
customize the drop shadows you create.
Figure 7 Match the settings in your Filters tab to the ones shown here.
- Move the Playhead to Frame 6 and click the border on the stage to select it. Flash 8 has already added a Drop Shadow filter to this keyframe because of the tween animation on the Timeline in Frame 1. If you apply a filter and motion tween to one frame, the ending keyframe of the tween will automatically receive the same filter treatment (although the filter settings might be different, as in this case).
- Match the settings in the Filters tab to the ones shown in Figure 8.
Notice that the drop shadow is now much farther from the border graphic
and is much more blurry—the result of the larger Distance and Blur
settings.
Figure 8 Set the drop shadow filter settings of the second keyframe. Match the settings in your Filters tab to the ones shown here.
- Move the Playhead to Frame 12 and again select the border on the stage.
Match the settings in the Filters tab to the ones shown in Figure
9. Notice that
the Drop Shadow is farther away and even more blurry and unclear—this
occurs because of the higher Blur setting and the lower strength setting.
Figure 9 Set the drop shadow filter settings of the third keyframe. Match the settings in your Filters tab to the ones shown here.
- Repeat step 7 for the keyframes on Frames 18, 24, and 36. The keyframe on
Frame 48 is off the Stage, so it does not need a drop shadow. Match your
settings to those in Figure
10 for correct filter settings for each
keyframe.
Figure 10 Set the drop shadow filter settings for the remaining keyframes. Match the settings in your Filters tab to the ones shown here.
- After you set the properties for each of the keyframes, press Enter (Windows) or Return (Mac) to preview your work. You can also scrub the Playhead back and forth along the Timeline to see the results.
)
)
)
)
)
Notice the drop shadow moving along with—but also changing shape and distance from—the border. This is a great way to add more interest and visual appeal to a simple motion tween animation. Experiment with the various Drop Shadow filter settings to refine and change the animation.