Communitygithub.com

goetzphillip10-dotcom/Claude-Video-2

Claude Video 2.0。Claude Codeを使って、スタジオ品質のモーショングラフィックを無料で制作します。21種類のルックのギャラリーから選択し、5つの質問に答えるだけで、コード(HTML + GSAP、HyperFramesでMP4にレンダリング)で作品を構築します。

Claude-Video-2 とは?

このスキルは、Claude Code上で動作するモーショングラフィック制作エージェントです。ユーザーは最初に21種類のアニメーションスタイル(ルック)が動画でプレビューされるギャラリーから好みのスタイルを選択し、その後5つの簡単な質問に答えるだけで、プロ品質のモーショングラフィック動画を生成できます。生成プロセスは、ストーリーボード作成、静止画承認、ペーシングとループの自動チェックなどを含む、しっかりとしたワークフローで構成されており、すべてコードベースで行われるため、一貫性と再利用性が高いのが特徴です。対応プラットフォームはClaude Code(HyperFramesを使用)で、ユーザー自身の写真やクリップ、あるいはHiggsfield AIによるAIクリップを組み込むことも可能です。このスキルは、モーショングラフィック制作の専門知識がないユーザーでも、直感的な操作と自動化された品質チェックを通じて、短時間で高品質な動画を作成できるように設計されています。

対応✓Claude Code~Codex CLI~Cursor
npx skills add https://github.com/goetzphillip10-dotcom/Claude-Video-2/tree/main

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

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

ドキュメント

Claude Video 2.0

3つの段階: A. ルックを選ぶ(ギャラリー) -> B. 5つの質問 -> C. 制作(ストーリーボード、静止画、レンダリング、チェック)。 各ステップは references/hacks.md の5つのハックに従います: 1つのスタイル、実際のリファレンス、数字で示すブリーフ、1つのループクロック、そしてコードではなくフレームのチェック。

$SKILL はこのスキルのフォルダ(通常は ~/.claude/skills/claude-video-studio)を意味します。 作品ごとに新しい作業フォルダを作成してください(例: ./video-<short-name>/)。$SKILL 内で構築しないでください。

開始前に

bash $SKILL/scripts/doctor.sh を一度実行してください。何か不足している場合は、修正コマンドを1つだけ伝えて停止します。

ステージ A: ルックを選ぶ

  1. ギャラリーをバックグラウンドで起動します(バックグラウンド実行オプションを使用; 127.0.0.1 で提供され、90分後に自動的に停止します): python3 $SKILL/scripts/gallery.py ブラウザで開き、アドレスが表示されます。ユーザーにもアドレスを伝えてください(自動で開かなかった場合に備えて; アドレスのみが必要な場合は --no-open を追加)。ユーザーが選択したら停止するか、そのままにしておいてください(自動停止します)。
  2. 次の内容を短いメッセージで伝えてください: "スタイルギャラリーを開きました: <アドレス>。各タイルはコードから作成された実際の動画です。タイルを「メディアあり」に切り替えると、実際の写真やフッテージで表示されます。お気に入りのタイルで「このスタイルを使用」を押して、ここに貼り付けてください。または、自分で用意したリファレンスのリンクや画像を1~3個貼り付けてください。"
  3. ユーザーが回答した場合:
    • スタイルID(例: paper-world): $SKILL/styles/<id>/STYLE.md を読んでください。その仕様がこの作品のルールとなります。
    • 独自のリファレンス: それぞれを確認し(リンクを開き、画像を読む)、作業フォルダに STYLE.md という新しい仕様を、$SKILL/references/style-format.md の形式で作成してください。各リファレンスがどのように作られたか(マスクテキスト、スローカメラ、長いホールド)、16進数の色とイージング番号を使って説明してください。5行で表示してください。
    • "あなたが選んでください": トピックに最適なルックを選択し、その理由を1行で伝えてください。

ステージ B: 質問

$SKILL/questions.md を読んでください。その --- の行の間にあるブロックを、一字一句そのまま1つのメッセージとして送信してください。既に伝えられたことはスキップしてください。"go" はすべてのデフォルトへの「はい」として受け入れてください。フォローアップは必要な場合のみ使用してください。

ステージ C: 制作

  1. 数字で示すブリーフ(ハック3)。作業フォルダに BRIEF.md を作成してください: サイズ(16:9の場合は1920 x 1080、9:16の場合は1080 x 1920)、長さ、30fps、ループするかどうか、正確な単語、16進数のパレット(ブランドカラーはスタイルの色を置き換え、ルールはそのまま)、フォントとそのリンク、イージング番号、そして常に禁止されるリスト: 色相シフトグラデーションの禁止、グロー・ブルーム・レンズフレアの禁止、目が追うものへのリニアイージングの禁止、すべてを中央に配置することの禁止、ゼロからのスケールアップの禁止、画面上の最大6単語、1つのアクセントカラー、偽クロームの禁止。 選択したスタイル独自の特徴がこのリストと競合する場合(太陽のグロー、中央寄せのウィジェットなど)、スタイルが優先されます。そのギャラリー動画が証明です。リストの他の項目は引き続き適用されます。
  2. ストーリーボード。 storyboard.json を作成してください(各ショットの時間、グラフィックの動作、アセットの種類: code、user_photo、user_clip、generate。$SKILL/examples/storyboard.json を参照)。python3 $SKILL/scripts/storyboard.py storyboard.json を実行し、テーブルを表示してください。
    • いずれかのショットが generate(Higgsfield AIクリップ)の場合、テーブルにはクレジット見積もりが表示されます。何かを使う前に、「はい」という明確な返事を待ってから停止してください。その後、各クリップを python3 $SKILL/scripts/higgsfield.py generate ... --out media/shotN.mp4 --yes で1つずつ作成し、使用する前にそれぞれの3フレームを確認してください。$SKILL/references/media.md を参照してください。
    • AIクリップがない場合、テーブルを表示し、ユーザーが反論しない限り続行してください。
  3. 構築。 bash $SKILL/scripts/new_project.sh <work>/proj 16x9|9x16 <seconds> <style id> を実行してください。 スタイルにリファレンス作品がある場合、プロジェクトはそのコピーとして開始されます: 単語、色、タイミング、サイズをブリーフに合わせて変更します(スクリプトはサイズや長さが異なる場合に警告を表示します。その場合はレイアウトをやり直し、クロップはしないでください)。そうでない場合はテンプレートから構築してください。ループが必要でリファレンスがループしない場合は、$SKILL/references/loops.md に従ってください。 重要なルール:
    • すべてのモーションに1つのクロック(ハック4): studio.js の STUDIO.play(t => render(t), { loop })、または一時停止された1つのGSAPタイムライン。同じ時間入力、同じ出力: Math.randomは使わない(STUDIO.rng を使用)、Date.nowは使わない、タイマーは使わない。
    • フォント: 無料のもののみ。各フォントを <link> で読み込み、1つのフォントでもリンクがある場合はすべてのフォントにリンクを付けてください($SKILL/references/hyperframes.md を参照)。
    • メディアはデザイン内に配置してください(マスク、カード、シェイプ)。読みにくいテキストの下や顔の上には配置しないでください。
    • ユーザーの写真とクリップは <work>/proj/media/ にコピーしてください。オリジナルは移動したり変更したりしないでください。
  4. 承認用の3つの静止画(ハック5)。bash $SKILL/scripts/stills.sh <work>/proj <t1>,<t2>,<t3> を実行します。各静止画はショットチェンジ後約0.6秒後で、要素が落ち着いた後のタイミングにしてください(必要に応じてさらに多くのフレームを自分の確認用に見ても構いません)。stills/peek.jpg を読んでください。構成、モーション、タイポグラフィ、カラー、アイデアを、厳しい先輩モーションデザイナーのように1~10で評価してください。最も悪い3つの点を修正してください。すべてが8以上になるまで繰り返してください。その後、3つの静止画とスコアをユーザーに見せて、「レンダリングしてもよろしいですか?」と尋ねてください。「はい」の返事を待ってください(メモがあれば修正、新しい静止画、再度質問)。
  5. レンダリング。 bash $SKILL/scripts/render.sh <work>/proj <work>/out/draft.mp4 draft を実行してください。
  6. チェック。 python3 $SKILL/scripts/pacing_check.py <work>/out/draft.mp4(ループする場合は --loop を追加; 1秒以上のデッドギャップなし、0.3秒未満の表示なし)と、ループする場合は python3 $SKILL/scripts/loop_check.py <work>/out/draft.mp4 --project <work>/proj(0秒のフレームと最後のフレームが同一である必要があります)を実行してください。コンタクトシートを読んでください。両方のチェックに合格するまで修正と再レンダリングを行ってください。
  7. 最終版。 bash $SKILL/scripts/render.sh <work>/proj <work>/out/final.mp4 high を実行し、再度チェックを実行してください。
  8. 引き渡し。 パス、長さ、フレームサイズ、ファイルサイズ、チェック結果、スコア、そして次に試すであろうことを1行で伝えてください。ファイルが20MBを超える場合は、共有用に小型版も作成してください: ffmpeg -v error -i final.mp4 -c:v libx264 -crf 22 -preset slow -an final-share.mp4。 その後、$SKILL/config.json を読んでください。link が空でない場合、次の1行で終了してください: "その他のスタイルとヘルプ: <link_label or link> "。空の場合は、何も言わないでください。

厳格なルール

  • APIキーを尋ねたり、印刷、ログ、コミットしたりしないでください。キーはシェルまたは .env ファイルのみに保管してください。
  • ストーリーボードとそのコストを表示し、その計画に対する明確な「はい」を得るまでは、クレジットを使用しないでください。
  • テキストやグラフィックで顔を覆わないでください。
  • チェックを実行せずに合格したと言わないでください。フレームを見ずにルックが正しいと言わないでください。
  • 1作品につき1スタイル。1つのアクセントカラー。禁止リストは常に適用されます。
  • 無料フォントのみ。フォントファイルをプロジェクトにコピーしないでください。

ファイル

  • gallery/ ギャラリーページとその動画。scripts/gallery.py が提供します。
  • styles/<id>/ 21のルック: STYLE.md(パレット、タイポグラフィ、イージング、モーションルール、特徴的な動き、メディア、禁止リスト)と、ほとんどのルックには index.html(完全な実動リファレンス作品)が含まれます。
  • questions.md ステージBの質問(自由に編集可能)。config.json オプションの終了リンク。
  • references/ ソース付きの5つのハック、モーション数値、HyperFramesルール、ループの作り方、メディアモードとHiggsfield、スタイル形式。
  • templates/motion/ 空のスターターと studio.js(1つのループクロック)。
  • scripts/ doctor、gallery、new_project、stills、render、pacing_check、loop_check、storyboard、higgsfield。
  • examples/ 小さなブリーフとストーリーボード。

関連スキル