Adobe Flash - Frame by Frame Animation

Adobe Flash – How to make a simple animation

Open your Adobe Flash and select Action Script 2.0

Before we start, please familiarize with this workspace.

Activate your onion skin to guide in our frame by frame.

• When you complete this lesson, you will be able to:

Learn how to animate frame by frame.

Learn how to manipulate playhead.

Learn basic explosion effect.

Learn how to use onion skin.

Learn how to animate using different layers.

In your timeline we have our layer 1.

Double click your layer 1 and change the name to Rocket.

Draw a rocket in our stage.

Example:

Now, we need to place our rocket below our stage.

Example:

• ·         In your 2^nd playhead, insert a keyframe hit F6 for shortcut.

Now, that we have our 2^nd keyframe

• ·         Select your rocket and adjust it by dragging it above by little.

Example:

Our goal is to create 10 keyframes from our 1^st playhead to the 10^th playhead.

We need to move our rocket little by little or on each keyframe that we created.

Remember, that our onion skin will determine the previous location of your rocket so use it as an advantage to adjust from getting above our goal.

In the 10^th playhead your rocket should be in the middle

Example:

Next step, we need to insert blank keyframe in our 11^th playhead.

Simply press right click and select insert blank keyframe in our 11^th playhead or just hit F7 to insert blank keyframe for shortcut.

Now, in our 11^th playhead, I want you to draw a small red circle at the tip of our previous rocket.

Use oval tool to create a circle and change stroke and fill color to red.

Example:

For the 12^th playhead, we need to insert another blank keyframe and draw another circle.

This time it should be alittle bit bigger than the previous one and you must put it in the same location of the previous circle.

Add some lines in our circle just like this.

Example:

Now for the 13^th playhead, I want you to draw a heart.

You can use Brush tool as long as you fill and stroke color is red.

Don’t forget to put your heart in the same position as the previous one.

 Example:

Now, we need to insert a keyframe in our 20^th playhead.

In your timeline you should be able to a similar view as this:

(Hit Ctrl+Enter to see your progress)

This is simply a head start basic animation.

Now, let’s try to have another layer.

Right click on your Rocket layer select insert layer.

There you can see in your new layer that it has been inserted with blank keyframe from 1^st playhead to the 20^th playhead.

Example:

In our Rocker layer or main layer I want you to copy all the keyframes that we have inserted from the 1^st playhead to the 20^th playhead.

Hold shift then select the 1^st playhead to the 20^th playhead and press right click and select copy frames.

Go back to your New layer that we have inserted then press right click on our 21th playhead and select paste frames.

After that you should be able to have two rocket animations and that’s how you manipulate frames.

Example:

(HIT ENTER TO TEST)