Comfort Safety

This gives you animation guidelines grounded in Disney principles but adapted for interfaces where users need to feel secure. You get specific timing ranges (300-450ms for most transitions), custom easing curves, and keyframe patterns for common reassurance scenarios like confirmations and protective reveals. The approach is intentionally gentle: minimal squash and stretch, no surprises, soft landings on everything. Use it when you're building financial apps, healthcare tools, or anything involving passwords and sensitive data where sudden motion would feel wrong. The constraint against exaggeration and unpredictability is the real discipline here, it forces you to communicate safety through consistency rather than flashiness.

Install to Claude Code

npx -y skills add dylantarre/animation-principles --skill comfort-safety --agent claude-code