animate
Analyze a feature and strategically add animations and micro-interactions that enhance understanding, provide feedback, and create delight.
MANDATORY PREPARATION
Invoke /impeccable — it contains design principles, anti-patterns, and the Context Gathering Protocol. Follow the protocol before proceeding — if no design context exists yet, you MUST run /impeccable teach first. Additionally gather: performance constraints.
Assess Animation Opportunities
Analyze where motion would improve the experience:
- Identify static areas:
- Missing feedback: Actions without visual acknowledgment (button clicks, form submission, etc.)
- Jarring transitions: Instant state changes that feel abrupt (show/hide, page loads, route changes)
- Unclear relationships: Spatial or hierarchical relationships that aren't obvious
- Lack of delight: Functional but joyless interactions
- Missed guidance: Opportunities to direct attention or explain behavior
More from flora131/atomic
research-codebase
Document codebase as-is with research directory for historical context
180explain-code
Explain code functionality in detail.
176prompt-engineer
Create, improve, or optimize prompts using best practices
170gh-create-pr
Commit unstaged changes, push changes, submit a pull request.
169gh-commit
Create well-formatted commits with conventional commit format.
168context-compression
This skill should be used when the user asks to "compress context", "summarize conversation history", "implement compaction", "reduce token usage", or mentions context compression, structured summarization, tokens-per-task optimization, or long-running agent sessions exceeding context limits. A core context engineering skill — also activates when the user mentions "context engineering" or "context-engineering" in the context of managing token budgets and session longevity.
168