First time here? First time here? Newsletter Signup Newsletter
Search tutorials
Author: Snoophogg | Website: http://www.xenonmovies.tk
New Page 1

Frame by Frame animation tutorial by Brendan Harris aka Snoop Hogg.

Sorry the tutorial is so long, but if you are completely clueless about flash, then I suggest you read all of this tutorial so you fully understand about animating. In this tutorial we are only going to animate stick men, most people start off by animating stickmen because their a good practice activity. OK here we go!

1) Ok open flash, I have flash mx, just double click on it obviously.

2) Draw a simple stickman using the brush tool located on the left of the stage. if you can't see the toolbox, look at the top of the screen and press window and then make sure toolbox is selected with a tick.

3) Next insert a layer, this will be for the other stickman. Reason for layer: Layers are like tissue papers, it is a way of organizing flash movies easier. If you have one object e.g. a tree and want a person to walk past it, you would draw the tree on one layer and insert another layer for the person to walk past. It makes it easier to edit things, you will understand better when you start to get more into flash. When ever you have two objects on the stage always put them on different layers, it will be far far far less work.

Picture of how to insert layer

4) Your stage and timeline should now look like this

Image of What your timeline should look like

5) OK your doing great so far, now right click the black dot which is in the timeline on layer 1 and you should have a number of options for you to do. Choose "inset frame". Next right click the same black dot again and click inset key frame.

6)Now rub out the stickman which is on layer 1 completely, Leave the stickman on layer 2 for now. Click which ever onion skin button you want, the onion skin button is for seeing where you last drew the picture. So for example, if you had a man dancing and you rubbed him out but you couldn't tell where he was before, you would use this tool to see where he was previously. click the button and you will understand what I mean..

How to do onion skin

7) Now that you can see the outline of the stickman from frame 1, draw the stickman in a different position. for example, if the stickman was standing up straight and you wanted him to kick then slightly move his leg up a bit. Just redraw the stickman except with his leg up a but

8) Now repeat this process again by inserting another frame, then a key frame. Next erase the stickman on frame two which you just drew and draw him again on frame 3 in another position. So let me explain this a bit better. If he was standing up straight on frame 1, and he moved his leg up 25 degrees on frame 2 then you would draw his leg up even more further up to his leg on frame 3 because you want him to look like he's kicking his enemy.

9) Now insert another frame and key frame for frame 4. The stickman on layer 1 should of reached near stickman 2 head by now. Click on layer 2 just by clicking where it says "layer 2" near the timeline, this will make sure it's selected. Now that the stickman on layer 2 is selected rub him out and draw him again flying backwards. So that he looks like he's been hut with a harsh Jackie Chan kick.

10) Insert another layer. To change the name of the layer right click it and go to properties (I think), I can't remember because I don't have flash at the moment, this is whole tutorial is written from memory. So change the name of layer 3 to blood so you can tell what's on what, you can also change the name of layer 1 and 2 if you want.

11) Animate the blood the same way you have animated the stickman and you should now have a stickman. You don't have to include the blood but i just like to see some blood. Hope you understood the tutorial, email me if you have any problems, good luck!

» Level Basic

Added: 2005-06-22
Rating: 6.83 Votes: 52
» Author
I like making flash movies and i'm currently learning how to make games. Oh yes and i love cheese on toast.
» Download
Download the files used in this tutorial.
» Forums
More help? Search our boards for quick answers!
Featured Flash FLA
» Author: Inocreato
» Title: RaiseTheBlocks
» Description: Raise all the blocks to win the game
Featured Sound Loops
Image for equalize

Audio Player

» Author: TomCat Carty
» Title: The Wood
» Description: Just a little game ending or it can maybe be looped. Recorders with music box and percussion to give the feel of well, I don't know, the woods? Free to use, just credit me. thank you
Latest Font
» Author: Fábio FAFERS
» Description: I created this font for free use. Everyone can apply it in personal or business texts. Its free, but I want to be communicated in case of business use. Donations are accepted to keep the project of free fonts alive! Thank you all
Featured Sound Fx
Image for equalize

Audio Player

» Author: Davisigner
» Description: Hmm... what to say about this one? It's reminiscent of the closing notes of the opening music from the Three Stooges done in a church organ style with a closing cymbal crash. I'll give this one away gratis, but feel free to check out my free loops and potential upcoming license-mandated ones over in the respective part of Flashkit.