MULT 110 Basic Game Programming I

1
MULT 110 Basic Game Programming I

• Motion and Shape Tweening

2
Frame Animation

• Animate give life to

3
Frame Animation

• Animate give life to

4
Frame Animation

• Animate give life to

5
Frame Animation

• Animate give life to

6
Frame Animation

• Animate give life to

7
Frame Animation

• Animate give life to

8
Frame Animation

• Animate give life to

9
Frame Animation

• Animate give life to

10
Frame Animation

• Animate give life to

11
Disney Type Animation

• Individual cells were all drawn on acetate.
• Key Animators drew pivotal cells.
• Apprentices or Tweeners drew cells in between.
• Frame animator organized all the cells and
  prepared them for filming.
• Now all work is done with animation programs,
  say, Flash or 3D Studio.

12
Motion Tweeningwith Keyframes

• Steps
• Create a series of identical frames.
• Insert a keyframe at the end of the series.
• Move object in last or first frame.
• Select frames.
• Insert gt Timeline gt Create Motion Tween

13
Motion Tweeningwith Keyframes

• Insert multiple keyframes for complex paths.
• May be done before or after motion tween is
  created.

14
Motion Tweeningwith Guide Layers

• Steps
• Create a Motion Tween.
• Mark registration points of objects in the
  keyframes.
• Add Guide Layer.
• With Guide Layer selected, draw path with pencil
  tool.
• Adjust endpoints of guide to snap to registration
  points of object, if necessary.

15
Shape Tweening

• A major advantage of Flash is its vector
  graphics.
• By adjusting the stroke of a graphics object, you
  may change the shape of the object itself.
• You may make changes in a keyframe and have Flash
  tween the two objects smoothly.

16
Shape Tweening

• Morph - dynamically change the shape of an object
• Create an object.
• Name the layer.
• Insert frames.
• Insert a keyframe in last frame.
• Deselect object in last frame.
• Use Arrow tool to stretch stroke to new shape.
• Select the Layer.
• In the Properties Panel, select Shape from the
  Tween drop down list.

17
Shape Hints

• Shape hints identify points in first and last
  frames of animation.
• Flash will try to move
• the point in the starting shape to
• the corresponding point in the end shape.
• Insert a Shape Hint Modify lt Shape lt Add Shape
  Hint ( Shift-Ctrl-H )
• Hints are labeled a to z.
• Set location in start frame.
• Set to corresponding location in end frame.
• Insert up to 26 in a given animation.

18
Shape Hints Help

• Locate the article about shape hints in the Flash
  online help.
• Follow those instructions to improve the tweening
  of your shapes.

19
Motion Tween / Shape Tween Exercise

• Motion Tween with Guide Layer Create an anagram
  that moves letters in one word into another word
  using a motion guide layer.
• Shape Tween
• Create a shape and tween it in scene 1
• Copy the new shape to frame 1 of scene 2
• Create a new tween in scene 2.
• Copy the new shape in scene 2 to frame 1 of scene
  3.
• Morph back to the original shape in scene 3.

20
Assignment

• UNIX Account
• Account name on index card
• Create mult110 folder
• Create a Flash movie that demonstrates your
  ability to do a
• Motion tween with complex path
• Guide layer with orientation to path
• Shape tween with shape hint