Craft
Anticipation and overlap: what separates pro motion from amateur
Anticipation and overlap are the animation principles that make motion look professional. How they work, how to use them, and how to spot their absence.
Ask a motion designer what separates professional work from amateur work and, after easing, two answers come up again and again: anticipation and overlap. Both come from the principles of animation that Frank Thomas and Ollie Johnston described in *The Illusion of Life*. Both are cheap to apply and obvious when missing.
Anticipation: prepare the viewer for the move
Anticipation is a small movement in the opposite direction before the main one. A character crouches before jumping. A pitcher winds back before throwing. In a graphic composition, a card that is about to slide right first drifts a few pixels left, then goes.
It works because the eye needs a moment to register that something is about to happen. Without it, the main move can feel abrupt, as if the object were placed rather than driven. With it, the move reads as a decision.
How to apply it
- Make the preparatory move small: a fraction of the main distance.
- Keep it short, a few frames, so it does not slow the film.
- Scale it to the importance of the move. A big reveal deserves a clear wind-up; a small label does not.
- Pair it with easing so the whole motion has a believable arc. See easing curves explained.
Overlap and follow-through: parts do not move as one
Overlap means different parts of an object or composition start and stop at slightly different times. Follow-through means that when a main part stops, the parts attached to it keep moving a little and then settle. Think of a flag after the pole stops, or hair after the head turns.
In motion graphics, the equivalent is staggering. A title with three lines should not enter as one block; each line can arrive a few frames after the previous one. A card and its shadow, its label and its icon can each have their own timing. The result looks like a system with weight, not like a flat image being moved.
How to apply it
- Offset elements by a few frames rather than starting them together.
- Let secondary elements settle after the primary one has stopped.
- Vary the offset slightly so the pattern does not feel mechanical.
- Keep the order logical: lead with what matters, follow with detail.
How to spot their absence
| What you see | What is missing |
|---|---|
| Objects appear to teleport into place | Anticipation |
| A whole composition slides as a single rectangle | Overlap |
| Everything stops dead on the same frame | Follow-through |
| Movement feels like a slide-show effect | Easing, anticipation and overlap together |
Why this matters for brand video
A short vertical film gives you a few seconds per idea. Viewers judge quality quickly and mostly subconsciously. Anticipation and overlap are signals of care: they tell the viewer, without a word, that a person or a well-made system decided how this should move. Without them, even a good layout feels cheap.
This is why MotionMaker builds both into its entry motions instead of leaving them to chance. If you want the wider context, see what motion design is, and to see the principles at work, try turning your website into a video.