Lesson Notes
Lesson 1
  1. Introduction
  2. Access the Server
  3. Drawing & Painting
Lesson 2
  1. Basic Animation
  2. The Timeline
Timeline Review
  1. Timeline Review
Lesson 3
  1. Symbols & Library
  2. Shape Tweening
Lesson 4
  1. Animation Review
  2. Break Apart
  3. Distribute to Layers
Lesson 5
  1. Motion Path
  2. Buttons
  3. Intro to Actions
Lesson 6
  1. Setting Up Projects
  2. Project Checklist
  3. Action Scripting Buttons
Lesson 7
Lesson 8
Lesson 9
  1. Animated Buttons
Lesson 10: Walk Cycle
  1. Character Design
  2. Terms Explained
  3. Project Overview
  4. Setting Up
  5. Frame 9 & Animated Guides
  6. Animating The "Bounce"
  7. Legs & Feet
  8. Arms & Finalizing
Lesson 11: Preloader
  1. Simple Preloader
  2. Advanced Preloader
Lesson 12
Lesson 13
Lesson 14
Lesson 15
Lesson 16
Lesson 17
Lesson 18
Lesson 10: Part 7
| Pt. 1 | Pt. 2 | Pt.3 | Pt. 4 | Pt. 5 | Pt. 6 | Pt. 7 | Pt. 8 |

Animating the Legs & Feet
Flash: Interactive Web Animation
by Ken Kimura


Now that you have the animated guides it’s time to animate the legs and feet.

Before you ask... THERE IS NO EASY WAY TO DO THIS WELL. It’s tedious.

Here’s the strategy:
  • Work on one leg at a time
  • Hide the layers and guides of the leg that you are NOT working on
  • Look for segments of your timeline where you use the same symbol over a number of frames. First try to see if you can get away with a motion tween. If not, tweak and adjust by adding keyframes.

    [IMPORTANT NOTE: Motion tweening only works when the symbols on each end of the tween are the same symbol. This means that you cannot motion tween between a "straight leg" symbol and a "bent leg" symbol. If the symbols are the same on both ends, you can try to motion tween the movements. It is unlikely that you will be able to motion tween for more than 3 frames.]

    [IMPORTANT NOTE 2: Before you make any changes, make sure you've created a keyframe or you are on a frame that has a keyframe.]
  • Use the transform tool to rotate, stretch and squash the legs and feet as necessary.
  • Only animate frames 1 through 9 - DO NOT alter frames 1 or 9
  • Frames 10-17 are made by strategic copy-pasting.
  • Swap symbols where necessary - see chart below.

Swapping symbols

The pushing leg in frame 1 is a straight leg. On the 2nd frame we're going to swap the straight leg symbol with the bent leg symbol.
  1. Add a keyframe in frame 2.
  2. Select the leg symbol on the stage (as opposed to selecting it on the timeline)
  3. Look at your properties panel and look for the “Swap” button. click this button and select your bent leg symbol from the list that appears. It will replace your straight leg symbol. If necessary, adjusts it's position and size. The leg symbol remains a bent leg symbol until frame 5. This means that you can try to motion tween between frames 2-5. Then add adjustment keyframes as necessary.
  4. At frame six the leg symbol should be a straight leg symbol and continues to be a straight leg symbol through frame 8. Use the leg position guide and the chart below for reference.

The Pushing Leg:
frame foot symbol leg symbol
1 straight straight
2 straight bent
3 straight bent
4 straight bent
5 straight bent
6 toes bent up straight
7 toes bent up straight
8 toes bent up straight
9 toes bent up bent
  REMEMBER Frames 1 and 9 should not be altered.

The Swinging Leg:
frame foot symbol leg symbol
1 toes bent up bent
2 straight bent
3 (optional - toes bent down) bent
4 (optional - toes bent down) bent
5 (optional - toes bent down) bent
6 (optional - toes bent down) bent
7 (optional - toes bent down) bent
8 straight bent
9 straight straight
  REMEMBER Frames 1 and 9 should not be altered.


GOOD LUCK and work hard. It'll be worth the effort.

Also see diagram: Position Guide for Legs
Also see: project example: walk cycles

Continue To Part 8