Graphics & Animations: Flash

What we have for you in this section.......................

Introduction
Drawing Tools
Brushes
Paint Bucket
 Eraser Tool
Modifying the Movie Properties
Flash controls

Introduction

Flash is one of the revolutionary technologies on the Internet through which rich multimedia content sites can be developed with ease. Flash is a vector-based program, which in simple terms means that the graphical information is stored in the form of mathematical formulae rather than pixel tables.

Vector information takes up lesser space compared to storing individual pixel values which results in Flash files being much smaller than their animated graphical counterparts.

In addition to animations, Flash can be used to make really complex multimedia content with interactivity and sound. Drop down or scrolling menus, animated buttons, custom animated cursors and even games can be made with Flash.

Flash is similar to other graphic programs as far as its drawing tools are concerned, which makes the learning curve easier if you have worked on Adobe PhotoShop or Paint Shop Pro.

The series of lessons in this tutorial guide you through the basic concepts of Flash such as:

• Drawing tools.

• Frames, Layers and the Stage.

• Movie properties.

• Basic controls and commands available in the Flash menu.

• Embedding Flash in HTML pages.

• Symbols and why they are required.

• Creating and modifying symbols.

• Inspectors.

Note: This tutorial is based on Flash version 4. Evidently, users of version 5 will have more features at their disposal. 

                                                                                          TOP                      

Drawing Tools

In addition to its main use, generating multimedia content, Flash provides a good interface for creating graphics from stratch. Graphics created in Flash can be saved in gif, jpg, png or other formats. Its vector capabilities allow for easy scaling without loss in quality or detail. With a bit of creativity you can easily make cartoons or other clipart... the swami and the apple below, took me less than 5 minutes !

There are five drawing tools in Flash, the rest are used to modify various aspects of the drawing. The drawing tools are found in Drawing Toolbar, which should be docked at the left side of the screen when you first start Flash. If you don't have this toolbar open, click on Window - Toolbar..., check the box in front of Drawing and click OK.

Flash drawing tools:

Line Tool

Oval Tool

Rectangular Tool

Pencil Tool

Text Tool

Flash also has two tools for selecting objects: the Arrow tool and the Lasso Tool . If you are familiar with graphic software, you should have no problems in guessing the function of these tools. However, in Flash, their usefulness has been increased by modifiers.
You can select an object with the arrow tool by either clicking on it directly or dragging a rectangular shape around the object with the left-mouse button pressed. The Lasso tool on the other hand provides a much more free form for selection. It is generally used to select irregularly shaped objects.

The Line tool is used for making straight lines. When activated the Line tool presents a set of modifiers below the toolbar. These modifiers control the various properties of the line such as thickness, color and style.

Geometrical shapes such as rectangles, squares, circles or ovals are drawn using the Oval Tool and the Rectangular Tool . Evidently, the oval tool is employed for making ovals and circles while the rectangular tool makes squares and rectangles.The Pencil Tool functions similar to an ordinary pencil.Using the Text Tool you can add text to Flash movies.                         

                                                                                                      TOP                   

Brushes

Brushes in Flash are slightly different from those in standard graphic software. The main difference lies in how you can selectively paint the components of an object. This is accomplished by choosing the correct brush mode from the Brush Mode Modifier.

The modifiers of the Brush Tool are described in the image below:

Note that in addition to single colors, you can paint with gradients.
The Brush Size and Brush Shape Drop Down menus let you select the size and the shape of the brush, respectively.
The two Brush modifiers that require further explanation are the Brush Mode selector and the Lock Fill toggle button.

                                                                                                                

Paint Bucket

The function of Flash's Paint Bucket is similar to the one found in other graphics software. You can use either a solid color or a gradient to fill objects with the bucket. However, since Flash is a vector based program, its paint Bucket also has a feature of closing any gaps in the objects' outline. (Note: Very large gaps cannot be closed automatically with the bucket. You have to do this manually using the Arrow tool).

The fill color lets you choose a solid color or a gradient.
Details of the Gap Size Selector modifier are presented in the image below.
The Transform Fill modifier lets you change the properties of gradient fills. For example, linear gradients are applied horizontally. In order to made a vertical gradient, you first have to fill the object with a linear gradient and change its orientation using this modifier.

                                                                                                                TOP

Eraser Tool

The Eraser tool compliments the drawing tools in Flash. On second thoughts, I should have put it in drawing tools category.
It's used for removing unwanted parts on an object. It differs from a similar tool found in standard graphics programs due to the fact that Flash is vector based.

The Erase Mode modifier changes the way the tool handles object components.

Here are some examples:

You can also select the shape and size of the Erase cursor using the drop down menu.

When the Eraser tool it used with the Faucet modifier , you can selectively delete an outline or a fill with a single click. The mouse cursor shape changes to when this modifier is activated.

 

 

                                                                                         TOP

Modifying The Movie Properties

Attributes of the Flash movie can be changed using the Movie Properties window. Click on Modify - Movie to display this window.

.

The Frame Rate determines how fast a movie is played. The default value is 12, which means 12 frames are played per second. Increasing this value will play the movie faster.

The dimensions of the movie can be set throught the Width and Height text fields.

To make drawing of objects and their placement easier, Flash provides a grid that can be turned on by checking the Show Grid checkbox. When used along with the Snap to Grid feature, Grids provide an indispensable tool for helping developers in placing, aligning and creating objects. The Grid Spacing text field takes a number as value and determines the amount of distance between the grid nodes.

Grid color as well as the background color of the movie can be modified by clicking on their respective icons and choosing a color from the palette.

Like other standard graphics software, Flash can display rulers (View - Rulers) and you can set its units through the Rulers Units drop down menu.

                                                                                                                   TOP

Flash Controls

Once your creation is ready, you can check it using either Control - Play or Control - Test Movie.

Click Window - Controller to display the control buttons. These can be used when you are making a complex movie and need to test it regularly. The Controller includes Play, Stop, Rewind, Forward, Step Back and Step Forward buttons.

If your movie includes button symbols, you would need to use the Test Movie option in the Control menu to test their functions.