In this tutorial, you will learn how to create a burning effect to an image in Flash using advanced masking techniques.
Tutorial Details
Program: Flash CS4
Difficulty: All
Estimated Completion Time: 40 hr
Tutorial Assets
The following assets were used during the production of this tutorial.
Here we are taking new flash document with action script 2.0. See the reference image below.
Step 1: Setting Up Document Properties
Now Select Modify from the menu bar and select Document or You directly can press ctrl + J to open the document properties.
Now change the stage dimensions as 600×433 and the FPS is 30, as shown in the Figure below. To start with the tutorials download the source.zip file that will provide you with the necessary files to be used in the tutorial.
Step 2: Importing necessary image
First import the downloaded used images from the source. To do that, Go to the File menu > Select Import > Select Import to Library. See the reference image below.
Step 3: Positioning images on to the stage
Before starting we already have layer 1, now name the layer as background. Drag the background image from the library on to the stage.
Align the image to the center of the stage using the align panel. Keep in mind that to align any item to the center of the stage, Press the “To stage” button.
Step 4: Positioning other images on to the stage
Insert a two other new layers and name them as man_normal and man_rock.
Step 5: Creating mask shape
Now insert a new layer above the man_rock layer, and name it as mask shape. Then copy the man_normal image and paste it on mask shape layer by pressing ctrl + shift + V.
Select the mask shape layer image and break apart it. To do that Select modify from the main menu and select break apart or Press Ctrl + B.
Now select the lasso tool from the tools panel and magic wand from the lasso tool option.
Now click on the transparent area as given in the reference image below and press delete to remove the transparent area.
Now select the remaining area using selection tool and fill any color in it.
This shape is that area where our effect will be displayed.
Step 6: Preparing the effect item
Now insert a new layer below the mask shape layer and name it as effect. Press Ctrl + F8 to create a new symbol. Type the name effect_mc and select type to Movie Clip.
Now create a line of yellow color as given in the reference image. Increase stroke to 15 and select the style to stippled. You can see the line effect.
Now convert the line to fills. To do that, Select Modify > Select Shape > Select Convert Lines to Fills.
Step 7: Creating the effect animation part 1
Now insert a key frame on frame 10. To do that, select the frame > Press F6.
Now flip this line to Horizontal after that flip to vertical. To do that, Select Modify > Select Transform > Flip Horizontal. Again do the same method but select Flip Vertical.
Now Select any frame between frame 1 and frame 10 and create shape tween. To do that, Right click on the selected frame>Select Create Shape tween.
Step 8: Creating the effect animation part 2
Now come to the main time line and Insert a new movie clip symbol. To do that, Press Ctrl+f8. Type name effect animation and select the type movie clip.
Open the library panel by Pressing Ctrl+L. Then drag the effect_mc movie clip symbol from the library.
Copy this symbol four times. To copy, Press Ctrl+C, then Ctrl+V, how much you want.
Step 9: Placing the effect animation on the stage
Now insert a new layer above the man_normal layer and name the layer as effect.
Open the library panel by Pressing Ctrl+L. Then drag the effect_animation movie clip symbol from the library to the stage at the bottom.
Step 10: Applying blending modes to the effect
Now select the effect_animation symbol and Open the properties panel. To open the properties panal, Go to the Window menu > Select the properties. Apply the blending mode, to do that, Go to the Display option in the properties panel > Choose Add from the blending drop down menu.
Step 11: Applying Blur filter to the effect
Now apply the Blur filter. To do that, Go to the Filter option in the properties panel > Select new filter > Blur.
Now set the blur value. To do that, Set the Blur X and Blur Y value to 5px, and choose quality to High.
Step 12: Transforming the effect animation to fit in the shape
Now increase the width of the effect_animation symbol. To do that, choose Free transform tool from the tool panel then Select the symbol and increase the width.
Step 13: Creating motion tween for animation
Now go the frame 200 and insert a new key frame on effect layer. To do that, select the frame > Press F6.
Now move the effect_animation symbol to the top of the mask shape as given below the reference image.
Now select any frame between frame 1 and frame 200 of effect layer then Right click > select create classic tween.
Step 14: Creating masking
Now select the mask shape layer and right click > select mask.
Step 15: Creating masking two remove the man
Now insert a new layer above the man_normal layer and name the layer as mask.
Draw a rectangle on the mask layer to cover the man image.
Now go the frame 200 and insert a new key frame on mask layer. To do that, select the frame > Press F6. And decrease the height of the rectangle as shown in the reference image below
Now select any frame between frame 1 and frame 200 of mask layer then Right click > select create shape tween.
Now select the mask layer and right click > select mask.
Step 16: Giving stop action at the end
Now insert a new layer above all the layers and name the layer as Action. Select the frame 200 and press f6 to insert the key frame. Then press f9 to open the Action window, and write the given code as shown in the reference image below.
Now press Ctrl + Enter to see you effect. You will find the effect something like this.
Hope you enjoyed this tutorial on creating a burning effect on an image using advanced masking effects! Let us know what you think by sharing your comments in the comments form found below.