yuv-video-director は何をしますか?
YUV.AIビデオの指揮者です。あなた(エージェント)は各ビートに必要なものを判断し、適切なエンジンにルーティングし、すべてを1つのHyperFramesコンポジションにまとめ、YUV.AI Neon Phoenixブランドでラップし、自己検証してMP4にレンダリングします。このスキルはルーター兼動作するリファレンス実装であり、参照ファイルは該当エンジンが使用される場合にのみ読み込んでください。
デザインの信頼できる情報源:
yuv-design-systemスキル(Neonモード — ピンク#FF1464、シアン#00E5FF、リッチブラック/ホワイト、Anton+Inter+JetBrains Mono、ニューラルネットフェニックスモチーフ)です。そのビデオ版は**frame.md**です — references/frame-md.mdを参照してください。バンドルされているテンプレート: assets/FRAME.md。プロジェクトルートに配置すると、HyperFramesがそれを読み取ります。
唯一のルール(すべてを決定する)
HyperFramesは、各フレームをヘッドレスChromeでシーク → FFmpegすることでレンダリングします(frameIndex = floor(t·fps)、同じ入力 → 同じ出力)。したがって、すべてのビジュアルは次の2種類のいずれかです:
| パターン | 実行… | エンジン | ルール |
|---|---|---|---|
| ライブシーク可能アダプター | レンダリング内部で、各フレームの時間tに駆動される | GSAP、Lottie(window.__hfLottie)、Three.js、GSAPプロキシonUpdateで駆動されるキャンバス | クロック駆動である必要あり — Date.now()、Math.random()(mulberry32でシード)、setTimeout、.play()不可 |
| 事前レンダリングアセット | オフラインで実行、ファイルを出力、クリップとしてインポート | ManimCE(Python→MP4/アルファ)、TTSオーディオ、背景除去 | 先にレンダリングし、その後<video>/アセットクリップとして配置 |
シーク可能ならアダプター。シーク不可能なら事前レンダリング。 Manimは常に事前レンダリングクリップです — 独自のレンダラーを持ちPythonで実行されるため、ライブアダプターにはなれません。
各ビートをエンジンにルーティングする
「XをTEASER/プロモとして説明(FOMO、クリフハンガー、高速)」 → references/teaser-explainer.md(公式)
「概念/数学/ニューラルネットワーク/アルゴリズム/トレーニングを説明」 → ManimCE(事前レンダリングクリップ — ティーザー用にBURSTにカット)
「ブランドモーション:ロゴスティング・統計表示・アイコンポップ・パルス」 → Lottie(ライブ、lottie-web)
「キネティックキャプション・タイトル・リビール・トランジション・データコールアウト」 → GSAP(ライブ)← デフォルト
「3D / 空間的」 → Three.js(ライブ)(Babylonは不使用)
音声 → キャプション → 文字起こし + 承認ウェブアプリ(video-editスキル参照)
ナレーションなし → TTS(Kokoro: npx hyperframes tts)
ブランドカラー/フォント/モチーフ → frame.md(先頭で読み取り)
GSAPはテキスト/モーションの信頼できるデフォルトです。デザインされたブランドグラフィックスにはLottie、アイデアの説明にはManimを使用してください。
ワークフロー
- ビートを計画する。 ナラティブアーク + 各ビートが必要とするエンジン。16:9および/または9:16を選択。
- ブランドを設定する。
FRAME.mdがプロジェクトルートにあることを確認(assets/FRAME.mdをコピー)。すべてのカラー/フォント/モチーフはそこから取得 — 決して発明しないこと。すべてのビデオに必須の3つのブランド要素(references/brand-kit.md + references/cinematic.md参照): リビールとエンドカードに実際のフェニックスロゴ(assets/logo-phoenix.png)、実際の注目Lottie(生成 — assets/lottie-burst-generator.py)、リンクエンドカード(ロゴ + 「LET'S FLY HIGH」+ 完全なリンクセット + CTA)。ティーザー/ソーシャルペーシングについてはreferences/editing.mdを、心理的/クリフハンガー/FOMOカットについてはreferences/cinematic.mdを参照。 - アセットビートを最初に事前レンダリングする(クリップとして存在させるため):
- Manim → references/manim.md + assets/manim-scene-template.py。
py -m manim render -qh --fps 30 scene.py SceneNameでレンダリングし、MP4をassets/にコピー。 - キャプション/TTS →
video-editスキル(文字起こし → 承認ウェブアプリ → 同期)とnpx hyperframes ttsを再利用。
- Manim → references/manim.md + assets/manim-scene-template.py。
- スキャフォールディングとコンポーズ。
npx hyperframes init <slug> --non-interactive。index.htmlを作成(hyperframesスキルが契約)。以下を使用:- シーク可能なニューラルネットフィールド背景 → assets/neural-net-field.js
- Lottieをブランド流に → references/lottie.md + assets/neural-pulse.json
- Manimレンダリングを
<video class="clip" muted playsinline>ボディクリップとして - シーンごとにGSAPエントランス、各境界にネオンフラッシュトランジション、最終シーンのみフェードアウト
- ティーザー/ソーシャルペーシング(高速ハードカット、キネティックワードスラム、フックモンタージュ、グリッチ/クロマチックスタブ) → references/editing.md — スライドショーではなくプロデューサーのようにカット
- 自己検証(ゲート)。 references/gates.md:
npx hyperframes lint(0エラー)→validate(0コンソールエラー、WCAG AA)→ レンダリング → タイムライン全体から5フレームをスポットチェック。修正 → 再実行。Lottieはスクリーンショットで検証必須(Skottieとlottie-webのトラップ)。 - レンダリング。
npx hyperframes render --fps 30 --output renders/<name>_FINAL.mp4。縦向きの場合は、1080×1920レイアウトでクローン(video-edit参照)。
前提条件(最初に確認し、優雅に低下)
references/prereqs.mdを参照。Node 22+、FFmpeg、Python 3.11+ with pip(Manim/キャプション)が必要。このマシンでは、実際のPythonは**py → C:\Python313**(素のpythonはHermesのvenvでpipなし — 使用しないこと)。ManimCEはpy -m pip install manimでインストール(Text()/MarkupTextを使用すればLaTeX不要、Tex/MathTexは避ける)。Manimが利用できない場合 → 数式ビートをスキップするかインストールを提案、ビデオ全体をハードフェイルしないこと。
このスキルがバンドルするもの(lint + レンダリングするリファレンス実装)
| ファイル | 説明 |
|---|---|
| assets/FRAME.md | YUV.AI Neon Phoenixビデオフレーム仕様(HeyGenのCoralパックからリブランド) |
| assets/neural-net-field.js | 決定論的でシーク可能なニューラルネットフェニックスキャンバス背景 |
| assets/neural-pulse.json | 手書きのBodymovin Lottie(lottie-webでレンダリング、Skottieだけでなく) |
| assets/gen_content_lotties.py | 6つのプロダクション品質のコンテンツLottieを生成するジェネレーター(WhatsApp折りたたみ、デコードビーム、アイ読み取り、ゴーストラインヒーロー、オーブ抽出、ブレインファイア) — 透明、永続的+連続、lottie-web検証済み |
| assets/{wa-collapse,decode-beam,eye-read,ghost-line,orb-extract,brain-fire}.json | 生成された6つのコンテンツLottie、すぐに使用可能 |
| assets/manim-scene-template.py | ManimCEシーンテンプレート、ネオンブランドスタイリング、Textのみ(LaTeXなし) |
| assets/what_is_nn.py | 「ニューラルネットワークとは」ManimCEシーン(ニューロン → ネットワーク → トレーニング、34.5秒) |
| assets/Anton-Regular.woff2 | ローカルAntonフォント(レンダラーが自動解決しないため、@font-faceで宣言) |
| references/composition-pattern.md | 完全なマルチエンジンindex.htmlパターン(フィールド + Lottie + Manimクリップ + GSAP + フラッシュ) |
| references/teaser-explainer.md | シネマティックティーザー説明動画の公式: コールドオープンスラム → manim BURST → 対決 → FOMOモンタージュ → クリフハンガー; コンテンツ同期透過Lottieビート; シークモジュロ修正; ティーザー音楽シンセ |
コンパニオンスキル
hyperframes(コンポジション契約 — 作成時は必ず呼び出す)、hyperframes-cli、lottie、video-edit(文字起こし + 承認ウェブアプリ)、yuv-design-system(ブランド)。このスキルがそれらをオーケストレーションします。