Flash Tool Bar Lesson 1

So you want to learn how to draw and animate in Flash? Adobe Flash is a fun and easy program to learn, though it does have its quirks at times. The first thing you must do is obviously download a version of flash. You can use Flash CS3 or Flash CS4 since the main topics we will talk about are the same in both programs. I prefer CS3 since it crashes less.

Let’s begin

Start by running Flash. Create a new file. Choose ActionScript 3, we will discuss at a later time what ActionScript is.

Image

 

Now that you have created a new document, let’s take a look around and explore what we have. Let’s begin with the Stage. The Stage is your drawing area, it is the white square located dead center of your screen. You can edit your stage size by clicking the Properties Tab and the bottom of the screen. By clicking the Size button you can specify your dimensions of you Stage.

Image

 

Think of Stage as your canvas. Whatever you draw on your canvas is what will be seen when you publish your flash file. Anything outside of your Stage will not be seen. This gray area is called your Work Area. Let’s see this in action. To the left of the screen are your tools for drawing and editing your artwork. There are quite a few tools, but lets just start with basic drawing tools.

Image

 

Brush Tool

Image

Click the Brush Icon or use the shortcut key (B). Next we will pick the brush size and color we want to use. Click the Fill Color icon and chose a color of your choice. Next Click the Brush Size icon, and click the size you desire. Now start doodling on the Stage. Click and hold the left mouse button and draw lines, circles, and scribbles. Draw on the Stage and in the Work Area. Once you have filled your Stage with as many doodles as you want.

Image

 

These options appear on the toolbar when you chose the Brush Tool.

Image

 

Eraser Tool

Image

Now that we have drawn all over the Stage we are out of room and need to erase to draw more. So let’s click on the Eraser Tool or keyboard shortcut (E). Now with your Eraser selected, just like with the brush, you have options of the size of the eraser you want. Click the size you desire and start erasing your artwork. Same as before click and hold the left mouse button and erase your artwork. There are other ways of erasing the entire Stage. Either Double clicking the Eraser Icon or Ctrl+A and the Delete key.

These options appear on the Toolbar when you chose the Eraser Tool.

Image

 

Pencil Tool

Image

Let’s now draw with the Pencil Tool. The Pencil Tool is a fun little tool. Just like the brush, it allows you to draw, but you have a bit more flexibility then the Brush. The Pen Tool has 3 properties. Stroke Color, Line Weight, and Style. Stroke Color is the color of your line. Line Weight is the width of your line. Style is the style of your line, either a solid line, dashed line, dotted line. If you select the Properties Tab at the bottom of the screen you will find the area for Stroke Color, Line Weight, and Style.

These options appear on the Property Tab when you chose the Pencil Tool.

Image

 

If you notice in the toolbar area there is an icon called Pencil Mode. There are 3 modes for the pencil. Straight, Smooth, and Ink. To draw straight lines, select Straight. To draw smooth curved lines, select Smooth. To draw freehand lines with no modification applied, select Ink. That all may have seemed confusing, but the pen tool just has a few options. Select a line color, select a line width, select a line style, and the mode you want.

These options appear on the Toolbar when you chose the Pencil Tool.

Image

 

Image

 

Now what is also neat about the Pencil Tool is that you can edit your drawing at anytime. Draw a red line on Stage with a width of 1. Now select your line using the Selection Tool in the tool bar or shortcut key (V). Draw a selection around the line you created by holding down the left mouse button and dragging over your selected area. Now go back to the Properties Tab at the bottom and change the color and width. As you see you have total control over it at any time. Select the Eraser tool and erase your drawing.

Now let’s manipulate your drawings even more. Select the Pencil Tool and draw a big X on the Stage. Your choice of color and width. Now switch to the Selection Tool (V) and select the one part of the X. As you see it only selects a part of the line until it intersects. While the line is selected you can do many things. You can edit the width, color, style, or you can even delete that part. Give it a try.

Image

 

Erase your X and now draw a circle, then draw a line through your circle with the Pencil Tool. Same as before use the Selection Tool and select one half of the circle and erase or edit the line values. Keep coming up with different drawings to get the hand of this technique. You can mix and match drawing shapes with the brush and the pen and see what happens. Remember the Brush tool cannot be edited the same as the Pencil Tool can. You can only change the color once the brush has been drawn.

Image

 

Fills and Strokes

Image Image

Now let’s work on Fills. There are two fills Ink Bottle and Paint Bucket. Use either the Pencil or Brush and draw a circle and fill it with the Paint Bucket on the toolbar. Select the Paint Bucket, then select your fill color. Click once inside the circle you drew. Use the Ink Bottle to change the color of the line stroke. In the toolbar select the Line Tool. The line tool draws straight lines and any angle.

Image

 

These options appear on the Toolbar when you chose the Brush Tool.

Image

 

Eyedropper Tool

Image

The eyedropper tool is ideal for quickly picking up with a color you were using earlier. No more remembering RGB values or recording palettes, just click on the color you’re looking for.

Image

 

Oval and Rectangle Tool

Image Image

Draw a square and use the Paint Bucket Tool to fill it. Just like the Pencil Tool the Line tool has the same options. Stroke Color, Line Weight, and Style. Let’s make it easier. In the Toolbars there is the Rectangle Tool. This will help you draw Rectangles and Squares in one go. If you click and drag on Stage it will create a Rectangle. Notice that the Line and Fill are the color that you have selected already. If you hold shift on the keyboard and then click and drag you will create a perfect square. Image

On the toolbar where you found the Rectangle Tool if you click and hold on the Rectangle tool you will have a drop down of other tools. Select the Oval Tool. This will help you draw Circles and Ellipses in one go. Same as the Rectangle Tool, hold down shift and it will draw a perfect circle. Play with the other tools in the drop down. Editing these objects is the same as before. You can adjust the color and width of the line, and the color of the fill. Along with editing you can have the option of drawing circles and squares with or without a Line or Fill. Select the Rectangle or Oval Tool, select either the Stroke or Fill Color, then select the No Color icon below that.

Image

 

Free Transform Tool

Image

You should be familiar with the Pencil, Brush, Oval, and Rectangle Tool. Use any of them to draw something on Stage. Now use the Selection Tool and select your object. Click anywhere on the object and hold the left mouse button down and move the object. Another way of moving objects on stage is to select the object and use the arrow keys on the keyboard to move it. You can also manipulate your drawings by using the Free Transform Tool. This tool allows you to transform and rotate your object. You can stretch and squash your object, flip your object, and rotate. You will notice handles that will appear around the object. Use these handles to specify which corner or side you wish to manipulate.

Image

 

These options appear on the Toolbar when you chose the Free Transform Tool.

Image

 

Selection Tool

Image

Next draw a straight line, then use the Selection Tool. Click on the end point of the line and click and drag the end point. You can use this method to relocate certain parts of your drawing. Also by using the Selection Tool you can modify shapes by selecting the edges of the drawing and stretching out the sides. When you move the Selection Tool over different objects the cursors appearance changes.

 

Image

 

Image

 

Image

 

Subselection Tool

Image

The next tool is the Subselection Tool. This tool helps you individually select points in your drawing or object. Draw a circle with the Pencil Tool. Use the Subselection Tool and click your circle. Now you can see the points that make up the circle, and you can relocate and adjust the points with this tool.

Image

 

Lasso Tool

Image

You can also use the Lasso Tool to do custom selections. Draw 5 circles with the Oval Tool. Select only 3 of them with the Lasso Tool. There are many ways to select and edit objects use what works for you.

 

Image

These options appear on the Toolbar when you click the Lasso Tool.

 

Image

Pen Tool

Image

The next drawing tool is the Pen Tool. To draw precise paths as straight lines or smooth, flowing curves, use the Pen tool. When you draw with the Pen tool, click to create points on straight line segments, and drag to create points on curved line segments. The Pen Tool also allows you to Add or Delete anchor points in your line segments. These tools are located by holding the mouse down on the Pen Tool. Once you have drawn your object editing it is the same as before. Use the properties to edit the line color and widths.

Image

 

Image

 

Image

 

Text Tool

Image

Flash gives you the ability to add text into your document. Use the Text Tool in the toolbar to draw an area where you want to text. In the properties you can specify font color, font size, and font style.

Image

 

These options appear in the Property Tab when you click Text Tool.

Image

 

Pan and Zoom Tool

Image

The next to items go hand in hand, the Zoom and Hand Tool. The Zoom tool allows you zoom in and out of your document. With the Zoom Tool selected the Enlarge and Reduce Tools will appear. Use the Hand Tool to pan around the screen. Click and drag across the screen to navigate.

These options appear in the Toolbar when you click the Zoom Tool.

Image

 

In Closing

This is pretty much all there is to say about the tools in flash. I hope this article has helped you understand how to draw in flash. Remember that the Flash Help is also another great way of learning what the tools are for and how to use them.

NOTE: Be sure to check out Part 2

Leave a Reply