animation-vocabulary

Featured

Reverse-lookup glossary that turns a vague description of a web animation or motion effect into its exact term ("the bouncy thing when a popover opens" → Pop in; "the iOS rubber-band scroll" → Rubber-banding). Use when the user asks "what's it called when…", or describes a motion effect without knowing its name and wants the right word to prompt an AI or designer with. For naming an effect, not designing or building one.

Web & Frontend 436 stars 36 forks Updated today MIT

Install

View on GitHub

Quality Score: 89/100

Stars 20%
88
Recency 20%
100
Frontmatter 20%
70
Documentation 15%
100
Issue Health 10%
50
License 10%
100
Description 5%
100

Skill Content

# Animation Vocabulary Turn a vague description of a motion or effect into the precise term, so the user knows what to ask for. ## Quick Start The user describes an effect loosely. You return the matching term(s) in this format: ``` **Stagger** — Animate several items one after another with a small delay between each, creating a cascade. ``` If several terms could fit, list the best match first, then 1–2 alternates with a one-line note on how they differ. ## Instructions 1. **Read for intent, not keywords.** Users describe what they *see* or *feel* ("springy", "slides off", "draws itself in"), not the technical name. Map the sensation to the glossary below. 2. **Quote the glossary verbatim.** Its descriptions are authoritative — use them as-is, don't paraphrase. 3. **Disambiguate close terms.** When two compete (*Clip-path* vs *Mask*, *Pop in* vs *Bounce*, *Shared element transition* vs *Layout animation*), contrast them so the user can pick. 4. **When nothing matches exactly,** name the closest term and say plainly it's an approximation, or describe the effect in the glossary's vocabulary (e.g. "that's a *stagger* of *scale-in* entrances"). 5. **Stay within this glossary.** If a term genuinely isn't here, say so rather than inventing one — though you may explain the concept using these words. 6. **Keep it tight.** A naming question wants a name, not an essay. Lead with the term; expand only if asked. ## Examples **Example 1 — feel-based** User: "What's it called whe...

Details

Author
termio-sh
Repository
termio-sh/termio
Created
3 months ago
Last Updated
today
Language
Swift
License
MIT

Similar Skills

Semantically similar based on skill content — not just same category

Web & Frontend Listed

animation-vocabulary

Reverse-lookup glossary that turns a vague description of a web animation or motion effect into its exact term ("the bouncy thing when a popover opens" → Pop in; "the iOS rubber-band scroll" → Rubber-banding). Use when the user asks "what's it called when…", or describes a motion effect without knowing its name and wants the right word to prompt an AI or designer with. For naming an effect, not designing or building one.

6 Updated today
TommyBez
Web & Frontend Listed

animation-vocabulary

Reverse-lookup glossary that turns a vague description of a web animation or motion effect into its exact term ("the bouncy thing when a popover opens" → Pop in; "the iOS rubber-band scroll" → Rubber-banding). Use when the user asks "what's it called when…", or describes a motion effect without knowing its name and wants the right word to prompt an AI or designer with. For naming an effect, not designing or building one.

146 Updated today
arcboxlabs
Web & Frontend Listed

animation-vocabulary

Reverse-lookup glossary that turns a vague description of a web animation or motion effect into its exact term ("the bouncy thing when a popover opens" → Pop in; "the iOS rubber-band scroll" → Rubber-banding). Use when the user asks "what's it called when…", or describes a motion effect without knowing its name and wants the right word to prompt an AI or designer with. For naming an effect, not designing or building one.

1 Updated yesterday
jackneil