cm tutorials - learning flash basics - sort of - march 02

Macromedia Flash5


Introduction

The Interface

Flash Exercises:
   Layers
   Color
   Drawing
   Buttons
   Symbols
   Animating
   Sound

Saving and Publishing

Flash Examples


 

Drawing in Flash

If you're familiar with Photoshop or other drawing, image manipulation and paint programs, then Flash tools will look familiar. Let's go over some of the drawing methods unique to Flash.

Overlapping Shapes

When one shape overlaps another and the two shapes are on the same layer and and are not selected, these objects merge into one object. You can still select one section of the object, but when you move it, the part of the other object that was overlapped will be erased.

Exercise:

Draw a shape on the stage in one color. Draw an overlapping shape in another color. Select one of the color areas and drag the shape. You see that the part of the shape that was covered by the overlapping shape is gone. Keep this in mind when you're creating graphics. If you don't want this to happen, put the shapes on different layers, group them or make them symbols.

Pencil Tool

The Pencil tool works like a regular pencil tool with some cool options. The Pencil tool draws in three modes: Straighten, Smooth and Ink. These modes appear in the Options section of the Toolbox.

Choose Straighten and draw a box. The lines you draw have been straightened. Try this with the other two modes. Smooth makes nice curves averaged from the curve you drew. Ink leaves the line as you've drawn it.

Selecting edges and lines in Flash

  • To select a line segment or the fill of an object, use the Arrow tool and click once over the line or fill.
  • Double clicking on a line will select all the curves in that line.
  • Choose the selection (Arrow) tool and deselect any shapes or lines that are on the stage. With the selection arrow, move it over one of the shape edges. The pointer arrow changes when you're over the edge of a shape that hasn't been grouped or made into a symbol. If it's over a curved line or curved edge of a fill, it is a pointer with a curve next to it and will move the curve if you press and drag. Over a corner or endpoint, it is a pointer with a corner, and will move the point or corner maintaining the straight lines. This will pull both stroke and fill alike.
  • To reshape lines and fills, select them. Use the Smooth or Straighten mode from the Modify Menu or from the Options section of the Toolbox. (You can adjust the amount of smoothing or straightening by choosing Preferences from the Edit menu.)
  • Control-drag (Windows) or option-drag (Macintosh) a line to create a new corner point.

Optimizing Shapes

The fewer curved sections in a shape, the lower the amount of data Flash has to maintain on that shape. Optimizing shapes is highly recommended to reduce file size and increase playback speed of the Flash movie. To reduce the amount of curves in an object, choose Optimize from the Modify menu. The Optimize Curves dialog box allows you to reduce the number of curves contained in a shape. Observe the shape as you smooth it and stop before it changes the shape unacceptably. If it's a simple shape, the number of curves may not change at all. Optimizing all objects in a movie, can significantly reduce the movie file size and increase the playback speed.

Exercise:

Draw a shape. Select it and choose Optimize from the Modify menu. Use the slider to adjust the amount of smoothing to apply to the curve. (You can always choose Undo from the Edit menu.) The option 'Use multiple passes' will repeat the smoothing process until no more optimizing is possible. This is the same thing as choosing Optimize from the Modify menu over and over again.

Pen Tool

If you are familiar with Adobe Illustrator or Photoshop, Macromedia Freehand or Fireworks, you've seen this tool before. The Pen tool allows you to place points and create curves and lines that are repositionable.

Exercise to create a straight line:

  • Select the Pen tool.
  • Click once anywhere in the stage window.
  • Click again, and a straight line is created between the two points.
Exercise to create a curved line:
Position the Pen icon where you want it to begin on the stage. Press and hold the mouse and slide in the direction you want the curve to go. You'll see tangent handles that appear that you can also select and reposition. Release, and either repeat or just click where you want the curve to end.

Exercise to modify a curve:

Use the sub-selection tool to select a point or its selection handles and drag them to a new position.

Important points about curves:

  • To change a curve point to a corner point (or anchor point), use the Pen tool and just click on the point.
  • To change a corner or anchor point into a curve point, use the sub-selection tool, the option key and drag.
  • To delete a corner point, click on the point with the Pen tool.
  • To delete a curve point, double click on the point.
  • Fewer points means smaller file size.
  • A curve point is a hollow circle.
  • A corner point is hollow square.

Brush Tool
The Brush tool is used to add color to your movie. The Brush tool has modifiers for Brush Size, Brush Shape and Modes. These modifiers are located in the Options section of the Toolbox. The Modes for the Brush tool provide different ways of painting. The Modes are:

Paint Normal - is just like you expect
Paint Fills - leaves strokes untouched
Paint Behind - paints in back of
Paint Selection - only paints selected item
Paint Inside - paints only the fill you start in

If you're lucky enough to have a tablet and pressure-sensitive pen, then another option is available: the Pressure modifier. The Pressure modifier allows you to vary the thickness of the line you draw.

Exercise:

Create an object that has a fill and stroke. Select the Brush tool and try the different painting options.

TOP