rive-interactivelisted

# Rive Interactive - State Machine-Based Vector Animation ## Overview Rive is a state machine-based animation platform that enables designers to create interactive vector animations with complex logic and runtime interactivity. Unlike timeline-only animation tools (like Lottie), Rive supports state machines, input handling, and two-way data binding between application code and animations. **Key Features**: - State machine system for complex interactive logic - ViewModel API for two-way data binding - Input handling (boolean, number, trigger inputs) - Custom events for animation-to-code communication - Runtime property control (colors, strings, numbers, enums) - Cross-platform support (Web, React, React Native, iOS, Android, Flutter) - Small file sizes with vector graphics **When to Use This Skill**: - Creating UI animations with complex state transitions - Building interactive animated components (buttons, toggles, loaders) - Implementing game-like UI with state-driven animations - Binding real-time data to animated visualizations - Creating animations that respond to user input - Working with designer-created animations requiring runtime control **Alternatives**: - **Lottie** (lottie-animations): For simpler timeline-based animations without state machines - **Framer Motion** (motion-framer): For code-first React animations with spring physics - **GSAP** (gsap-scrolltrigger): For timeline-based web animations with precise control ## Core Concepts ### 1. State Machines