Flash
- Flash authoring tool - creates files in .fla format and can export into
.swf format which is the Flash movie format for the web
- Flash Player - Necessary to view .swf file in browser; pre installed in
current web browsers and is a free download
- Flash projector - an .exe file which does not require a browser or Flash
player to view; typically distributed via CD-Rom or disk; file size larger
than .swf file because it contains a Flash player. Not a good format for the
web because of the larger file size and hence download time
- Flash interface - Tools, Timeline, Panels, Work Area, Stage, property inspector
panel; within the timeline, there is the playhead which shows which timeline
frame is currently being displayed in the stage; the status bar shows the
number of the current frame, the number of frames per second
- Layers - if a layer is above another in the list of layers, the contents
of that layer will be in front of the contents of the other layer on the stage;
show/hide -- if you hide a layer, it has no effect on the published movie
unlike some graphics programs where hiding a layer will prevent it showing
up in the exported file format
Flash Drawing Tools
- Exercise 1 - Drawing with the Pencil Tool - Click on the pencil tool and
draw something a semicircle -- Notice in the options area at the bottom of the tool box that
there are 3 options for the Pencil tool. Use the Text tool to write the current setting next to your drawing, then change to another setting and redraw the semicircle and use the Text tool to label that one, and then switch to the third option and draw and label that one.- (1) Straighten mode tries to guess
what you are trying to create and it uses that; (2) Smooth changes what
you draw to a lesser extent, and (3) Ink changes it very little. The biggest change is between Straighten on the one hand and the other two settings.
- Ctrl A will select everything on the stage and then you can hit the delete
key to delete everything
- Exercise 2 - Using the Line Tool and Modifying Strokes - Click on the Line Tool and draw a line. Draw other lines to form a closed shape.
- Select the Selection Tool and then click on a line. The line gets thicker
and a dotted pattern appear over it, indicating it has been selected.
- If Property Inspector isn't visible, choose Window>Properties to make
it visible. Stroke Style drop-down menu to change the line, and then deselect
the line to see the changes. Alternatively, Ctrl H hides the selection so
you can see the effect of the change. Stroke Height slider and Stroke Color
box. Custom in Property Inspector allows one to create your own line style.
- Using the Selection tool, move the cursor over the bottom line in the arrow
shape. As you move over the line, a small curved line appears -- this indicates
you are over a line, not a fill
- Click on a line segment - notice that only this line segment is selected;
if you double click on any line segment, all the connected line segments are selected.
- Select Ink Bottle tool (underneath the Paint Bucket tool) - Before we selected a stroke using the Selection Tool and then modified it in the Property Inspector. Alternatively, you can set the stroke properties, then click on the Ink Bottle tool and then on the stroke to modify the stroke. In the toolbox, click
the stroke color icon and select a color from the palette. To delete the stroke, click on the Selection tool, then click
the stroke to select it and hit delete.
- Exercise 3 - Using the Oval and Rectangle Tools - creates strokes and/or fills
that are independent of each other
- Select the Oval Tool. Press and hold the Shift key while dragging --
this constrains to a circle - the circle is created using the current stroke color and the inside of the circle with the current fill color.
- Select the Rectangle Tool. Press and hold the shift key while dragging
- this constrains to a square. In the Property Inspector, you can set the Rectangle corner radius. To set a corner independently of the other corners, click the lock symbol.
- Exercise 4 - Using the Brush Tool to create shapes
- Select the Brush tool and draw a circle. It uses the fill color for
this shape, not the stroke color. The shape created is a fill, and does not have a storke (unlike the oval and rectangle tools, which create both at the same time.
- In the Options area of the toolbox, change the Brush Size and Brush
Shape
- You can use the Ink Bottle to add strokes to the fills you created with
the Brush.
- Exercise 5 - Modifying Strokes and Fills
- To use the Property Inspector to change the color of a fill - e.g. use
the Selection tool to select the fill and in the Property Inspector, change
the fill color
- To use the Paint Bucket to change the color of a fill - just select
the Paint Bucket and click on the fill
- Zoom feature - Ctrl + plus (or Ctrl + equals) or M + click or Z plus
click to zoom in, Ctrl + minus to zoom out, or click on Zoom Tool (the magnifying glass) and then click the area of the stage you
want to enlarge or reduce (Alt key + Zoom tool)
- Undo feature - Ctrl + z (or Edit>Undo)
- To select multiple objects - Hold down the shift key while clicking
each
- To clear all selections - Hit the escape key
- Exercise 6 - Line and Fill as Separate Objects
- Set the fill and stroke colors to different colors and not white - draw
an oval and then use the Selection tool to click on the fill and move it -
Flash treats the stroke and fill as separate objects.
- Move the cursor over the stroke -- a small curved line appears at the
end of the cursor - this means that you will select the line, rather than
the fill, if you click. Again select and move the line (the fill stays
in the same place)
- To select both, double click
- Exercise 7 - Interaction among Objects(Merge Drawing Model)
- Fills intersecting - if same color, joined; if different color, leaves
hole when one is moved
- Intersecting lines - split into segments, regardless of color
- Line intersecting a fill -- the line splits the fill, regardless of the color
Three ways to prevent this interaction:
- Object Drawing Model - click the icon at the bottom of the toolbar
- Grouping Objects (Modify>Group) - If you create group object, they will interact with each other as specified in the Merge Drawing Model, but other objects on the stage won't interact with them.
- Layers - Objects in different layers won't interact with each other as in the Merge Drawing Model
- Exercise 8 - Creating Gradients - Flash lets you create two types of gradient
fills: linear and radial.
- Using the Selection tool, click on a fill.
- Make sure the Color Panel is open; if not, choose Window>Color to open it. Click the down arrow to choose Linear gradient in the Fill Style
drop down menu.
- Double click on the black pointer in the Color Mixer panel - this opens a dialog box and by selecting a color, this color
will be used as an endpoint for the gradient.
By double clicking the pointer at the other end, you can select a color as the other endpoint for the gradient.
You can click in between to add additional colors to the gradient.
- Select the Gradient Transform Tool (underneath the Free Transform Tool) from the toolbar - see how the various edit handles (center point, width handle, and rotation handle) affect the gradient.
- Using the Selection tool, click on another fill. Now select Radial graident in the
Fill Style drop down menu and then the Gradient Transform Tool from the toolbar - see how the various edit handles (center point, focus point,width handle, radius handle, and rotation handle) affect the gradient.
- Click on the just below the top right corner of the Color Panel and select Add Swatch.
This adds this gradient to the Swatches panel. If it isn't open,
choose Window>Swatches to open the panel and the new gradient
should be at the bottom on the right.
It will also be at the bottom of the color palette that opens when one clicks the fill color in the toolbar or in the Property Inspector and can be selected just like any color in the palette.
Revised: November 7, 2011, Comments to William Pegram, bill@billpegram.com