Animating Shadows in Adobe Flash







The Drop Shadow filter in Flash 8 Professional makes it easy to add a drop shadow to an animated Movie clip. In this tutorial you’ll see how to adjust the filter’s settings to create a realistic animation of an object moving from one point to another.
The following steps will show you how to animate a spinning boomerang traveling across the Stage. The boomerang animation used in the tutorial was created in Swift 3D and imported into a Movie clip symbol. However, you can draw and animate your own boomerang inside of Flash.

STEP 1: Create a new Flash document.

In the Movie Properties panel enter 15 in the Frame Rate field. Draw or import an image onto the Stage to use as a background.  Rename the layer 1 to "background".  (The image used in the tutorial was created in Bryce 3D) Click the black dot beneath the Lock icon to the lock the layer.        



STEP 2: Insert a new layer.

Rename the layer "boomerang".  Draw a boomerang on the Stage. Switch to the Selection tool (V). Select the boomerang and Right-mouse click.  Choose Convert to Symbol from the menu. Enter "boomerang" for the name and choose Movie clip for the behavior.

In the screen shot you see the Timeline of the "boomerang" Symbol. Onion skinning is turned on so you can see the position of the boomerang in each Keyframe. The complete animation contains 20 Keyframes.



STEP 3: Scale the Instance.

Click the Scene 1 button to return to the Main Timeline. Select the "boomerang" and choose Modify > Transform > Scale and Rotate. Enter 30% in the Scale field and press OK. Move the boomerang to the point on the Stage from which you want the animation to begin.


STEP 4: Add a Shadow.

Select the "boomerang" on the Stage if it isn’t still selected. Click the Filters tab at the top of the Properties panel. Click the + button and choose Drop Shadow from the list. In the Strength field enter a value, the lower the value the less visible the shadow. Next, enter a value in the Distance field. The Distance field sets the distance between the Movie clip Instance and the shadow. Enter a value for both the X and Y blur. The lower a value, the softer the blur. To set the angle of the shadow, enter a value in the Angle field.  Test your movie by choosing Control > Test Move. Notice the shadow animates in unison with the Movie clip.




STEP 5: Add Motion Tweening.

Use the Target option to specify what the browser does when the submit action is completed. If you choose " _top", the results page will open in a new browser window. If you leave this field blank, the browser window will simply be replaced with the results page. A results page is usually a simple HTML page that is delivered when the Submit button is pressed with a message like: “Thanks for playing.”

STEP 6: Adjust the Shadow

To finish the illusion that the boomerang is traveling downward and closer to the ground we need to adjust the distance of the shadow. Select the "boomerang" on the Stage in Frame 30. In the Properties panel enter a lower value in the Distance field. In the example I used 32. However, the value you choose will depend on the where the Movie clip is located on the Stage. The main point is to move the shadow closer to the "boomerang" to give the illusion that it is closer to the ground. You may also want to adjust the Strength, making the shadow darker since the "boomerang" is closer to the ground.



STEP 7: Bad Throw

Most boomerangs return to their owners. Unfortunately, whoever threw our boomerang needs a little practice. Instead of returning, it’s going to land on the ground. Select Frame 35 of both layers and press F5 to extend the Timeline. Insert Keyframes (F6) in Frame 34 and 35 of the "boomerang" layer.

STEP 8: Adjust the Shadow

In Frame 34, move the boomerang down and a little to the right of its current position. It should appear to be on the ground. In the Properties panel, increase the Strength and decrease the Distance by entering 36 for the Strength and 2 for the Distance. Select Frame 30 of the "boomerang" layer. In the Properties panel select Motion from the Tween menu.



STEP 9: Stop the Spin

When the boomerang hits the ground it should stop spinning. A simple method is to change the behavior of the boomerang’s Instance from Movie clip to Graphic. Move the Playback head to Frame 35. Select the boomerang. In the Properties panel select Graphic as the behavior.



STEP 10: Stop the Animation

To keep the movie from looping we need to add a "Stop" action in the last frame of the movie. Insert a layer above the "boomerang" layer. Rename the layer "actions". Insert a Keyframe (F6) in frame 35. Choose Window > Actions to open the ActionScript editor. Choose Global Functions > Timeline Control > Stop.






If you've any question, problem, suggestion and feedback than please comment below.

Have a nice day!






Comments