Introduction to Flash


Introduction to Flash

Flash is a very interactive and an easy to learn multimedia graphic tool that is used on the Web. Formerly known as Shockwave flash, it has become the most widely used for creating animations, advertisements, presentations, applications, videos and special effects effectively.

Flash was created and introduced by Macromedia in the year 1996. Flash is currently developed and marketed by Adobe Systems. Flash has the ability to manipulate vector graphics and it supports bi-directional streaming of audio and video. Flash contains a scripting language called ActionScript.

Flash is best suited for creating contents over the internet because its files are very less in size. Flash uses Vector Graphics. This occupies less space than the Bitmap graphics.

Get Started With Flash

To begin Flash,

1. Click Start –> All Programs –> Macromedia –> Macromedia Flash 8.

    

The Macromedia Flash Professional 8 window is displayed.

    

2. Create a new Flash Document by clicking Flash Document from Create new column.

    

3. A new Flash document is opened.

    

Parts of a Flash Document

A Flash document consists of four parts:

1. Stage

2. Timeline

3. Library

4. ActionScript code

Stage

Stage is the space in your Macromedia Flash document where you can place graphics, text boxes, video clips, buttons etc. The stage appears in the Flash document during Playback.

    

Timeline

The timelines are used to organize and control content in layers and frames. The Timeline is where you tell Flash when you want the graphics and other elements of your project to appear.

    

The major components of timelines are:

1. Layers

2. Frames

3. Playhead

Layers: Layers are similar to a stack of strips placed one over the other. Each can contain a new image which appears on the stage. Layers are listed in a column next to timeline.

    

Frames: Frames are contained in each layer. These frames are located to the next to the layers.

    

Playhead: The Playhead displays the current frame that is used on the stage. Playhead moves through the timeline when the Flash document is played.

Library

Library Panel in Flash displays a list of media elements used in the document. To view the library panel go to Window –> Library.

    

The Library is displayed to the right most corner of your Flash document.

    

ActionScript

The ActionScript code is used to add code that enables an interactive activity for your graphic. For example: You can add a code to a button to display an image once it is clicked.

Flash Tool bar

The flash tool bar is located to the left hand corner of the Flash document.

    

Tools Tool Name
Selection Tool
Sub Selection Tool
Free Transform Tool
Gradient Transform Tool
Line Tool
Lasso Tool
Pen Tool
Text Tool
Oval Tool
Rectangular Tool
Pencil Tool
Brush Tool
Ink Bottle Tool
Paint Bucket Tool
Eye Dropper Tool
Eraser Tool
Hand Tool
Zoom Tool
Stroke Tool
Fill Color
Snap to Objects

Pencil Tool

    

The pencil tool is more like using your pencil to draw free hand drawings. To use the pencil tool just drag the tool on to the stage and draw.

Pencil Modes: The 3 pencil modes you can make use are

1. Straighten

2. Smooth

3. Ink

Using these modes you can draw the picture accordingly.

    

Brush Tool

The brush tool allows you to draw strokes. It allows you to create special effects also.

Brush modes: Whenever you use the brush tool, the brush mode tool window is displayed.

    

You can choose from the drop down list and draw using the brush.

Brush Size

In the Brush Options you can choose the drop down list to select the size you want.

    

Brush Shape

You can also use a different kind of brush. With every brush you choose you can paint in different strokes.

    

Line Tool

    

Line tool is similar to drawing using a pencil with a ruler. To use the line tool just drag on the stage. This generates a line between 2 end points.

Drawing a Curved Line

A straight line can be changed into a curved line using the arrow tool.

    Tool Box : Arrow
To draw a curved line:

1. Select the Arrow tool.

2. Click the line while holding the mouse and drag the curve.

3. Release the mouse button.

Oval Tool

    

The Oval tool is used to draw circle on the stage. To make use of the Oval tool just drag the oval on to the stage.

Rectangle Tool

    

The rectangular tool is used to create rectangular objects. Just drag the tool on to the stage.

Eraser Tool

The eraser tool works very similar to a perfect eraser. To use the eraser just drag the tool on to the stage.

    

Ink Bottle Tool

    

The Ink Bottle tool allows you to change the stroke color, the line width and the style of lines or the shape outlines.

To use the Ink Bottle tool:

1. Select the Ink Bottle Tool

2. Choose the stroke color

The Paint Bucket Tool

    

This is used to fill color to the enclosed areas. Using the Paint Bucket tool you can fill the empty areas and change the color of the filled areas as well.

Eye Dropper Tool

    

The eye dropper tool is used to copy fill and stroke attributes.

Pen Tool

    

The Pen tool is a tool in the Flash toolbox. It is not an ordinary pen but works in a different way. The main purpose of using a pen tool is to draw straight lines, flowing or smooth lines.

New Year Card


New Year Card

Create a beautiful New Year Card to wish all your friends a Very happy New Year!! Just follow the steps given below:

1. Open a New Flash Document, set the stage size to 500 px X 400 px and the Frame rate to 5 fps.

    

2. Set the Background color to black.

3. Now, rename Layer1 as text, using the text tool, type �Happy New Year 2009!!!� I used Monotype Corsiva with 30 as the font size.

    

4. Now click Frame 15 and Insert KeyFrame, and change the positions of the text.

5. Again Insert KeyFrames on 30,40,50,60 and 65 and change the position of the text.

6. Lock this layer and create a new layer and name it FireWorks.

    

7. Click Insert–>New Symbol and name it, Fireworks.

    

    

8. Create an image as shown below:

    

9. Select the image using the selection tool and change its position by dragging it to the left of the stage.

    

10. Select the Image using the selection tool.

11. Click Modify–>Convert to Symbol. Name it Spark and select Movie Clip as its behavior.

    

    

12. Select the Free Transform tool and move the position of spark to the reference point.

    

13. Click Window–>check the align option.

    

    

14. Click the Transform tab, in the Rotate option type 30 degree and click the apply transform icon.

    

15. Click the cursor on the black screen as shown below until you draw a neat circle.

    

Your figure should look like this:

    

16. Select the entire image, click Properties –>Filters–>�+�–>Glowand change the following parameters.

    

Blur X: 10

Blur Y: 10

Strength: 240%

Quality: Low

Color: White

11. Right click one of the spark, select Copy and paste it in the page place. Now you will have another set of sparks on the stage.

12. Use the free transform tool and position the second set of sparks with a different dimension as shown.

    

13. Repeat this to get a spiral image as shown:

    

14. Select the entire image using the selection tool. Click Modify–>Convert to symbol. Name the symbol and choose Movie Clip as its behavior.

    

15. Click the 10th Frame on layer 1 and Insert KeyFrame.

16. Now click Frame 1 and Select the entire image once again, and shrink the image to 1/4th its size using the Free Transform tool.

    

17. Right click Frame 1 and select Create Motion Tween from 1st frame to the 10th Frame.

    

18. Click the 16th Frame and Insert another KeyFrame and Create another Motion Tween.

    

19. Click the last frame and change its Alpha color to 0%.

    

20. Go back to the main time line and drag the Sparks to the bottom left corner of the stage and change its color to red.

21. Create 4 new layers.

22. On the 2nd layer click the 6th Frame–>Insert KeyFrame,

23. Drag the firework movie clip to the top left corner of the stage and change its color to Green.

    

24. On the 3rd layer click the 10th Frame–>Insert KeyFrame.

25. Drag the firework movie clip to the top right corner of the stage and change its color to Blue.

26. On the 4th layer click the 15th frame–>Insert KeyFrame.

27. Now insert a Blank KeyFrame on the 15th frame of all the layers.

28. Insert another new layer and name it Actions.

    

29. On the 15th Frame of Actions layer, Insert KeyFrame.

30. Right click the 1st frame on Action layer, click �+�–>Global Functions–>Timeline Control–>Stop.

    

31. Now its time you attach a sound to make your card more effective. Create a new layer and name it sound.

    

32. Click File–>Import–>Import to Library, and choose a sound file:

    

33. Click the Sound layer, and choose the sound file from the Properties Window drop down:

    

34. The timeline will look this way:

    

35. Save your work and Test Movie.

    

Download .fla File of New Year Card

Download .swf File of New Year Card