Vector Drawing Basics

If you want to create graphics like the ones below, the Pencil or Brush tool won't be too much use to you. Rather, you'll need to learn vector drawing in Flash!

[click for the swf version]

 

[Visit this page for a video tutorial on the subject of drawing in Flash! ]

 

Before we begin

Alright, let's get down to theory, but before we do that hit play to watch the recording below.

Any shape in the world, and especially in Flash, has its points and curves. Just look around your room, office or whatever your surrounding is - every object will follow this rule.

In the short video above you can see an example of what I am talking about. If you watched it carefully, you'll notice that I first added four new vector points to my original shape, in this way making it an octagonal. Then I curved 2 lines and finally shifted a vector point.

In fact, these three actions are the key for creating all kinds of characters, backgrounds or anything else you want in Flash!

Practice

OK, let's first have a closer look at how to add new vector points to shapes. I'm sure you will grasp the idea very quickly as it's rather simple.

Adding new vector points

1. Take the Rectangle Tool (R) and draw a rectangle.

 

2. Move your mouse over the spot where you'd like the new vector point to be. It ought to be over one side of the rectangle.

3. Now is the most important bit: with your Alt key hold, press the upper side of our rectangle, but don't release it just for now. If a small icon of two lines forming a right angle appear there, you did it properly. You should now drag the vector point point upward, creating the below figure (or something similar to it).

[ your new shape might resemble this one ]

Curving

The second technique is about curving sides of shapes.

1. Draw another rectangle with your Rectangle Tool.

2. To curve a side, just place your curser over the side of our rectangle you want to curve, left-click (and hold) it and drag it up a little bit- so that it forms this nice little arc you can see in the below picture.


[ the upper side of the rectangle is slightly curved ]

 

Shifting vector points

Finally, there's the third technique - shifting vector points. This technique is used to shift the already existing points. Let's try it out:

1. Grab your Rectangle Tool and draw a rectangle like the one shown in the image below.



2. Now, click (and hold) the upper-left corner of the rectangle with your mouse's left button and drag it upward like you can see below.


[ I shifted the upper left corner of this rectangle ]



We're done with the third and last technique. Now only practice is left before you become a Flash master!

I think it a good idea to test your newly acquired abilities and draw something, let's say a head. You should now be able to do it!

TIP It may sometimes be hard for beginners, and not only, to see the vector points of a shape, hence I strongly advise that you use the Subselection Tool, which is the icon of a white cursor right next to the Selection Tool you have in your Tool panel. However, after a time, finding vector points will become your second nature.


Also, visit this page for a video tutorial on the subject of drawing in Flash!

Other methods of creating shapes

The method I described above is considered by me and many people I worked with as the best one, yet it is not the one there is. Sometimes a tablet might come in handy, other times using Pencil tool with your mouse might suffice; it depends on many factors.

—>

I hope you enjoyed this tutorial. If you still feel Flash-starved, you can find more interesting tutorial here.

Cheers!

Average: 3.8 (29 votes)