You are on page 1of 26

FLASH tutorial

FLASH TUTORIAL Perisian ADOBE Flash digunakan untuk membina halaman web, animasi, interaktif dan juga montaj atau pun promo. Antara muka Adobe Flash.

Kebiasaannya ia akan memaparkan TOOLS, TIMELINE, STAGE dan juga PROPERTIES WINDOW.

razlann@yahoo.com

FLASH tutorial

ANIMATION WITH ADOBE FLASH. Flash can create two types of tweened animation using timeline: Motion Tween &

Shape Tween

Creation of Motion/Shape tween using timeline is the basics of Flash. Motion tween is nothing but tweening a Symbol's movement from one position to another. To implement Motion Tween all that you have to do is, provide Flash with Symbol's initial position and the end position. Rest is taken care by Flash. Isn't it really simple. For example in the above demonstration, I have converted the pencil object to a Symbol. Provided Flash with its initial and the end position, intermediate tweening is done by Flash. Motion Tween animation is as simple as that :) Okay, you ready to learn how to create motion tween. All you have to do is just follow this tutorial step by step. Steps to follow: Open a new flash file (Ctrl+N). New Document window will appear Select General panel and choose Type: Flash Document . Press OK. If your timeline window is not open, press (Ctrl+Alt+T).

Now you can see a single Layer called "Layer1" in your timeline Window. Select the first frame. Import your image onto stage, upon which you would want to implement motion tween. File>Import>Import to Stage, or just press (Ctrl+R). Or you can even draw your own object, you can either choose Rectangular tool or Oval tool from the tool box and draw your desired shape. Now select your object on the stage and press F8 to convert this image to a Symbol. Convert to Symbol window will pop-up. Name your Symbol what ever you like. Select Graphic behavior and press OK.

razlann@yahoo.com

FLASH tutorial

Note: You can create motion tween only on symbols. So any object upon which you would want to implement motion tween, First convert the object to a Symbol. Right now your Symbol is in frame1 of Layer1. Select frame 20 and press F6 to insert a new keyframe. Still keeping playhead on frame 20, move your Symbol to any other position other than the present one. Select any frame between, 2 to 19 and select Motion from the tween pop-up menu in the Property inspector. Now your Layer will look something like the one shown below. (BLUE COLOR)

Now press (Ctrl+Enter) to view your motion tween.

razlann@yahoo.com

FLASH tutorial

razlann@yahoo.com

FLASH tutorial

Shape Tween in Flash Shape Tween Creation of Motion/Shape tween using timeline is the basics of Flash. By tweening shapes, you can create an effect similar to morphing, making one shape appear to change into another shape over time. Flash can also tween the location, size, and color of shapes. This tutorial will teach you a simple shape tween. Steps to follow: Open a new flash file (Ctrl+N). New Document window will appear Select General panel and choose Type: Flash Document . Press OK. If your timeline window is not open, press (Ctrl+Alt+T). Now you can see a single Layer called "Layer1" in your timeline Window.

Select the first frame. Now go to your working area and draw any object. To start off with, may be you can draw a circle.This is going to be your initial object. In the above demonstration, my initial object is a short line. Select frame 20 and press F6 to insert a new keyframe. Still keeping playhead on frame 20, delete the object present in your working area. Now draw a different object, may be a square. In the above demonstration, I have drawn a long line. Select any frame between, 2 to 19 and select Shape from the tween pop-up menu in the Property inspector.

Now your Layer will look something like the one shown below. (GREEN COLOR)

Now press (Ctrl+Enter) to view your motion tween. In the above tutorial, you learnt how to create a simple shape tween. Believe me, using this logic you can create n number of beautiful things. Here is a simple example just to trigger your
razlann@yahoo.com

FLASH tutorial

creativity.

Working with Layers in Flash This tutorial will teach you how to work on layers using Flash MX 2004. If you still haven't finish motion tween. Please go through Motion Tween Tutorial and then get back here. Steps to follow: Open a new flash file (Ctrl+N). New Document window will appear Select General panel and choose Type: Flash Document . Press OK. If your timeline window is not open, press (Ctrl+Alt+T). Now you can see a single Layer called "Layer1" in your timeline Window.

Create a Shape Tween on Layer1. Similar to the one in Shape Tween Tutorial. Single click on add new layer button.

A new layer gets added. By default it will be named "Layer 2". Create a Motion Tween on Layer 2. Similar to the one in Motion Tween Tutorial. After creating two layers, your timeline will look something like the one shown below.

razlann@yahoo.com

FLASH tutorial

Now press (Ctrl+Enter) to view your motion tween.

Motion Guide in Flash What is Motion Guide? Motion Guide is nothing but moving your symbol in a predefined path such as curves or circles. Learn how to move Flash objects in circular, zig zag or curved paths using Flash motion guide. Download .fla is included at the end of the tutorial. This tutorial will explain on how to create motion guide in Flash MX 2004.

Steps to follow : 1. Create a graphic symbol or drag a pre-existing graphic symbol from library onto the stage. Name the layer as "graphic" 2. Right click on the "graphic" label and select "Add Motion Guide" from the pop-up window. 3. A new layer will appear on top of the "graphic" layer with the label "Guide:graphic" along with the guide icon. 4. Draw the path for your symbol in this new layer using pencil or line tool. For example: I drew a circle for my car. 5. Select frame 50 of guide layer and press "F5" to insert frames. 6. Now go to "Frame 1" of "graphic" layer and drag your symbol to one end of your path. While dragging, you will see a bubble on the symbol. That bubble should go right below the path. Something like the one shown below.

7. Now go to "Frame 50" of "graphic" layer and press F6 to insert a new keyframe. 8. Now drag your symbol to other end of your path. Again, the bubble should go right below the path.
razlann@yahoo.com

FLASH tutorial

9. Select any frame between 1 to 50 of your "graphic" layer. Right click and select "motion tween" from the pop-up menu. That's it, you are through. Press Ctrl+Enter to view your work.

Masking with Flash Masking is revealing portion of your picture or graphic in the layer below. While surfing through net you might have come across lots of beautiful Flash effects such as , some wording with sky background or glitter bordering an object, and wondered "How? What is the logic behind this". The answer for all this is masking. This tutorial will teach you the basics of masking in Flash MX 2004. The download .fla file is also included at the end of the tutorial. I shall start this tutorial assuming that the reader has basic knowledge of flash such as

Shape

Tween and . working with layers


Okay! if you are ready, just follow the steps given below. STEPS TO FOLLOW Inserting Layers and Naming them By default you will have a layer in your timeline window. Insert one more layer, totally you need two layers to mask an object. Rename the top layer to "Mask" and the layer below that to "background". Creating Shape Tween Import your picture to the "background" layer. Using Oval tool from your tool box, draw a circle in your "Mask" layer and delete it's border.
razlann@yahoo.com

FLASH tutorial

Drag the circle to one end of your picture. Now go to"frame 40" of your "Mask" layer and press "F6" to insert a new keyframe. Now go to "frame 40" of your "background" layer and press "F5" to insert frames, so that your background image is available all through your mask. Select "frame 40" of your "Mask" layer, that is your new keyframe, Keeping the playhead on "frame 40" of "Mask" layer, drag the circle to other end of your picture. Now go back to "frame 1" of your "Mask" layer, keeping the playhead on "frame 1" of your "Mask" layer, select Shape tween in your properties window. Masking Right click on the "Mask" layer (the area where you named the layer not where the frames exist) and select Mask. Your Mask is all ready. Press Ctrl+Enter to view your Mask.

Below is an example to give you more ideas on Masking.


*actual picture is animation

Flash Fade In and Fade Out Effect Learn how to fade an image in Flash MX. You can use this fading effect on images and text and it is a very common Flash effect STEPS TO FOLLOW 1. Open a new file. Go to File >New. A Screen called New Document will appear. Select Flash Document and click on OK. Go to Modify>Document and give a file size of 300px by 200px. This is the same size as the Bitmap pictures we have. 2. Select the Bitmap pictures that you want to Fade in and Fade out from your picture file and bring it to the Flash Library. Select File>Import to Library from the Menu Bar. A Screen named Import To Library will open. Choose the file name and click on Open. Repeat these steps for all the Bitmap pictures. To open Library, go to Window>Library. You can see the pictures in the Library panel. 3. Drag the picture from the Library panel to the Stage. Select the picture by clicking on it. Go to Modify>Convert To Symbol from the Menu Bar. A dialog Box named Create New Symbol will appear. Give the name as pic1_mc. Select Movie Clip. Click on OK. 4. Click on your Movie Clip. Go to Frame 15. Insert a Keyframe. Right click on layer 1 in the
razlann@yahoo.com

FLASH tutorial

middle of the frames 1 to frames 15. The frames will become black. Select Create Motion Tween. An arrow from frame 1 to frame 15 will appear. Again click on Frame 30. Insert a Keyframe. A second arrow will appear automatically. 5. Click on Frame 1. Here we will give the fade in effect. Select the picture by clicking on it. Go to Properties in the panel below the Stage. Go to Color>Alpha give 0% to it.

Your picture has faded in. Click on Frame 30. Here we will give the fade in effect. Select the picture by clicking on it. Go to Properties in the panel below the Stage. Go to Color>Alpha give 0% to it. 6. Repeat the steps 3 to 5 in layer 2 from the frame 31 to 45 to 60. To make a new layer, click on the following button which is on the right side below the layers. Repeat the above steps for all the images in new layers and you will create a simple fade in and fade out Flash animation. Press on Ctrl+Enter to see the Fade in & Fade out Effect of the 4 pictures.

Zoom in Zoom Out Flash Animation with Fading Effect This tutorial will teach you how to create a simple zoom in & zoom out animation with fade-in and fade-out effect in Flash. You can use this zooming effect on any image or text. STEPS TO FOLLOW Open a new flash file (Ctrl+N). The New Document window will appear. Select General panel and choose Type: Flash Document. Press OK. If your timeline window is not open, press (Ctrl+Alt+T). Now you can see a single Layer called "Layer1" in your timeline Window.

razlann@yahoo.com

FLASH tutorial

Select the first frame. Import a background image onto stage, preferably an image of a street by

clicking on File>Import>Import to Stage, or just press (Ctrl+R). Press F8, to convert this image to a symbol. Name this Symbol "background_gr" and choose graphic behavior. Press OK. Name this Layer "bg". On the 35th frame press F6 to insert a new frame.

Select the second layer. Import an image or create a shape of a car using shape tools from the tool box. Press F8, to convert this image to a symbol. Name this Symbol "car1_m" and choose movie clip (F8). Press OK. Name this Layer "car1". Select the image(car1_m) >right click>edit in place. Now you will come to a new timeline Window called Symbol2

On Frame1 of Symbol2 convert the image to a graphic (car1_gr). Go to the Properties Bar>Color>Alpha>0%. In Frame5 insert a new Key frame (Press F6) and change Alpha to 100% and make the image small. Eg : Pic Right click in between Frame1 and Frame5 and press motion tween. Add one more Key Frame in Frame20. In this frame make the Image(car1_gr)bigger and move it

razlann@yahoo.com

FLASH tutorial

out. Eg: On Frame25 insert a new key frame and change Alpha to 0% . Insert motion tween in between frame5-20 and Frame20-25. eg: Now press (Ctrl+Enter) to view your motion tween. Continue to do this for your other car images. Remember to insert only ONE symbol/image in ONE new Layer only. Congratulations! You have successfully created a Zoom In/Zoom Out animation with Fade In and Fade Out effect!

NOTES

Blur Effect in Flash 8.0 Steps to Follow : Step 1: Import an image and create a movie clip Open Flash 8.0. Select New/Flash Document. Import the image you would like to blur by clicking on File/Import to Stage and select the

razlann@yahoo.com

FLASH tutorial

image. Select the image on the stage and choose Modify/Convert To Symbol. Name the symbol blur and choose Movie Clip as Type. Step 2: Create the blur effect Select the blur symbol on the stage. In the Properties Inspector, choose the Filters tab Click on the '+' icon and choose Blur. Choose 100 for Blur X and Blur Y and Quality as Medium.

Step 3: Create the animation In the timeline window right click on the 50th frame choose insert keyframe. Select the movie clip and change the blur filter X and Y values to 0 to remove the blur effect. Select any frame between Frames 1 and 50 and select Motion from the tween pop-up menu in the Property inspector. Press Ctrl+S to save your changes. Press Ctrl+Enter to view your animation. You can also blur only the X coordinates by removing the lock icon in the filters inspector and changing Blur X to 100 and Blur Y to 0. The effect can be seen below. You can try different blur effects by simply adjusting the blur X and blur Y values.

Bouncing Effect in Flash This tutorial will teach you how to create a bouncing effect animation using Motion Tween and Shape
razlann@yahoo.com

FLASH tutorial

Tween in Flash MX 2004.In the demonstration, the bouncing heart animation is created using motion tween and the shadow effect using shape tween. TO CREATE MOTION TWEEN Steps to Follow : Create a Symbol First draw an object for Motion Tween. Like in the above demonstration I used heart. Select the object you have drawn and press F8 to convert this object to a Symbol. In the Symbol window which appears now. Name this object heart_mc, choose Movie clip behavior and bottom center square for registration. Press OK.

Create a Motion Tween Double click on the Layer and type "Heart". Select Frame 30 and press F6 to insert a keyframe. Select Frame 15 and press F6 to add another keyframe. With the playhead still on Frame 15, hold the Shift key to move the heart_mc in a straight line, and drag the heart_mc up. Select any frame between Frames 2 and 14 and select Motion from the tween pop-up menu in the Property inspector. Select any frame between Frames 16 and 29 and select Motion from the tween pop-up menu in the Property inspector. Press Ctrl+S to save your changes. Create a Shape Tween Insert a new Layer and call it "Shadow". Select the first frame in the Shadow Layer, draw borderless shadow relevant to your Symbol. If your Color Mixture Window is not open, press Shift+F9 to open it. Select Eyedropper tool from your Tool box. Click it on your shadow. Now go to Color Mixture

Window and type 25% for Alpha value.

razlann@yahoo.com

FLASH tutorial

Select Frame 30 and press F6 to insert a keyframe, then select Frame 15 and press F6 to insert a keyframe. With the playhead on Frame 15, select the Free Transform tool. Slightly reduce the size of the Shadow. With Frame 15 still selected, select the Eyedropper tool in the toolbar, and then click on your shadow object. Now go to Color Mixture Window and change Alpha value to 10%. Select any frame between Frames 2 and 14 on the Shadow layer. In the Property inspector, select Shape from the Tween pop-up menu. Select any frame between Frames 16 and 29 on the Shadow layer. In the Property inspector, select Shape from the Tween pop-up menu. Now its time for Final touch up Select Frame 1 of the Heart layer. Press F6 to add a keyframe. A new keyframe is added, and the playhead moves to Frame 2. Go back to frame 1, select the Free Transform tool from your toolbox. Select the transformation center point (the small circle near the center of the movie clip) and drag it to the bottom of the heart. On the Stage, drag the upper middle transform handle down to slightly compress the heart shape. Right-click Frame 1 of the heart layer and select Copy Frames from the context menu. Go to 29th frame and press F8 to insert a new keyframe. Right-click 29th frame and choose Paste Frame from the context menu. Click on the Stage, away from any objects. Type "28" in the Frame Rate text box of your Property inspector window. On the heart layer, select any frame between Frames 2 and 14. Then in the Property inspector, in the Ease text box, type 100. Similarly select any frame between Frames 16 and 29 in the same layer, then go back to Property inspector window and type -100 in the Ease text box. Do the same thing to the Shadow layer. Press Ctrl+Enter to view your animation.

razlann@yahoo.com

FLASH tutorial

Flash Ripple Effect This tutorial will teach you how to create a simple Ripple effect in Flash MX 2004. STEPS TO FOLLOW Create a Graphic Symbol. Import an image to your work area upon which you would like to create ripple effect. Press F8, to convert this image to a symbol. Name this Symbol "girl_gr" and choose graphic behavior. Press OK. Name this Layer "bg". Select girl_gr 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 "ripple_mc" and choose Movie clip behavior. Press OK. Drag girl_gr to your working area from Library (ctrl+L). Select girl_gr and choose Alpha 0% from color list box in your property window. Insert Keyframe (F6) into the 5th frame. Remaining on the 5th frame, Select girl_gr and choose Alpha 99% from color list box in your property window. Now 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 girl_gr and choose Alpha 0% from color list box in your property window. Select 15th frame, choose Motion Tween from Tween list box in your property window. Insert a new layer above this layer, call it "Layer 2". Select frame 1 of Layer 2 and draw a borderless square or rectangle depending on the type of ripple effect you want. In the above demonstration, I have used rectangle with 15 pix as its height. Place this vector wherever you want the ripple to begin. Make sure that the vector belongs only to layer 2. Insert Keyframe into the 20th frame of Layer 2. Place the vector wherever you want the ripple to end or ebb. In the above demonstration, I have placed it right at the bottom and reduced the height to 5 pix. Select 1st frame, choose Shape Tween from Tween list box in your property window. Right click on Layer 2 and select Mask. Save (ctrl+S). Make it a habit to save your work after each step you do.

<! -go og le_ ad _cl ien t= "p ub 11 48 38 70 67 24 84 65 "; /* 30 0x 25 0, cre ate d 11 /1 9/ 08 */ go og le_ ad _sl ot = "5 69 28 36 95 3"; go og le_ ad _w idt h = 30 0; go og le_ ad _h eig ht = 25 0; //->g oo gle _p rot ect An dR un ("a ds _c or e.g oo gle _r en de r_ ad ", go og le_ ha nd le Er ror , go og le_ re nd er _a d);

Insert Ripple Movie Clip onto Scene 1 1. Now go back to Scene 1. 2. Insert a new layer above bg layer and call it ripple1.
razlann@yahoo.com

FLASH tutorial

3. Insert new Keyframe (F6) into the 10th frame of ripple1 layer. 4. With 10th frame of ripple1 layer selected, Drag ripple_mc movie clip onto the working area. Place it appropriate to girl_gr. Make sure that this movie clip is placed exactly where you had placed your square or rectangular vector in ripple_mc Movie clip. 5. Insert frame (F5) into the 30th frame of ripple1 layer. This is just to make sure that the ripple _mc runs only for 20 frame. 6. Insert another new layer above ripple1 layer and call it ripple2 7. Insert Keyframe into the 20th frame of ripple2 layer. 8. With 20th frame of ripple2 layer selected, Drag ripple_mc movie clip onto the working area. Place it appropriate to girl_gr just the way you did in step 4. 9. Insert frame (F5) into the 40th frame of ripple1 layer. This is just to make sure that the ripple _mc runs only for 20 frame. 10. Insert frame (F5) into the 40th frame of bg layer. Here you go!! Your movie is ready. Press Ctrl+Enter to view your movie. Wasn't it simple. Okay now few things to Note - In the above demonstration I have created a subtle ripple effect. If you want the ripples to be more prominent, you can add few more layers of ripple_mc movie clip and reduce the Keyframe differences between layers. Like in the tutorial above, ripples appear every 10 frames. You can reduce this period and make it appear every 5 frames, which would make the ripple effect more prominent.

razlann@yahoo.com

FLASH tutorial

Circular Ripple Effect in Flash This tutorial will explain how to create a simple circular Ripple effect in Flash MX 2004 Example:

www.primacysearch.com STEPS TO FOLLOW


Create a Graphic Symbol. Import an image to your work area upon which you would like to create ripple effect. Press F8, to convert this image to a symbol. Name this Symbol "girl_gr" and choose graphic behavior. Press OK. Name this Layer "bg". Select girl_gr 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 "ripple_mc" and choose Movie clip behavior. Press OK. Drag girl_gr to your working area from Library (ctrl+L). Select girl_gr 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 girl_gr and choose Alpha 99% from color list box in your property window. Now 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 girl_gr and choose Alpha 0% from color list box in your property window. Select 15th frame, choose Motion Tween from Tween list box in your property window. Now go to frame 5 and reduce the size of girl_gr, maybe by 5pix width and height. Go to frame 20 and increase the size of girl_gr, maybe by 5pix width and height. Insert a new layer above this layer, call it "Layer 2". Draw a borderless circle. Which would look something like the one shown below

razlann@yahoo.com

FLASH tutorial

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. Position the white circle such that it is right at the center of the black circle. Now, cut the white circle and paste it (Ctrl+Shift+V) in the black circle layer. Click somewhere outside, so that you deselect either of the circles. Now click on the white circle and delete it

Your borderless circle is ready! Place this circle right at the center of girl_gr but make sure that this circle resides in Layer 2. Insert Keyframe (F6) into the 20th frame of Layer 2. Remaining in 20th frame Increase the size of the circle. Note, the increased diameter decides where you want the ripple to end or ebb. Now go back to 1st frame, choose Shape Tween from Tween list box in your property window. Right click on Layer 2 and select Mask. Save (ctrl+S). Make it a habit to save your work after each step you do. Insert Ripple Movie Clip onto Scene 1 1. Now go back to scene 1. 2. Insert a new layer above bg layer and call it ripple1. 3. Drag ripple_mc movie clip onto the working area. Place it right at the center, just the way you placed the circle in ripple_mc Movie clip. 4. Insert frame (F5) into the 20th frame of ripple1 layer. This is just to make sure that the ripple _mc runs only for 20 frame. 5. Insert frame (F5) into the 30th frame of bg layer. Here you go!! Your movie is ready. Press Ctrl+Enter to view your movie. Wasn't it simple. Tips: Inserting 1 ripple_mc Movie clip is sufficient if your picture is approximately the size of the picture as shown in the demonstration. If your picture is really big, you might have to insert more than 1 layer of ripple_mc movie clip. See to that the difference between the appearance of each movie clip is 5 frames. Actually the difference basically depends on the type of effect you want. So you can adjust it the way you want.

razlann@yahoo.com

FLASH tutorial

Sparkling Glass Effect in Flash


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.

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.

razlann@yahoo.com

FLASH tutorial

Go to the Properties window. Go to Options. A screen called Tool Settings will appear.

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.

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. Create another movie clip with a star which becomes smaller at a slower rate than our 1st star movie clip.
razlann@yahoo.com

FLASH tutorial

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. 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. 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.

Photo Slideshow Gallery in Flash 8.0 Learn how to create a Photo slideshow in Flash 8.0 using the in-built Flash Photo Slideshow template Steps to Follow : Step 1: Create and export your images

razlann@yahoo.com

FLASH tutorial

Each image should have a size of 640 x 480 pixels. Export the images in a numbered sequence. For example, for three files, the names could be photo1.jpg, photo2.jpg, and photo3.jpg. We recommend .jpg format for photographs. Step 2: Create the photo slideshow file and import the images Open Flash 8.0. Click on File/New. Chose the Templates tab. Select Photo Slideshows. Click on OK. You will see a ready-made Flash photo slideshow created. Press Cntrl+Enter to view the file. Press the auto play button to view the slideshow. To replace the images with your own, select the bottom layer called picture layer and click on the trash can icon to delete it. Create a new layer by clicking the Insert Layer button, and name this new layer My Photos. Make sure that this new layer is the bottom layer. Select the first blank keyframe in the My Photos layer, select File > Import > Import to Stage, and locate your photo sequence. Select the first image in the series, click Add, and click Import. Flash recognizes that your image is part of a series and asks you to import all files in the series. Click Yes to complete the import process. Flash places each image on separate keyframes. You can move the images so they are centered in the stage or you can choose the images on the stage and make the X and Y coordinates 0 so they are centered in the stage. Your images appear in the Library panel and can be replaced later if needed by double clicking on the image in the library window and clicking on the import button to select the new image file. You can safely delete the old images that were included in this document from the library if you wish, they are saved in the photos folder. If you have more than four images, make sure that all the other layers have an equal number of frames. Select the frame and click on F5 to add new frames. Change the captions for the images, by replacing the text in the Captions layer and adding new keyframes with text for the new images. You do not have to worry about the photo number field. The template automatically determines how many images are in your document and indicates which photo you are currently using. Change the title in the Title, Date layer. Press Ctrl+Enter to view the completed Flash Photo Slidshow. Congratulations! You have successfully created a Flash photo slideshow in a few simple steps using the in-built Flash 8.0 Photo slideshow template. The Photo Slideshow template also has a built-in autoplay mode that automatically changes the photo after a set delay. The template is set to a default delay time of 4 seconds, but you can change this setting easily. Steps to adjust the delay: Unlock the _controller layer. Select the controller component. Display the Parameters tab in the Component inspector by selecting Window > Component Inspector. The Parameters tab is selected by default. Select the delay and change this value to a new delay value in seconds. Save and publish your document.

razlann@yahoo.com

FLASH tutorial

3D Animation in Flash CS5 This is a tutorial on how to rotate objects in a 3D motion using the 3D Rotation Tool in Flash CS5. Before starting with the actual rotation of an object in 3D, follow the following steps to understand the concept and the basic tools and utilities in Flash CS5 that will be used to go through the tutorial. 1. Start Flash CS5 using the shortcut icon from your systems desktop. 2. Choose ActionScript 3.0 under the Create New area to load a new file that uses Actionscript 3.0 as its basics. 3. Choose SMALL SCREEN from the interface type drop down list. The interface type drop-down is available on the right of the menubar area, refer Figure.

4. Invoke the Rectangle Tool from the Tools panel and create a rectangle in the stage area ( the stage area is the white area in flash where we do all of our artwork). Make sure that the Height of the rectangle is more than its width. 5. Select the rectangle from the stage area and choose Window > Transform from the main menubar; the TRANSFORM options dialog box is displayed, refer Figure.

The TRANSFORM dialog box is used to transform the selected shape in the stage area. In this case, the options in this dialog box are not highlighted. To make them work we need to transform the selected shape into a movie clip. 6. Double-click on the rectangle created in the stage area and choose Modify > New Symbol from the main menubar; the Create New Symbol dialog box is displayed, refer Figure.

razlann@yahoo.com

FLASH tutorial

7. Name the symbol as Box1_mc and choose the OK button; the selected shape is converted into a movie clip. The name Box1_mc is followed by mc which means that it is a movieclip. To name a movieclip follow it with mc, in case of button use btn. This naming convention help;s a lot while doing actionscripting in flash. 8. Select the Box1_mc movieclip from the stage. Press and hold the ALT key and make a duplicate

copy of it. Align them together as shown in Figure. 9. Select the left box and in the TRANSFORM dialog box set Y = -40 under the 3D Rotation area and for the right box set Y = 40 and align them, refer Figure. 10. Press CTRL + a to select both the objects in the stage area. Next, try playing with the x, y, and z values under the 3D Rotation area. On doing so, the objects rotate in the 3D world, refer Figure. 11. Select the first keyframe in the timeline, right click on the selected frame a flyout is displayed. Next, choose Create Motion Tween from the flyout. 12. Move to the last frame and drag it to frame 55 and choose Window > Transform from the

main menubar; the TRANSFORM window is displayed. Try changing the values in this window; the result is displayed on the stage area. 13. To test the animated movie, hold down the CTRL key and press ENTER; a new window is displayed showing the published flash animation. Using this concept and the traditional timeline animation you can animate any shape in 3D by
razlann@yahoo.com

FLASH tutorial

just setting the keyframes

razlann@yahoo.com

You might also like