Printed from "Life in the Tech Lab" site

Lesson 5: Motion Tweening Basics

Up to this point you have been working with frame by frame animation.  The real power of flash is tweening where Flash can make an animation by itself over a series of screens.  The are two types of tweens: shape tween and motion tween.  You will start by learning how to make a motion tween.

First you will be introduced to the steps in making a motion tween. Do not miss a single step.  If it didn’t work it is easier to start all over.

Steps for Motion Tween Animation in Flash

  1. Create a new Flash document
  2. In the timeline, select Frame 1 (it is probably already there)
  3. Create a shape (start with the Square tool)
  4. Select all of the shape with the Arrow tool
  5. Go to the INSERT/TIMELINE menu and choose “Create Motion Tween”
  6. Click in another FRAME (like #15) in the TIMELINE then go to INSERT/TIMELINE/FRAME(click below the dark timeline in the gray area – You will see a dotted line connecting the frames.  This Indicates that that these frames are set to contain a motion tween.)
  7. Move the object to another position. It will be a shadow of your original shape. Whe you let go,you will see the dotted line change to an arrow.  You can rotate the object and/or resize the object and/or fade the object and/or spin the object – in some way change it so you can really have a change.  See below for ideas.
  8. Press the ENTER key to play the animation

Once you have figured it out practice with different shapes until you are certain you have the steps down.

You are ready for some activities.  There are different things that can be done to make changes in your animation.  Make one simple animation for each of the following and save it in your Flash folder.

  1. Rotating less than 360 degrees: use the rotate tool at the bottom of the tools window
  2. Scaling:  use the resize tool at the bottom of the tools window
  3. Flipping: go to MODIFY/TRANSFORM/Flip Horizontal or Vertical

Save an example for each of these exercises. Call them shape 1, 2  and 3.

MOTION TWEEN PRACTICE PROJECTS

Project 1:

Call the saved file “motweening”

To do the following activities you will need to click on the object in the last frame and do your changes with the Tools or in the Properties window.  Also change the stroke of the shape so that it is fat (hint: properties inspector)

Layer 1:  make a square rotate across the screen and change color at the same time.

Layer 2:  make a circle with a small square in it go across the screen and becoming smaller – almost fading away.

Layer 3 and 4:  Make a green circle with a square in it (each on a separate layer).  Make them both move across of the screen.  While doing this the circle becomes an oval and the square becomes a rectangle.

Project 2

Name 1

Call the file “Name Tween”

Type in your name.  It will be one shape.  You need to make a shape for each letter.  To do this go to MODIFY/BREAK APART.  Click on this.  The letters of the name will have boxes around the letters.

 Go to MODIFY/BREAK APART again. Now all the letters will have the little selection dots. 

Instructions

Name 2:

In this project you will distort all the letters individually.  Save the project as Name Tween 2.

Type in your name and go to MODIFY/BREAK APART as you did in the first name project.  After the second MODIFY/BREAK APART and the letters are all dots, go to MODIFY/TIMELINE/DDISTRIBUTE TO LAYERS. Click and you will see in the timeline that each letter is in a different layer.  Now you can tween and distort or change each letter.


Back to the Introduction to Flash Contents

 

Site Upgrade Underway

So you like this new look? I have begun the work of updating this site to look cleaner, make it easier to read, and work much better on mobile devices. Do you like what you see? I'm open to suggestions; email me with ideas!

As I work on the site, you'll go back to the old style pages. Don't worry, all the links will continue to work just fine! You'll be able to follow my progress! Look for an updated Intro to Spreadsheets site soon!