Implementation Debugging

When your animation won't play, plays once and stops, or flickers weirdly, this gives you a systematic debugging checklist tied to Disney's animation principles. It maps symptoms to root causes (timing off, keyframes not hitting, elements clipped by overflow) and includes a table of common bugs like missing fill-mode or layout thrashing. The devtools tips and event listener pattern for logging animationstart/animationend are genuinely useful. It won't teach you animations from scratch, but if something broke between dev and production or works inconsistently across browsers, the troubleshooting checklist gets you unstuck faster than randomly tweaking CSS properties.

Install to Claude Code

npx -y skills add dylantarre/animation-principles --skill implementation-debugging --agent claude-code