Creating Your First Cartoon

Creating your First Cartoon

The Basics in Flash:

I’m writing this tutorial to teach you the basic skills you need to animate in flash. I’m assuming you know how to open a program so lets move on from there and get started with the good stuff of animation.

Things may be different if you have chosen Flash 8 Professional or Basic but its all pretty much the same. So keep that in mind if you can’t find a button that I’m referring too. I’m using Flash 8 Pro because it Owns. Lets get started:

First up we are going to create a scene then put a stickman in it and have an anvil squash him to a gory death. I’m going teach you keyframe animation and about how to use layers.

1> Open Flash and hit Create New Flash Document.

2> When you first install flash you get a screen full of windows and clutter. Close down all the windows you don’t need until you have a screen like mine:

3> Rename Layer 1 to “Background.” Right Click “Layer 1” --> Properties --> Name.

4> Now on the screen start drawing your background. I’m going to start by drawing a tree and showing you how to use some of the tools.

5> Click the Pencil tool and then select smooth from the tools options. Like this:

6> Now draw a tree in your document and some hills. (Doesn’t matter if you draw outside the box. This can be fixed with masks that you will learn about later on).

Note: It is easier to set the view to fit in window mode and not have your layers window up the top too long or else drawing becomes hard.

7> Now when you go to fill your scene it won’t work because the borders aren’t closed off. To do this Select the square box and choose no fill like so:

8> Now draw the square perfectly around the documents borders. If its out of place by a pixel then you will notice when you go to play it.

9> Now its time to fill the scene with colour. (We won’t get into shading and gradients yet just choose plain colours from the fill swatch and use paint bucket to fill. You may need to adjust the fill bucket in options from “Close Small Gaps to Close Large Gaps” If it still won’t fill try zooming out and muck around with the Close Gaps option until it does. Another trick is to break up huge filling areas with the pencil tool set to the colour you want to fill. Like for instance drawing lines from the top of the border in your sky to the mountain tops to break up the filling area for the blue etc.)

10> Now we will lock this layer so we don’t accidentally draw in it while we animate. We will also give it a set amount of frames to show in and create a new layer for the stickman.

11> On the layers window move down to about 100 frames and right click on the 100^th frame and hit insert frame.

12> Now click on the dot underneath the lock symbol to lock this frame.

13> Create a new layer by clicking on the Insert Layer Icon and rename it Stickman.

14> Starting with the head using the circle tool. Draw a circle and fill it with whatever colour you want to the left of your document. (Note: If Snapping is annoying you go to View --> Snapping Then untick all the ticks.)

15> Now we are going to convert it to a symbol so we don’t have to keep redrawing it every frame. Using the Black Mouse Pointer in the tool set pull out a selection box around the head. Now right click the head and click on Convert To Symbol.

16> Name it Head and check the Graphic option. Like This:

17> Click ok. Select the Pencil Tool and open up the properties for it on the bottom of your screen and set the size and smoothing to what I’ve got in the picture:

18> Now minimize the properties tool bar and draw the body of your character. Remember use CTRL Z a lot to undo work that doesn’t look good. I sometimes end up drawing a body 4 times until I like it.

19> Now its time to start the tedious work of keyframe animation. Create a new keyframe in frame 2 by right clicking and hitting Insert Keyframe.

20> Now turn on Onion Skin so we can see what was drawn on the last frame. You will have to adjust the sliders so it only spans out one frame behind of the one your working on. Like this: