In this tutorial you will learn about
:
1.Motion Tweens
2.Shape Tweens
3.Easing
4.Movieclips
5.Buttons
Section One: Motion Tweens
In this section I will teach you how to create a motion tween.
Lets Begin.
Open a new flash document, leaving the default page settings.
12 Frames per second, 550px X 400px canvas.
Now, using the elipse tool, draw yourself a circle. (Top Tip: Hold tab and crag to create perfect circles.)
Next click on the 30th frame on your timeline, and press F6.
Next highlight frames 1-30, Right click, and click "Create Motion Tween"
Your 30 frames should now turn a shade of purple, with an arrow from the first to last. This shows that a motion tween is occoring over these frames.
(Top Tip: If you recive purple frames and a dotted line, this means that you're motion tween is broken. The most likly cause of this is that there is diffrent drawings on one of frames to the other. Check they are the same, if they are not delete the diffrent part, and the tween should update, fixed.)
Now, Go to your 30th fram again. In this frame you move your cicle to where you want it to be at the end of the tween.
>
You can now test your tween by pressing the enter key.
It is an idea to save your file at this point. Call it somthing you can remember like Tween1.
Now push Ctrl+Enter together. this will publish your move and allow you to view it as other people will see it.
Close that preview, and return to your main movie.
We will now add another 30 frames, to make the circle move seemlessly.
Click on your 60th frame, and push F6. This time your tween will be made automaticly for you, but you will need to move your circle back to the origonal starting point.
(Top Tip: A easy was of doing this is copying the cicle from the first frame, using Ctrl+C, and pasting it into the 60th frame using Ctrl+Shift+V. Make sure you delete the circle currently in frame 60 though
)
Now try testing your tween using Ctrl+Enter, it will repeat its movements without a jump after the 30th frame.
At this point you may notice that the animation you have created is very "Choppy". To make the movement of your circle smoother, you can increase the frame rate.
Do this by Right clicking on the stage, and changing the Fames per second to 30. It will increase the speed of the animation as well as making it smoother.
Now try testing your tween again using Ctrl+Enter, It'll be much nicer to look at.
You've completed section one of the tutorial! Well done.
This is my final animation
http://i82.photobucket.com/albums/j2...ore/tween1.swf Section 2: Shape Tweens
In this section I will teach you how to create a shape tween.
Open a new flash document, using the settings below.
30 Frames per second (You should know how to do this if you have read my motion tween tutorial), 550px X 400px canvas.
Now, using the elipse tool, draw yourself a circle. (Top Tip: Hold tab and crag to create perfect circles.)
Now, as before click on your 30th frame and pussh F6. Now move to your 60th frame and push F6
Next, highlight your 60 frames and open the properties tab.
Use the menu highlighted in red to select the type of tween, "Shape"
Your 60 frames should now turn green, with an arrow, much like when creating a motion tween.
Now, Move to the 30th frame, and delete the circle. This will break the tween, but do not worry, this is the intersting part of the shape tween.
In your 30th frame draw a diffrent shape. it can be totally obscure. For this tutorial I have used a 12 sided star.
You can also change the color, and position of the shape, as it will not matter.
It's now time to test your shape tween. Push enter, and watch the awesomeness.
If you are happy with your tween, save it as "Tween2" and push Ctrl+Enter to publish it.
Here is mine
http://i82.photobucket.com/albums/j2...on2/tween2.swf Section Three: Easing
In this section you will learn about easing. Easing can be used to control the way the shape moves in a tween.
Lets get started.
Open the file you saved as "Tween1" this should contain your 60 frame motion tweened circle. We will be adding easing to this circle so you will understand how easing works.
First of all, go to the 90th frame of this movie and push F6, do this also at the 120th frame.
Now, copy using Ctrl+C the circle from your 30th frame, to the 90th (Paste using Ctrl+Shift+V) . This will make sure the circle moves a contant distance and speed.
Now click back on the first frame. On your properties panel you should see an option for "Ease"
Set this to 100 outwards easing. This means it will start fast and slow down. (see picture)
Do this for the 30th frame too.
On the 60th and 90th frames we will use Inward easing. This means the object will start slow, and speed up.
You have now set easing on your tweens. Before you test this movie, use the "save as" function to save it without overwriting the current file. Save it as "Tween3"
Now publish using Ctrl+Enter
Here is mine:
http://i82.photobucket.com/albums/j2...on3/tween3.swf
Flash Basics 101 
Flash 8 - Navigation 
Linear Mode
