Communitygithub.com

キネティックリール

1つのトピックからInstagram、TikTok、YouTubeショート、LinkedIn向けの完成された縦型リール(1080×1920 MP4、38〜60秒)を作成します。単語ごとのキャプションをAIナレーション(Gemini TTS)に同期させ、実際のスクリーンショットやロゴを動くカードとして配置し、効果音とフリーのCC0ミュージックを追加します。

キネティックリール とは?

このスキルは、AIエージェントがコードとヘッドレスブラウザを用いて本格的な縦型リール動画を制作するためのものです。モーションデザイナーと同様のワークフローをコードで再現し、HTMLで各フレームを描画、ffmpegで音声と音楽を合成します。Claude Code、Cursor、CodexなどのAIコーディングエージェント上で動作し、ユーザーが「リール」「ショート動画」「TikTok」「解説動画」などをリクエストした際に活用します。スキルはトピック選定から事実調査、スクリプト作成、音声生成、キャプション同期、アセット配置、レンダリングまでの全工程をステップバイステップで実行します。一貫して実際のスクリーンショットやロゴのみを使用し、偽のUIや人物を生成しないというルールに従います。最終的に、ソーシャルメディアにそのままアップロード可能なMP4ファイルとカバー画像を出力します。

対応✓Claude Code~Codex CLI~Cursor✓Gemini CLI
npx skills add https://github.com/Shaddy37/kinetic-reels/tree/HEAD/skills/kinetic-reels

お気に入りのAIに質問する

このエージェントスキルを事前に読み込んだ状態で新しいチャットを開きます。

ドキュメント

キネティックリール は何をしますか?

あなたはモーションデザイナーと同じ方法でリールを作成しますが、コードを使用します。1つのHTMLページが動画の任意の瞬間tを描画し、ヘッドレスブラウザが30fpsでフレームごとにレンダリングし、ffmpegが音声と音楽を追加します。同じ入力から同じ動画が毎回生成されます。

SKILL はこのファイルが置かれているフォルダを意味します。すべてのコマンドはユーザーのプロジェクトフォルダ(reels/ と .env がある場所)から実行してください。Mac/Linuxでは python3、Windowsでは python を使用します。

最初のリールの前に(1回だけ)

  1. node "SKILL/scripts/doctor.mjs" を実行します。FIX行が表示された場合は node "SKILL/scripts/setup.mjs" を実行し、残りのFIX行に従ってください。ALL GOOD と表示されるまで次のステップに進まないでください。
  2. ユーザーは .env にGemini APIキーが必要です(GEMINI_API_KEY=...、https://aistudio.google.com/apikey から無料で取得できます)。キーを印刷したり、.env をコミットしたりしないでください。
  3. kinetic.config.json には、ユーザーのハンドル(ウォーターマーク)、名前、およびエンドカード用の正方形の写真が保存されます。new-reel.mjs が初回に作成します。ユーザーに3つの値を尋ねて入力してください。

リールを作成する(すべてのステップを順番に)

  1. トピックと事実. 1つのトピックに合意します。一次情報源(ドキュメント、リポジトリ、ベンダーの公式ページ)から調査し、すべての主張を facts.md にURLと参照日付とともに書き込みます。事実がなければ主張は記載しません。
  2. ビートの計画(作成前にユーザーに表示します)。5〜7項目のリストでは38〜45秒、解説動画では最大60秒。シーンごとに:秒数、発言内容、画像、正確なアセットファイルとその出典。アセット(ロゴ、写真、スクリーンショット)が見つからない場合は、停止してユーザーに尋ねてください。偽のロゴを描いたり、UIを創作したり、人物を生成したりしないでください。
  3. フォルダの作成: node "SKILL/scripts/new-reel.mjs" <スラッグ> [--logo claude]。コーナーロゴはトピック自身のロゴを使用します(as/ 内のファイル。不足している場合は実際のSVGを追加します)。
  4. スクリプト. tts.json(音声が話す内容を、フック/本文/ペイオフ/CTAパートに分割し、それぞれにスタイルを設定)と script.txt(キャプション、同じ単語、同じ順序)を作成します。ルール:references/SCRIPT.md。タグとスタイル:references/VOICE.md。
  5. 音声: python "SKILL/scripts/voice.py" reels/<スラッグ> を実行し、次に python "SKILL/scripts/tighten.py" reels/<スラッグ> を実行します(ポーズを0.34秒に、通常速度)。テイクを聴くか、任意の文字起こしツールで確認します。行が欠けていたり名前が間違っていたりする場合は、テキストを修正してvoice.pyを再実行します。
  6. キャプション + タイミング: python "SKILL/scripts/captions.py" reels/<スラッグ> は DUR、SCN、CAPS を出力します。それらを reel.js に貼り付けます。単語の表示が早すぎたり遅すぎたりする場合は、アンカーを手動で調整します([email protected])。
  7. 実際のアセット: スクリーンショットは node "SKILL/scripts/docshot.mjs" <url> reels/<スラッグ>/as/<名前>.png [--selector "css"] で、ロゴはベンダー提供のSVGまたは SKILL/assets/logos から取得します。すべてのアセットには画面上に小さな出典表示が付きます。詳細:references/ASSETS.md。
  8. reel.js の作成. 最初に examples/claude-code-shortcuts/reel.js を読んでください。これはゴールデンリールであり、すべてのパターンを示しています。使用可能な部品:references/COMPONENTS.md。画像はy 260〜1100に、キャプションはy 1150〜1570に配置します。
  9. 審査: node "SKILL/engine/shot.cjs" reels/<スラッグ> audit は LAYOUT PASS と表示しなければなりません。次に node "SKILL/engine/shot.cjs" reels/<スラッグ> prev 0 <各シーン内の1つの時刻> を実行し、すべての静止画を確認します(JPGを開きます)。修正して繰り返します。フックの5つの静止画(0、0.5、1、2、3秒)を references/SCRIPT.md(フックのルール)と照らし合わせて確認します。
  10. サウンド: mix.py を編集し(DUR、SCN、画像変更ごとに1つの効果音。references/SOUND.mdを参照)、python reels/<スラッグ>/mix.py を実行します。別のBGMが必要な場合:python "SKILL/scripts/music.py" search "lofi chill" を実行し、次に pull <id> reels/<スラッグ> を実行します(CC0のみ)。
  11. レンダリング: node "SKILL/engine/render.cjs" reels/<スラッグ> を実行し、次に python "SKILL/scripts/finish.py" reels/<スラッグ> を実行し(必ずPASSと表示)、node "SKILL/engine/shot.cjs" reels/<スラッグ> cover 0.6 を実行します。
  12. 引き渡し: reels/<スラッグ>/out/final.mp4 と out/cover.jpg を、トピックキーワードを含むキャプション(1行目)、3〜5個のハッシュタグ、および facts.md からの出典とともに引き渡します。

視聴者を引き続けるためのルール(理論ではなく実際の結果から)

  • ペイオフは1行目に配置します。「今日は何かをお見せします」よりも「ほぼ誰も知らないClaude Codeの7つのショートカット」の方が効果的です。
  • フレーム0からモーションを開始します。エントランスを負の時刻で開始し(popV(t,-0.3,...))、最初のフレームがすでに動いているようにします。空白や静止した最初のフレームは絶対に避けてください。
  • 最初のフレームから最後のフレームまで一貫したルックを保ちます。暗い画面から明るい画面に切り替えないでください。新しい動画と認識され、視聴者がスワイプしてしまいます。
  • リストの場合:番号付きヘッダー(ショートカット 3/7 + ドット)と、2行目にオープンループ(「そして7つ目は私の時間を何時間も節約してくれます」)を配置し、最後に回収します。
  • 0.8〜1.5秒ごとに新しい画像を表示します。効果を見せて、説明しないでください。
  • 音声を最前面に配置します。音楽は小さくします(sfx.mix_reel のデフォルトはテスト済みです)。
  • CTAはこのリールだけのために作成します(保存する、適切な人に送る、または実際の質問)。「フォローしてもっと見る」は絶対に使用しないでください。

問題が発生した場合

references/TROUBLESHOOTING.md を参照してください。よくある問題:ffmpegがPATHにない、Chromiumがインストールされていない、音声APIからの 429(現時点では無料枠の制限。待つか、課金を有効にしてください)、審査からのCLIP(テキストがカードより広い。テキストを短くするか、カード幅を920pxまで広げてください)。

関連スキル