Flash Tutorials
& Resources
Dreamweaver
Tutorials
Fireworks Tutorials
& Resources
Photoshop
Tutorials
Web Design
Tutorials & Resources
CSS
Tutorials
CorelDraw
Tutorials
You are here : : Home > Free Resources > Flash Tutorials & Resources > Sparkling Glass Effect  

Flash Tutorials

Basics

Animation & Effects

Actionscript

Creating a Website New!

Miscellaneous

Flash Articles

Free Flash Resources

Other Flash Resources

Sparkling Glass Effect in Flash

Sparkling Effect

This tutorial will teach you how to create a sparkling effect or twinkling star effect in Flash MX. This tutorial is for people who are comfortable with movie clips using Flash MX. You can try the Sparkling Effect on a diamond ring or on text also.
Please note:
1. You need to have Flash Player 7.0 installed to view the Flash animation.
2. Flash MX 2004 or higher must be installed on your system to open the .fla file.

STEPS TO FOLLOW

  1. Import the Background Image
    Open a new file. Go to File >New. Select Flash Document. Click OK.
    Go to Modify > Document to give a file size of 180px by 400px. This is the same size as the Bitmap picture we have. Select the Bitmap pictures which you want to put as background and bring it to the Flash Library by clicking on Select File > Import to Library from the Menu Bar. Go to Window > Library, You can see the picture in the Library panel. Drag the picture named Bitmap to the Stage. Select the picture by clicking on it. This will be your first layer, name it background.

    Now you have to create 7 movie clips. You have to have basic knowledge in FLASH MX to do this. As you know movie clips work independently, and you can use them whenever required.

  2. Create a Rotating Star Movie Clip
    Create a new layer. Name it sparkle.

    Go to Insert > New Symbol. The 'Create New symbol' screen will appear. Name this movie clip ' star_mc'. Click OK. You will be directed inside the movie clip. Now select the PolyStar Tool. To select the Polystar tool , first go to the Rectangle tool and select it in the drop down menu as seen below.
    polystar
    Go to the Properties window. Go to Options. A screen called Tool Settings will appear.
    tool settings

    Enter these values and click OK:
    Style: Star
    Number of sides: 4.
    Star Point Size: 0.10.

    Now draw the Star (without a stroke color). Make the star into a movie clip entitled star_mc. Now double click on it. On frame 1 you will see your star. Go to Properties>Tween. Select Motion from the drop down Menu. Name it as star_in_mc. Go to frame 10. Press F6 to insert a new keyframe. Select the star and go to Modify > Transform > Rotate CW. Repeat Modify>Transform>Rotate CW thrice. Your rotating Star movie Clip is ready. You will see it in the Library Window also. This movie clip star_mc will not be there in the sparkle layer but stored in the Library, we will use it later.

  3. Create a movie clip with a small opaque circle that increases in size and becomes almost transparent.
    Draw a circle with Oval Tool, choose the fill color as white and make it 2px by 2px. Select it. Go to Modify>Convert to Symbol from the Menu Bar. A dialog Box named Create New Symbol will appear. Give the name as shade_mc. Select Movie Clip. Click on OK. double click on it. You will be inside the Movie clip and in your first frame you will see the dot. Select it. Go to Modify>Convert to Symbol from the Menu Bar. A dialog Box named Create New Symbol will appear. Give the name as shade_in_mc. Go to Frame5. Press F6 to insert keyframe. Go to Properties>Tween. Select Motion from the drop down Menu. Go to Frame 10. Press F6 to insert keyframe. Now go to Frame 5. Select your movie clip. Increase the size to 14.3px by 14.3px. Go to Frame 1. Select the dot. Go to Properties. Select Color as Alpha in the drop down menu and give 100%. Go to Frame 5. Select the dot. Go to Properties. Select Color as Alpha in the drop down menu and give 10%. Go to Frame 10. Select the dot. Go to Properties. Select Color as Alpha in the drop down menu and give 5%. This movie clip shade_mc will not be there in the sparkle layer but stored in the Library, we will use it later.

  4. Create another movie clip with a star which becomes smaller at a slower rate than our 1st star movie clip.
    Go to Main Scene. Go to Insert > New Symbol. The Create New symbol screen will appear. We will name your first movie clip as star_mc. You will be directed inside the movie clip. Now go to PolyStar Tool. To go to polystar tool , first go to rectangle tool and select it in the drop down menu. Go to Properties window. Go to Options. A screen called Tool Settings will appear. Select Style, in the drop down menu as Star. Select Number of sides 4. Select Star Point Size as 0.10. Click on OK. Give color as white.
    Now draw the Star. Give the size to 23px by 23px. Select the edge and delete them. Choose the star and make it a Movie Clip. Name it star_s_mc. Now double click on it. On frame 1 you will see your star. Go to frame 10. Press F6 to insert a new keyframe. Go to Properties>Tween. Select Motion from the drop down Menu. Go to Frame20. Press F6 to insert keyframe. Go to Properties>Tween. Select Motion from the drop down Menu. Now go to frame 10. Select your movie clip. Go to Properties. Give the size to 9px by 9px. This movie clip star_s_mc will not be there in the sparkle layer but stored in the Library, we will use it later.

  5. Create the sparkle movie clip by combining the movie clips created above and place it where required.
    You have already created 6 movie clips. Now we will create the last main movie clip. Go to Insert>New Symbol. The Create New symbol screen will appear. We will name your main movie clip as sparkle_mc. You will be directed inside the movie clip. Drag in here these 3 movie clips : star_mc, shade_mc , star_s_mc because when they are combined they will give the sparkle effect, and adjust them properly in the middle. Now go to your main scene. Go to layer sparkle. Drag the Main movie Clip sparkle_mc wherever you want the Sparkling Glass Effect to be seen. You can use it on a diamond ring, a golden jewelry or on sparkling text also.

  6. Save your file as sparkle.fla. Press on Ctrl+Enter to see the Sparkling Glass Effect. This will create automatically sparkle.swf file.

Congratulations! Your Sparkling Glass Effect is ready.

Download the .fla file


Now building a website is as easy as 1-2-3!

Please Like, Tweet, Share or Comment on this page if you found this tutorial/resource useful!

No portion of these materials may be reproduced in any manner whatsoever, without the express written consent of Entheos. Any unauthorized use, sharing, reproduction or distribution of these materials by any means, electronic, mechanical, or otherwise is strictly prohibited.


Looking for high-quality Flash Website Design? Choose from over 6000 templates!

Featured Template
Template # 30148
Type: Joomla 1.5 Template
Price: $60

Flash Photo Galleries