Timing Principle Mastery

This breaks down animation timing into practical frameworks you can actually use. It covers the frame rate foundations (1-2 frames for impacts, 8-12 for natural movement), timing categories from physical to theatrical, and domain-specific ranges like UI (100-200ms for responsive interactions, 300-500ms for complex transitions). The timing contrast principle is the most useful bit: fast only feels fast against slow, and held poses create emphasis. It gives you a starting heuristic of 200-300ms for standard interactions, then adjust based on mass, distance, and importance. The domain applications section translates animation theory into concrete millisecond ranges for buttons, modals, and transitions.

Install to Claude Code

npx -y skills add dylantarre/animation-principles --skill timing-principle-mastery --agent claude-code