| name | animation-motion-polish |
| description | Use this skill for motion hierarchy, transitions, microinteractions, reduced motion, performance-safe animation. Trigger when the task involves web design work related to Animation Motion Polish, production implementation, audits, debugging, strategy, or validation. |
Animation Motion Polish
Use this skill to handle Web Design tasks focused on motion hierarchy, transitions, microinteractions, reduced motion, performance-safe animation.
Workflow
- Clarify the user outcome, constraints, current stack, and definition of done.
- Inspect the local repository or provided artifacts before proposing changes.
- Check official documentation when APIs, platform rules, SDK versions, policies, or production behavior may have changed.
- For non-trivial choices, compare proven open-source patterns or examples and adapt ideas without copying incompatible code.
- Implement the smallest production-ready change that satisfies the request.
- Validate with the most relevant checks: tests, lint, typecheck, build, browser/device review, audits, or manual scenario.
- Report changed files, commands run, remaining risks, and exact next steps.
Focus Checklist
- Define scope and assumptions explicitly.
- Prefer existing project conventions and tools.
- Handle loading, empty, error, permission, and edge states where relevant.
- Include security, privacy, performance, accessibility, and rollback considerations when they apply.
- Keep output actionable and evidence-backed.
Guardrails
- Do not add motion that harms accessibility or perceived performance.
- Do not perform destructive, paid, production, trading, publishing, or account-changing actions without explicit user confirmation.
- Do not expose secrets, private keys, tokens, cookies, personal data, or confidential business data.
- If validation is impossible, state exactly why and provide a manual verification path.
