Flash Help

Help Links

What is Flash?

Flash movies are graphics and animation for Web sites. They consist primarily of vector graphics, but they can also contain imported graphics and sounds. Flash movies can incorporate interactivity to permit input from viewers and you can create nonlinear movies that can interact with other Web applications. Web designers use Flash to create navigation controls, animated logos, long-form animations with synchronized sound, and even complete, sensory-rich Web sites. Flash movies are compact, vector graphics, so they download rapidly and scale to the viewer’s screen size.

Different types of graphics:

2 types of graphics:

Raster – composed of a grid, or raster, of small squares called pixels each of which can be a different color. (Bitmap)

Vector—composed of lines, curves, and other geometric shapes that are defined by a set of mathematical instructions. A vector graphic is a computer image stored and displayed in terms of vectors rather than points, allowing for easier scaling and storage.

Raster requires much more memory because of large number of pixels necessary to create lines.

Flash Terminology and Work Environment

Panels—these are like palettes in Photoshop. They can float or be docked. Panels can be accessed through the Windows Menu.

Stage—the rectangular work area where the movie plays

Timeline—where graphics are animated over time

Scene—an individual segment of a movie

Stroke—the outside border of an object or shape

Fill—the inside part of an object or shape

Symbols—the reusable media assists of a movie

Library—where symbols are organized

Some things to know--

Keyframes can be identified two ways

bullet

by having a small black outline of a circle in them (this indicates the frame is empty.)

bullet

by having a solid black dot in them (Objects are in this frame.)

All other normal frames appear empty as they are by default.

****When you want to make a change in what’s happening in the movie, you convert a normal frame into a Keyframe. (right click in the frame and select, INSERT KEYFRAME.****

Flash Tips:

Use SHIFT to make a shape a perfect square or circle.

If you don’t want a border around your object: immediately after using the circle or square drawing tools, press and hold the CTRL key. This changes the shape tool temporarily into the selection tool. Line up the tip of your pointer on the outermost edge of the shape and click once, then press delete. Repeat the process for other sides. If the shape becomes selected, click outside of it to deselect.

The Arrow tool lets you select entire objects by clicking an object or dragging to enclose the object within a rectangular selection marquee.

To select a stroke, fill, group, instance, or text block:
Select the Arrow tool and click the object.

The Stroke Color and Fill Color controls in the toolbox let you select a solid stroke color or a solid or gradient fill color, switch the stroke and fill colors, or select the default stroke and fill colors (black stroke and white fill). Oval and rectangle objects (shapes) can have both stroke and fill colors. Text objects and brush strokes can have only fill colors. Lines drawn with the Line, Pen, and Pencil tools can have only stroke colors.

The toolbox Stroke Color and Fill Color controls set the painting attributes of new objects you create with the drawing and painting tools. To use these controls to change the painting attributes of existing objects, you must first select the objects on the Stage.

To select connected lines:
Select the Arrow tool and double-click one of the lines.

To select a filled shape and its stroked outline:
Select the Arrow tool and double-click the fill.

To select objects within a rectangular area:
Select the Arrow tool and drag a marquee around the object or objects that you want to select.
Instances, groups, and type blocks must be completely enclosed to be selected.

Grouping objects:
To manipulate elements as a single object, you need to group them. For example, after creating a drawing such as a tree or flower, you might group the elements of the drawing so that you can easily select and move the drawing as a whole.
When you select a group, use the Property inspector. You can edit groups without ungrouping them. You can also select an individual object in a group for editing, without ungrouping the objects.

To create a group:
Select the objects on the Stage that you want to group.
You can select shapes, other groups, symbols, text, and so on.
Choose Modify > Group, or press Control+G

To ungroup objects:
Choose Modify > Ungroup, or press Control+Shift+G

To resize a selection, right-click and choose Scale.

To make an object move, usually you must convert the object to a symbol, unless you want to move and change colors and/or shapes.  Then you can use a shape tween and you will not want to convert the object to a symbol.

For each independently moving object, you must create another layer.

To create a motion tween, do the following:

bullet 1- Select graphic and convert to a symbol
bullet 2- Insert another key frame
bullet 3- Create a motion tween between the first keyframe and the next keyframe

To rotate a symbol, double-click the keyframe at the beginning of the group of frames, and choose Rotate:  CW or CCW and how many times.

The effect of flipping a symbol like a coin is done by selecting the group of frames as above, and Scale, then drag the handles to reverse the symbol.

Double-clicking a keyframe in the timeline selects that frame and all frames that follow until the next keyframe.  (This enables a morph or other change to occur over many frames.)

Path animation may be done in Flash by using a Guide Layer.  Select a layer, and then insert a guide layer for it.

For your assistance in creating an original animation you may wish to refer to the Flash Labs we have done:

bullet

Lab 2 - frame by frame animation

bullet

Lab 3 - moving a symbol

bullet

Lab 4 - moving with rotation and flipping

bullet

Lab 5 - shape tweens (morphing)

bullet

Lab 6 - animating more than one symbol at a time

bullet

Lab 7 - fading and zooming in (using alpha)

bullet

Lab 8 - path animation (airplane)

bullet

Lab 9 - adding an SWF file to a web page

bullet

Lab 10- Masking text or an image

bullet

Lab 11- Actions using buttons to start, stop or hyperlink

This web site is for use of the Brazoswood Web Mastering classes.  If you have questions,  you may contact Pat Hubert

GIF Source: BestAnimations.com. "Dog animation." [online image] 9-15-1999. http://www.bestanimations.com/Animals/Mammals/Dogs/Dogs.html .