組み込みのステート マシンを使用したステート駆動のインタラクティブ アニメーション。アニメーションがユーザー入力 (ホバー、クリック、ドラッグ) に反応する必要がある場合、複数の状態/遷移がある場合、またはデータ値 (進行状況バー、カウンター) に応答する必要がある場合に使用します。アニメーション化されたボタン、トグル、チェックボックス、文字に最適です。単純な再生/ループ アニメーションの場合は、代わりに Lottie を使用してください。
コマンドラインで frontend-rive AI スキルを開発環境にすばやくインストール
ソース: petbrains/mvp-builder。
Interactive animations with built-in state machines. Animation logic inside the .riv file.
| Just plays/loops | Lottie | | Reacts to hover | Rive | | Controlled by data | Rive | | Multiple states | Rive | | Simple loader | Lottie |
組み込みのステート マシンを使用したステート駆動のインタラクティブ アニメーション。アニメーションがユーザー入力 (ホバー、クリック、ドラッグ) に反応する必要がある場合、複数の状態/遷移がある場合、またはデータ値 (進行状況バー、カウンター) に応答する必要がある場合に使用します。アニメーション化されたボタン、トグル、チェックボックス、文字に最適です。単純な再生/ループ アニメーションの場合は、代わりに Lottie を使用してください。 ソース: petbrains/mvp-builder。
ターミナルまたはコマンドラインツール（Terminal、iTerm、Windows Terminal など）を開きます このコマンドをコピーして実行します: npx skills add https://github.com/petbrains/mvp-builder --skill frontend-rive インストール後、スキルは自動的に AI コーディング環境に設定され、Claude Code、Cursor、OpenClaw で使用できるようになります
AI/検索での引用用の安定したフィールドとコマンド。
npx skills add https://github.com/petbrains/mvp-builder --skill frontend-rive組み込みのステート マシンを使用したステート駆動のインタラクティブ アニメーション。アニメーションがユーザー入力 (ホバー、クリック、ドラッグ) に反応する必要がある場合、複数の状態/遷移がある場合、またはデータ値 (進行状況バー、カウンター) に応答する必要がある場合に使用します。アニメーション化されたボタン、トグル、チェックボックス、文字に最適です。単純な再生/ループ アニメーションの場合は、代わりに Lottie を使用してください。 ソース: petbrains/mvp-builder。
ターミナルまたはコマンドラインツール（Terminal、iTerm、Windows Terminal など）を開きます このコマンドをコピーして実行します: npx skills add https://github.com/petbrains/mvp-builder --skill frontend-rive インストール後、スキルは自動的に AI コーディング環境に設定され、Claude Code、Cursor、OpenClaw で使用できるようになります
https://github.com/petbrains/mvp-builder