Rive Animations

This walks you through implementing all 12 Disney animation principles in Rive, from squash and stretch to appeal. It's built around Rive's state machine system, showing you how to set up bone hierarchies, use the Graph Editor for easing curves, and wire up interactive triggers from your code. The examples are specific, like offsetting child bone keyframes by 2-4 frames for follow-through action or using inverse scale relationships for squash and stretch. If you're trying to make animations feel polished instead of robotic, this gives you the playbook. The React hooks example at the end is clean and the file size point matters since Rive exports to a tiny binary format.

Install to Claude Code

npx -y skills add dylantarre/animation-principles --skill rive-animations --agent claude-code