Circular Ripple effect in FlashMX 2004

Import an image to your work area in flash
Press F8, to convert this image to a symbol.
Name this Symbol "symbol1" and choose graphic behavior. Press OK.
Name this Layer "bg".
Select symbol1 and choose Alpha 99% from color list box in your property window.

Create a Movie clip.

Press Ctrl+F8, to create Ripple movie clip.
Name this symbol "symbol2" and choose Movie clip behavior. Press OK.
Drag symbol1 to your working area from Library (ctrl+L).
Select symbol1 and choose Alpha 0% from color list box in your property window.
Insert Keyframe (F6) into the 5th frame.
Still remaining on the 5th frame, Select symbol1 and choose Alpha 99% from color list box in property window.
Select 1st frame, choose Motion Tween from Tween list box in your property window
Insert Keyframe into 15th frame and later to 20th frame.
Remaining on the 20th frame, Select symbol1 and choose Alpha 0% from color list box in your property window.
Select 15th frame, select Motion Tween from Tween list box in your property window.
Go to frame 5 and reduce the size of symbol1, by 5pix width and height.
Go to frame 20 and increase the size of symbol1, by 5pix width and height.
Insert a new layer above this layer, call it "Layer 2".
Draw a borderless circle. Follow the instructions given below to do this.

Instructions to draw the above shown borderless circle

Draw a black circle in a layer and delete it's border.
Insert a layer above the black circle layer.
Draw a smaller white circle in this new layer and delete it's border.
Keep the positions of the white circle at the center of the black circle.
Then cut and paste the white circle (Ctrl+Shift+V) in the black circle layer.
You can deselcet circles by clicking somewhere outside,
Then click on the white circle and delete it

Place this circle at the center of symbol1 in Layer 2 but make sure this circle in Layer 2.
Insert Keyframe (F6) into the 20th frame of Layer 2.
Remaining in 20th frame Increase the size of the circle. Note, this diameter decides where your ripple to end.
Go back to 1st frame, select Shape Tween from Tween list box in property window.
Right click on Layer 2 and select Mask.
Save (ctrl+S). You can do saving in each step.

Insert Ripple Movie Clip onto Scene 1

Then go back to scene 1.
Insert a new layer above bg layer and call it ripple1.
Drag symbol2 movie clip on to the centre of your working area.
Insert frame (F5) into the 20th frame of ripple1 layer. So that the symbol2 runs only for 20 frame.
Insert frame (F5) into the 30th frame of bg layer.

Now your movie is done!. Press Ctrl+Enter to view the movie..

Tips: Inserting 1 symbol2 Movie clip is enogh if your image size as in the demo If your image is too big, then you have to insert more than 1 layer of symbol2 movie clip. This is the difference between the appearance of each movie clip is 5 frames. In fact, the differnce normally depends on the type of effect. So you may adjust it as you desire..

Back to Tutorials Home Page

Maa Design Services
MAA offers high-quality website design services at affordable prices and fast turnaround time. We provide ready-made & custom website design solutions to global clients from London, UK. Take a look at our client testimonials from clients all over the world. Contact us today to get started on your website!

Client Testimonials

"If you want the QUICKEST service, the BEST web design, Logo and the FRIENDLIEST communication, DezineHub is the ONLY business to turn to. They far exceeded my expectations! I give them the HIGHEST recommendation! "
Dilip, Chemmen Ltd UK

Maa Web Design
-Brochure Website
-E-Commerce Website
-Flash Website more>