Animation
There are four ways to make something move. They are genuinely different tools, not layers of one thing, so the first job is picking the right one.
| Way | Best for | You set it up in |
|---|---|---|
| Transition | one smooth change from here to there | a duration on a step or a state |
| Animation step | a reusable move attached to an event | a step inside an event |
| Timeline | choreography — several objects, several tracks, one clock | the Animation Controller |
| Model clip | animation that came with an imported model | the model's own settings |
A rough rule: fading a button is a transition, a door opening when tapped is an animation step, a cutscene is the timeline, and a character walking is a model clip.
Never animate the same object two ways at once. The timeline writes to its objects every frame and will quietly overwrite a transition. If an animation seems to fight itself, this is why.
Transitions
Give a change a duration and it eases instead of jumping. That applies to a state switch with a duration and to an event step with one.
A transition has a duration, an easing, and optionally a repeat count and ping-pong. What can ease is listed under what animates smoothly; anything else changes at the end.
Ping-pong starts at 2. This keeps older projects from suddenly pulsing.
Animation steps
An animation step moves, rotates, scales or fades whatever you target.
Give it a single destination and it eases there. Give it two or more keyframes and it plays the whole curve.
| Step | Animates |
|---|---|
| Transformation | position, rotation, scale |
| Opacity | fading in and out |
| Skeletal transform | a single bone |
| Material | copies a saved material's look onto your targets |
| Play / stop animation | starts or stops a timeline preset |
Keyframes and easing
A keyframe is a time and a value.
Not the one you are leaving. Set the easing on the destination keyframe. No easing means a straight line.
Easing is a curve with two handles, exactly like CSS cubic-bezier. The named presets — quad,
quart, circular, expo, back, each as In, Out or InOut — are just useful handle positions.
| Easing | Feels like |
|---|---|
| In | starts slowly, builds speed — something setting off |
| Out | arrives and settles — the most natural for UI |
| InOut | eases at both ends — good for long moves |
| Back | overshoots slightly and comes back — playful |
| Elastic | overshoots and wobbles, with its own amount and period |
| Step | holds, then snaps at the end — for switching, not sliding |
If you are unsure, Out is almost always the right first guess.
The timeline
The Animation Controller is for choreography — several things moving together on one clock.
Its structure is three levels:
- a preset is one animation you can play by name;
- a bar is one object's part in it, sitting on a track;
- inside a bar, each property has its own keyframes.
A bar can also be a playback bar: instead of animating anything itself, it starts another object's preset when the playhead reaches it. That is how a character whose limbs are separate presets stays in sync. Looping and speed pass down to everything it starts, and stopping a preset stops everything it started.
Individual properties inside a bar can be muted, so a bar that animates position and rotation can have its rotation switched off without losing the keyframes.
Animation that arrives with a model is not re-approximated, so an imported walk cycle plays exactly as the artist authored it.
Model clips
A model brings its own named clips. Pick one, then set speed, looping (once, a count, or forever) and a starting frame — counted at 30 frames per second whatever the source used.
Changing the clip or the start frame rewinds. Pausing holds the current time instead of resetting it.
Units, and one thing that is missing
- time in seconds (durations on state switches are in milliseconds);
- rotation in degrees everywhere you can see it;
- start frames counted at 30 fps.
None of the four mechanisms provides one. To follow an animation with something else, use a wait step of the same length, or track elapsed time in a script.
Next: States — named snapshots of an object.