Rive Interactive

Trust Score 85/100

from claudedesignskills143

State-machine driven vector animations with runtime interactivity and ViewModel data binding for web and mobile UIs.

triggers:rivestate machineinteractive animationviewmodelrive-reactanimation inputpreload rive

GitHub SKILL.md

What it does

Rive Interactive provides patterns and examples for building state-machine driven vector animations that respond to user input and application data. It covers state machines, inputs (boolean/number/trigger), ViewModel two-way binding, events, runtime property control, and cross-platform integration (React, Web, React Native, iOS, Android, Flutter). Concrete code examples and scripts help generate components and ViewModel bindings.

When to use it

Use this skill when you need interactive UI animations with complex transitions, data-driven visualizations, animated components (buttons, toggles, loaders), or when designer-created Rive assets require runtime control that timeline-based tools (like Lottie) cannot provide.

What's included

Scripts: component_generator.py, viewmodel_builder.py (has_scripts=true)
References: examples, starter templates, docs links (has_references=true)
Instructions: step-by-step React patterns for embedding .riv files, binding state machine inputs, listening for events, preloading, and performance tips.

Compatible agents

Likely compatible with developer-oriented coding assistants (Claude Code, Copilot-style agents) that can read and generate React/JSX and integration code.

Audit Summary

Rive Interactive is a documentation-heavy skill for state-machine-driven vector animations with React. SKILL.md is comprehensive with 7 patterns, pitfalls, and integration guides. The two bundled scripts are trivial print-only template generators that just output boilerplate JSX — they add minimal value beyond what's already in the docs. No security concerns whatsoever.

Watch Out

Scripts only print templates — not actual generators despite naming
Requires .riv files from Rive Editor to be useful
Niche: only relevant to developers using Rive specifically

Notes

Well-structured documentation skill for Rive animation integration. Scripts are cosmetically named 'generator' and 'builder' but are just print statements. SKILL.md carries all the value. No security issues. Useful for Rive users but niche audience.

Information

Repository: claudedesignskills
Stars: 143

Trust Score

Overall85

Security100

Code Quality68

Architecture72

Usefulness52

Related Skills

FastAPI Project Templates

Creates production-ready FastAPI project scaffolds with async patterns, DI, middleware, and testing best practices for high-performance APIs.

Clerk Vue Patterns

Vue 3 integration patterns for Clerk: composables, router guards, and Pinia auth store integration.

Colorize (Strategic UI Color)

Introduce purposeful color into monochromatic or dull interfaces to improve hierarchy, meaning, and emotional warmth while preserving accessibility.

Manim Idea to Export

Turn plain-language concepts into production-ready ManimCE scene blueprints, runnable code, preview renders, and final export commands for video assets.

tmux Remote Control

Control tmux sessions for interactive TTYs: send keystrokes, capture panes, orchestrate parallel coding agents, and monitor output safely.

Android Bluetooth

Controls Android Bluetooth/BLE: status, power, scanning, connect/disconnect, and permission recovery for device workflows.

Agent Browser — Core

Core usage guide for agent-browser: snapshot-and-ref browser automation to navigate pages, interact with elements, extract data, take screenshots, manage sessio

React Development Expert

Provides authoritative React guidance on hooks, state patterns, Server Components, performance optimization, and common architectural patterns.

Back to Skills