vibe-motion/skills

解決する課題

このプロジェクトは、Claude CodeなどのAIエージェントが、高品質でプログラムによって制御された視覚効果、モーショングラフィックス、およびプロモーションビデオを生成できるようにするための「スキル」（モジュール化されたアニメーションおよびレンダリングツール）のコレクションを提供します。エージェントに特定のレンダリングエンジンとアニメーションルールを提供することで、テキストベースのAIプロンプトとプロフェッショナルグレードの視覚的出力との間のギャップを埋めます。

仕組み

ユーザーは、インタラクティブなスクリプト（npx skills add vibe-motion/skills）を介してスキルをインストールします。その後、AIエージェントはこれらのツールを使用して特定のレンダリングタスクを実行します。ライブラリには、さまざまな特化型レンダラーが含まれています：

• ベクターおよびロゴモーション: pixel2motion のようなツールはラスター画像をSVGに変換してアニメーション化し、svg-assembly-animator はエネルギーの高い組み立てエフェクトを作成します。
• ビデオ制作: brand-launch-video-star はウェブサイトのURLや製品画像からテンポの速いプロモーションビデオを作成し、remotion-vinyl-player は音楽プレーヤーのアニメーションを作成します。
• 3Dおよび物理シミュレーション: 3Dの地球飛行経路（threejs-earth-render）、3Dのクラドニ粒子システム（3d-chladni-render）、およびインタラクティブな p5.js カーテンシミュレーション（printed-curtain-render）のレンダリングツール。
• UI/UXアニメーション: WeChatスタイルのチャットアニメーション（wechat-2d-render）や金融K線チャート（remotion-candlestick）をレンダリングするためのツール。
• デザイン原則: disney-animation-rule-skill は、コード駆動型のアニメーションの流動性と感覚を向上させるために、ディズニーのアニメーションの12原則を適用するためのフレームワークをエージェントに提供します。

対象者

すべてのフレームを手動でコーディングすることなく、ブランド資産、ソーシャルメディアコンテンツ、UIアニメーションの作成を自動化するためにAIエージェントを使用する開発者やクリエイター。

ハイライト

• エージェント対応: AIエージェントのワークフロー（例：Claude Code）に統合されるように特別に設計されています。
• 多様なビジュアルスタイル: 2D SVGアニメーションから複雑な3D粒子システム、Remotionベースのビデオレンダリングまで、あらゆるものをカバーしています。
• 自動化されたブランド資産: URLから直接プロフェッショナルな製品ローンチビデオを生成する機能。
• 物理ベースのモーション: 布/カーテンや流体のような粒子の動きのシミュレーションが含まれています。