From dylantarre-animation-principles
Use when designing animations for medical apps, patient portals, telehealth, or health tracking interfaces
npx claudepluginhub joshuarweaver/cascade-content-creation-misc-1 --plugin dylantarre-animation-principlesThis skill uses the workspace's default tool permissions.
Apply Disney's 12 principles to create calming, trustworthy experiences that prioritize clarity and reduce anxiety.
Generates design tokens/docs from CSS/Tailwind/styled-components codebases, audits visual consistency across 10 dimensions, detects AI slop in UI.
Records polished WebM UI demo videos of web apps using Playwright with cursor overlay, natural pacing, and three-phase scripting. Activates for demo, walkthrough, screen recording, or tutorial requests.
Delivers idiomatic Kotlin patterns for null safety, immutability, sealed classes, coroutines, Flows, extensions, DSL builders, and Gradle DSL. Use when writing, reviewing, refactoring, or designing Kotlin code.
Apply Disney's 12 principles to create calming, trustworthy experiences that prioritize clarity and reduce anxiety.
| Action | Duration | Easing |
|---|---|---|
| Page Transition | 400-500ms | ease-in-out |
| Modal Open | 350ms | ease-out |
| Alert Appearance | 200ms | ease-out |
| Data Refresh | 300ms | ease-in-out |
| Success Feedback | 400ms | ease-out |
Animations must never cause anxiety or confusion. Prioritize clarity, accessibility, and a calming presence. When in doubt, animate less.