메뉴
Search a codebase or UI for places that don't animate but should, and reject everything that shouldn't. Read-only; proposes motion with exact values, does not implement.
Codex 또는 Claude로 설치 이 Prompt를 복사해 Codex, Claude 또는 다른 어시스턴트에 붙여 넣으면 Skill 페이지를 검토하고 설치를 진행할 수 있습니다.
SOC 직업 분류 기준
Reverse-lookup glossary that turns a vague description of a web animation into its exact term. Use when the user asks "what's it called when…".
Apple's approach to interface design and fluid, physical motion, translated for the web. Use when building or reviewing gesture-driven UI, spring animations, drag/swipe/sheet interactions, momentum and interruptible transitions, translucent materials and depth, typography (optical sizing, tracking, leading), reduced-motion, or the design foundations (feedback, spatial consistency, restraint) behind Apple-style interfaces.
Emil Kowalski's philosophy on UI polish, component design, animation decisions, and the invisible details that make software feel great. Based on years of experience at Vercel and Linear.
Survey a codebase's animation and motion code as a senior motion advisor, then produce a prioritized audit and self-contained implementation plans for other agents to execute. Read-only on source code.
Reviews animation and motion code against a high craft bar derived from Emil Kowalski's design engineering philosophy. Default to flagging; approval is earned.
| name | find-animation-opportunities |
| description | Search a codebase or UI for places that don't animate but should, and reject everything that shouldn't. Read-only; proposes motion with exact values, does not implement. |
A search skill. Sweep an interface for moments that would genuinely benefit from motion, propose precise recipes, reject everything else.
Every candidate must survive all four questions:
| Frequency | Verdict |
|---|---|
| 100+/day | Reject. Never animate. |
| Tens/day | Reject or near-imperceptible only |
| Occasional | Eligible |
| Rare/first-time | Eligible — delight budget lives here |
Must be one of: Feedback, Spatial consistency, State indication, Preventing jarring change, Explanation, Delight (rare only).
Must work within UI under 300ms budgets.
Decoration on functional, information-dense UI hinders.
Feedback gaps — no :active state, plain click for destructive actions.
Teleporting state — instant content swaps, snapping accordions.
Missing spatial story — panels with no trigger connection, asymmetric exit paths.
Group entrances — all-at-once grids/lists.
Gesture seams — no physics on drags, hard stops at boundaries.
Delight budget — flat first-run, success, celebration moments.
| # | Location | Today | Purpose | Frequency | Suggested motion |
|---|---|---|---|---|---|
| 1 | Toast.tsx:41 | Instant appear | Preventing jarring | Occasional | @starting-style: opacity: 0; translateY(100%), transition: 400ms ease |
List 2–5 rejected with gate reason.
How much motion the interface needs, highest-leverage suggestion, handoff to improve-animations plan <suggestion>.
