skills.rest
RavitejaKarra24
RavitejaKarra24COMMUNITY
Explore all skills by this author →
𝕏@RavitejaKarra24GitHub

animation-vocabulary

Maps vague descriptions of web motion effects to precise animation terminology.

Updated Mar 12, 2026
Search Tags:#glossary#animation#transitions#motion design#terminology#easing#ui effects
One-click install
npx skills add https://github.com/RavitejaKarra24/dotfiles --skill animation-vocabulary-ravitejakarra24
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: animation-vocabulary
Source: https://github.com/RavitejaKarra24/dotfiles/tree/main/agents/.agents/skills/animation-vocabulary
Command: npx skills add https://github.com/RavitejaKarra24/dotfiles --skill animation-vocabulary-ravitejakarra24

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 acts as a reverse-lookup glossary that converts informal descriptions into exact animation terms. ## Core Features & Use Cases - Reverse Term Lookup: Matches sensation-based descriptions ("springy", "slides off", "draws itself in") to glossary entries like Spring, Slide in, or Line drawing. - Disambiguation of Close Terms: Contrasts competing terms such as Clip-path vs Mask or Pop in vs Bounce so users can pick the right one. - Curated Glossary Coverage: Covers 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 a popover grows out of the button that opened it?" and receives the term Origin-aware animation with a verbatim glossary definition. ## Quick Start Ask the assistant what the animation is called when an element bounces slightly into place as it appears.

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 words, such as "the bouncy thing when a popover opens". The glossary maps that sensation to the exact term, like Pop in, with a verbatim definition.

What is the difference between a spring animation and easing?▼

Easing defines how speed changes over a fixed duration, while a spring is driven by physics parameters like stiffness, damping, and mass rather than a set duration. Springs can overshoot and settle, producing bounce.

What is the iOS rubber-band scroll effect called?▼

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

Can this skill design or build an animation for me?▼

No. It only names effects by matching descriptions to glossary terms. For designing or implementing an animation, use the identified term to prompt an AI coding tool or brief a designer.

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

The closest matching term is named and clearly flagged as an approximation, or the effect is described using existing glossary vocabulary. New terms are never invented beyond the glossary.

Related Skills

Explore More Design & Creative Skills→
HorusGoulHorusGoul
8

animation-vocabulary

Identify precise web animation and motion effect terms from vague descriptions.

Community
Basic
simoabidsimoabid
1

frontend-ui-animator

Implement purposeful UI animations for Next.js, React, and Tailwind CSS projects.

Community
Intermediate
hossain-khanhossain-khan

animate

Enhance UI features with purposeful animations and micro-interactions.

Community
Advanced
emilkowalskiemilkowalski
34.1k

animation-vocabulary

Maps vague descriptions of motion effects to precise animation terminology.

Community
Basic