animation-vocabulary

Maps vague descriptions of web motion effects to their exact animation terminology.

Updated Aug 19, 2026
One-click install
npx skills add https://github.com/rithm84/Manor --skill animation-vocabulary-rithm84
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: animation-vocabulary
Source: https://github.com/rithm84/Manor/tree/main/.agents/skills/emilkowalski-design/animation-vocabulary
Command: npx skills add https://github.com/rithm84/Manor --skill animation-vocabulary-rithm84

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Users often know what a motion effect looks or feels like but not its proper name, making it hard to prompt an AI, brief a designer, or search for implementation guidance. This Skill reverse-looks-up the precise term from a curated glossary of web animation vocabulary. ## Core Features & Use Cases - Reverse glossary lookup: Converts loose descriptions like "the bouncy thing when a popover opens" into exact terms such as Pop in or Rubber-banding. - Disambiguation of close terms: Contrasts competing terms (e.g., Clip-path vs Mask, Morph vs Crossfade) so the user can pick the right one. - Comprehensive coverage: The glossary spans entrances, sequencing, transforms, transitions, scroll effects, feedback, easing, springs, looping, polish, performance, and motion principles. - Use Case: A user asks "what's it called when one image turns into another?" and receives Morph as the primary term with Crossfade and Shared element transition as alternates. ## Quick Start Ask the assistant to name the animation effect you are describing, for example by saying what is it called when a scroll resists and snaps back at the edge.

Frequently Asked Questions about animation-vocabulary

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I find the name of a UI animation effect?

Describe what the effect looks or feels like in plain language, such as springy, slides off, or draws itself in. The Skill maps that sensation to the exact glossary term, like Pop in, Rubber-banding, or Line drawing, quoted verbatim.

What is the difference between a morph and a crossfade?

A morph is when one shape smoothly turns into another shape, like the Dynamic Island. A crossfade is when one element fades out as another fades in at the same spot, with no shape transformation between them.

What is the iOS rubber-band scroll effect called?

It is called rubber-banding: resistance and snap-back when you drag past a boundary, matching the iOS overscroll feel. It belongs to the feedback and interaction category of animation terms.

Can this Skill design or build an animation for me?

No. It only names effects by matching descriptions to glossary terms. For designing or building, it gives you the correct vocabulary to prompt an AI or brief a designer, but produces no code or design output.

What happens if my described effect is not in the glossary?

The Skill names the closest matching term and states plainly that it is an approximation, or describes the effect using existing glossary vocabulary. It does not invent new terms outside the glossary.