1. week 1
  2. week 2
  3. week 3
  4. week 4
  5. week 5
  6. week 6
  7. week 7
  8. week 8
  9. week 9
  10. week 10
  11. week 11
  12. week 12
  13. week 13

Aniboom: Latest hits

Create a Basic Motion Tween

    Creating a Basic Motion Tween:
  1. Draw something simple on the stage, and convert it into a graphic symbol. If you do not know how to create a graphic symbol then click here.

  2. Once you have your symbol on the stage, you should notice that it has a blue box around it. Recall that this is because it is a symbol, and for the duration of this exercise please be careful and do NOT double-click on this object. If you do, please click back where it says Scene 1 in the upper-left corner.

  3. We are going to make this object (I am going to use the oval from my previous exercise) move from the right-hand side of the stage to the left-hand side of the stage. Therefore, move your symbol instance offstage to the right side of the stage.

  4. Next, in the timeline, click in a new frame. Any frame will be okay other than frame 2. For example, you could select frame 20 or frame 40. I am going to select frame 50.

  5. Once you select a new frame, you need to extend the duration of the current keyframe from 1 to 50. To do this, you simply select F5 at the top of your keyboard.

  6. You will now see a gray area appear in the timeline and it ends at the point where you had selected, and in my case that was frame 50. Now, we need to add our motion tween. To do this, you simply right-click within that gray area and select Create Motion Tween

  7. That gray area now turns into a light-blue color. If it is dark-blue, that simply means it's still selected. To deselect, just click on the escape on the upper-lefthand corner of your keyboard. If the area where we added a motion tween is not light-blue, then you'll have to try again.

  8. Once you have added the motion tween, move the playhead to the last frame (frame 50 for me) by clicking on the number-line on the last frame. The playhead is that red box with the red line moving down underneath it.

  9. Now, on your stage where your object is located (my oval, for example), move your object to the right-hand side of the stage. You'll notice a dotted line that extends from the left side to the right side behind your object. This is the path of your object as it moves.

  10. To see your animation, simply hit enter or return on your keyboard. Or, if you want to generate the movie file (.swf), then select cmd-enter (Mac) or ctrl-enter (PC).