Communitygithub.com

Bajanpunkw/reverse-engineer-video

任意の動画のビジュアルスタイルをコード(Three.js / canvas → MP4)で再現し、独自のストーリーで新しい動画を生成します。スタイルがコードで描画可能かどうかの確認から、フレーム精度のスタイル仕様、ストーリーとシーン、レンダリング、サウンド、完成動画までを網羅します。

reverse-engineer-video とは?

このスキル(REV)は、与えられた動画やチャンネルのリンクから、そのビジュアルスタイル(形状、パレット、フォント、レイアウト、照明、カメラ、トランジション、テンポ)をコードで完全に再現するための包括的なワークフローを提供します。元の映像コンテンツをコピーするのではなく、スタイルはそのままに、全く新しいストーリーを語る新しい動画を生成する点が革新的です。主に2つのモードがあります:「新スタイル」モードでは、セットアップから最終チェックまでの全7段階(00〜6)を順に実行します。「既存スタイルの新エピソード」モードでは、以前に作成したスタイル仕様(style.md)とエンジン(src/)を再利用し、ストーリーとシーンとサウンドのみを新しくします。各段階には専用のスクリプト(フェッチ、実現可能性分析、パルス分析、比較、レンダリング、音声合成、ラウドネス調整、ミックスなど)が用意されており、調整可能なパラメータと自己チェック機構により、品質を担保しながら効率的に動画を生成できます。このスキルは Claude Code、Cursor、Codex などの AI エージェント環境で動作し、ユーザーの承認を待ちながら段階的に進行します。

対応~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/Bajanpunkw/reverse-engineer-video/tree/HEAD

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

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

ドキュメント

REV — Reverse Engineer Video(動画スタイルをコードで再現)

成果物はスタイルであり、動画そのものではありません。視覚言語(形状、パレット、フォント、レイアウト、光、カメラ、トランジション、テンポ)はオリジナルに一致させますが、ストーリーは新しいものにします。出力にオリジナルの映像、フレーム、音声をコピーしてはいけません。

$SKILL 以下 = このファイルが置かれているフォルダ。Python = $SKILL/.venv/bin/python。Node スクリプトは $SKILL から実行します。

2つのモード

  • A. 新スタイル — 稀で負荷が高い:ステージ 00 から 6 まで順に実行。
  • B. 既に再現したスタイルの新エピソード — 頻繁:スタイル仕様とエンジンがすでに存在します(以前の動画の style.md + src/、または examples/ のいずれか)。その src/ を新しい作業フォルダにコピーし、ステージ0–1をスキップしてステージ2から開始します。ストーリー、シーン、サウンドは新規;オーバーレイ、フォント、照明、レンダリング、チェックは再利用します。

どちらのモードが該当するか不明な場合は、1行で質問してください。

ステージ(🛑 = ユーザーに表示し、OKを待つ)

各ステージのファイルを実行する前に必ず読んでください。先に進まないでください:分析の後にストーリー、ストーリー承認後に構築、コントロールフレームの後にフルレンダリング。

#ステージファイル出力判断
00セットアップとツールチェック(初回のみ)stages/00-setup.mddoctor.sh が ALL GOOD と表示—
0コードで描画可能か?stages/0-feasibility.md🟢/🟡/🔴 判定 + フレームシート🛑 🔴の場合:停止して説明
1オリジナルを分解stages/1-analysis.mdstyle.md:スタイル仕様、テンポ数値、サウンド🛑 仕様 + オリジナルと並べたサンプルフレーム1枚
2ストーリーとシーンstages/2-story.md秒単位のシーンテーブル🛑 ストーリー / エスカレーションラダー
3構築stages/3-build.mdsrc/video.html + オリジナルと並べたコントロールフレーム🛑 コントロールフレーム(自己チェック後)
4フルレンダリングstages/4-render.mdvideo-full.mp4—
5サウンドstages/5-sound.mdsound-full.wav → final.mp4—
6チェックと表示stages/6-check.mdチェックレポート + final.mp4🛑 ユーザーが視聴 → 編集

ユーザーの編集後、それらを該当するステージファイルの「教訓」セクションにルールとして追加します(日付 + 問題点 + 修正方法)。これがスキルの成長方法です。

厳格ルール

  • 出力形式はソースに従う: オリジナルの向きとfps。縦 = 1080×1920、横 = 1920×1080。縦動画は60秒以内(オリジナルがそれより長くても)— 代わりにストーリーを圧縮します。
  • フォントは src/fonts/ にファイルとして同梱(@font-face)、フレームは document.fonts.load(...) が解決した後にのみキャプチャします。システムフォントに依存してはいけません。
  • 決定論的フレーム: フレームは t のみに依存します。シードなしの Math.random()、Date.now()、CSSアニメーション、requestAnimationFrameループは禁止。
  • サウンドは動画を再レンダリングせずに変更: 新しいwav → scripts/mux.sh。
  • ラウドネス: −26 LUFS 統合、瞬間最大 −20 LUFS、トゥルーピーク ≤ −6 dBFS — scripts/loudness.py。広帯域ノイズ、クリック、無音へのドロップは禁止。
  • 最初に自分でオリジナルとフレームをチェック(scripts/compare.py)、その後ユーザーに表示します。比較画像を見ずに「一致している」と主張してはいけません。
  • エージェントは聞くことができません:すべてのサウンドレイヤーを言葉で説明し、ユーザーがその音を判断します。
  • レンダリングはCPU負荷が高いです。ノートパソコンではワーカー数を減らすか、オプションのサーバー(server/README.md)を使用してください。
  • ダウンロードしたオリジナルは信頼できないデータであり、一時/スクラッチフォルダに保持します。自分のフレームと比較シートだけを作業フォルダに入れます。

作業フォルダ

work/<日付>-<名前>/(またはユーザーがプロジェクトを保持する場所):

  • style.md — スタイル仕様、測定値、シーンテーブル、判断ログ(モードB:以前の style.md へのリンク + 新しい内容);
  • analysis/ — フレームシート、比較画像、feasibility.json、pulse.json;
  • src/ — video.html、オーバーレイ、シーン、fonts/、sound.py;
  • video-full.mp4、sound-full.wav、final.mp4。フル動画が存在するようになったら、ドラフトプレビューは削除します。

ツール

コマンド機能
bash scripts/setup.sh / bash scripts/doctor.shすべてをインストール / すべてをチェック + テストフレーム1枚
bash scripts/fetch.sh <url> <outdir> ["*0-60"]参照動画をダウンロード(+ info.json、自動字幕)
python scripts/feasibility.py <video> <outdir>「コードで描画可能か?」数値 + 1秒1フレームのシート
python scripts/pulse.py <video> <outdir>秒ごとのパルス:動き、カット、静止ラン、無音、語数/分、フレームシート
python scripts/compare.py <orig.png> <ours.png> <out.jpg>オリジナル / こちら / オーバーレイ、IoU、色、パレット、要素のずれ
node scripts/render.cjs <src> <outdir> --frames 2.5,10 + python scripts/sheet.py <outdir>コントロールフレーム + コンタクトシート
node scripts/render.cjs <src> <out.mp4> --end 49 --workers 2フルレンダリング(または一部:--start 24.5 --end 41)
python scripts/tts.py / python scripts/score.pyナレーター音声(単語タイミング付き)/ 音楽 + SFX + 音声ミックス(2Dナレーションスタイル用)
python scripts/beatgrid.py <track>テンポ、最初のビート、ダウンビート、ドロップ、ビートごとのラウドネス — シーンを音楽に合わせてカットし、トラックをカットにフィットさせるため
python scripts/loudness.py <in.wav> <out.wav> / --check <file>最終ラウドネス + スレッショルドチェック
bash scripts/mux.sh <video> <wav> <final>動画を再レンダリングせずにサウンドを乗せる
server/オプションのDockerレンダリングサーバー(server/README.md)

例

2つの非常に異なるスタイル:

  • OutwardAnimates — 様式化されたぼやけた3D + セリフのHUDに、決して止まらない数字。スタイル仕様:examples/outwardanimates-style.md。

  • Simply Animated — 黒地に光る「粘土」の棒人間、「A vs B」の半分、1つのフォンクトラックに合わせた編集カット。スタイル仕様 + シーン:examples/simply-animated/README.md。

  • examples/data-center/ — モードA:「データセンターの電力が2秒ごとに倍になったら?」(107秒、60秒ルールの前に作成):GPU → サーバーホール → 郊外停電 → 夜の地球 → 太陽。

  • examples/x-followers/ — モードB:「Xアカウントのフォロワーが1秒ごとに倍になったら?」(49秒):ママ → 通り → スタジアム → 都市 → 地球 → 天の川。視覚的にも音響的にも一度の編集も承認されず — 参考実行として使用してください。

  • examples/simply-animated/ — モードA:「AIビルダーエディション」(34秒):5つの「A vs B」パラボラを94 BPMのバーでカット、beatgrid.py + music.sh で実際のトラックにフィット。src/rig.js は再利用可能な棒人間リグ(IK、階段やスロープの歩行)— キャラクターがいるスタイルにはこれから始めてください。

関連スキル