At tonight’s meeting, Twin Cities Flash guru, Dustin Tauer, showed us all sorts of neat Flash animation tricks. Dustin has an engaging presentation style, and it
Dustin started out by sharing an update about the “iPhone OS” export in Flash. Apple recently re-authorized the use of the exporter. This is pretty cool.
TWEENING
- In the old days, we would create an object on the stage, create a keyframe, then add a tween to it.
- Now there are no keyframes. We simply add a motion tween.
- You can copy-and-paste motions.
- In the old days if you wanted to move a tweened object, you would need to move all of the keyframed objects on the stage.
- Now you can select an entire animation and move it left or right or up or down on the stage.
- Now you can also easily add guides to tweens. You can edit the tweens using the “Free Transform” tool. This is really fast.
- You can now replace objects/shapes using copy-and-paste without switching objects in keyframes.
- You can copy-and-paste to different layers easily now.
- Now you can easily add more frames to a tween by dragging the last keyframe in the timeline. FYI: Holding “Shift” and dragging the last keyframe on the timeline adds frames after the last keyframe. Otherwise, it will scale the entire tweened animation.
- If you want to move/drag a keyframe using the new tween stuff, hold “Cntrl” and select/drag the keyframe.
- Now if you want to change a property on an object during a tween, you have to change the property at the beginning and end of the tween.
- If you want to view and clear only certain keyframes (i.e. properties). Right-click on the timeline and mouseover “View Keyframes” or “Clear Keyframe”
- To clear a single keyframe on the timeline, “Cntrl”-click the keyframe, then right-click on the keyframe and select “Clear Keyframe” (or press F6)
INVERSE KINEMATICS (”The Bone Tool”)
1) Create a shape
2) Select the bone tool and create joints on the shape
3) Drag the keyframe to the right and create a keyframe in the middle of the timeline with an animation
4) SPRINGS!!! - Click on the “Armature” layer’s properties, and select the “Enable” checkbox under “Spring”
5) Click on a bone, and on that bone’s Properties, change it’s strength and dampening to a number (between 1 - 100).
6) Make sure there are a bunch of extra frames on the end of the timeline animation to accommodate spring. WOW!!!
FYI: Bones each have an instance name.
FYI2: “Spring” is a CS5-only thing.
trace (World);
trace (Joint);
var w:World = new World(null, null);
ANIMATING TEXT
- You can either use “Ease” in the Properties panel or
- FYI: By default, easing is tween-wide. To fix this, we need to use the “Motion Editor”, which is located in a panel next to the timeline by default.
- FYI: The Motion Editor only displays the frames for the current tween.
- To apply multiple tweens to an object, you need to select a single frame (using CNTRL-click), then right-click the selected keyframe and select “Split Motion”. This creates a separate tween on the timeline that you can edit.
MOTION PATH
- The only anchor points you get with a tween are the keyframes that you create. So, to create pivot/anchor points, either manually add keyframes or select in the timeline and drag the object.
- Once anchor points are created, you can use the anchor tools to edit the path (but only at keyframes/anchor points).
CHARACTER ANIMATION
- Why Graphic Symbol rather than Movie Clip? Answer: Because we can tell which frame to show within the graphic symbol (under the Properties panel so long as “Single Frame” is selected)
- A Graphic Symbol will play through its frames ONLY if the timeline that it is inside of/on is moving across the timeline. OR you can tell it to stay on a single frame in the Properties panel.
CLASS FILES
- Use external “Class” files to save time (i.e. you don’t need to rewrite code). They have the “.as” extension.
- Use Linkage to attach classes to objects
- If you need to attach the same class to two objects, add the class in the “Class” field via Linkage for the first object. For the second class, add the class name in the “Base Class” text field.
package {
import flash.display.MovieClip;
public class Test extends MoviClip {
public function Test() {
//constructor code
// This code gets called only once when it is first attached to an object.
}
}
}
-
Tags: Uncategorized by Toby
1 Comment »
