/animation-vocabulary

Animation Vocabulary

Helps you find the exact term you need, so you can ask your agent for what you actually want.

Updated September 15, 2026

What it does

Maps a loose description of motion to its exact term, like “the items coming in one after another” to stagger
Tells close terms apart, like pop in versus bounce, or a layout animation versus a shared layout animation
Covers easing, springs, layout, scroll, SVG, gestures, performance, and accessibility
Names the anti-patterns too, like scale from zero, hover flicker, and layered entry

When to use it

When you can describe an effect but don’t know what it’s called, and want the precise word to prompt with. The right word helps your agent build the right thing sooner.

What the skill changed

Here’s the same question, answered with and without the skill. Because the skill grabs a term from a curated list, it can find the right one for you, with the right meaning, and even show the things you should avoid. The “grow” or “zoom” you get without the skill is still relatively vague.

Before

That’s usually called a “grow” or “zoom” animation. You can do it by scaling the popover from scale(0) to scale(1) with a transition, so it looks like it grows out of the button.

Want me to add it?

a loose word · not the thing you actually want

After

Origin-aware animation

The popover animates out of its trigger instead of from its own center, which is the CSS default.

Pop in

It grows into place from a near-full starting scale (0.9–0.95, never 0) with opacity, so it feels like it was always almost there.

Avoid scale from zero: animating from scale(0) looks like it came from nowhere.

the exact terms from the glossary, rules included

Example prompts

You don’t need special wording. Describe the problem the way you’d describe it to a teammate. Here are some more to try on your own product.

The course behind these skills

These skills come from what I teach in AI for UI. Join the waitlist to get two lessons and be the first to know when enrollment reopens on December 8.

Two preview lessons

AI for creative work
How to write good skills