brand-cut

brand-cut は何をしますか？

会社 / URL / リポジトリ -> 調査 -> ブランドキット -> プロダクトモーメントの脚本 -> ストーリーボード -> (ナレーション) -> アーキタイプ構築 -> (ミックス) -> QA -> レンダーマトリックス -> 納品

最初のフィルムを制作する前に LEARNINGS.md を読んでください。これは、フィルムがリジェクトされたりレンダリングに失敗したすべての理由をリストにしたものです。

0. ルール（拘束力あり）

• すべてのシーンは具体的なプロダクトモーメントであり、実際のUIを使用します。AIが登場する場合、実際のAI回答が画面に表示されます。抽象的なスローガンは禁止です。
• マーケティングよりも真実を重視します。コードベース、ドキュメント、実際のアプリ画面から構築します。Webサイトはトーンを知るためだけに使用します。画面上のすべての主張はソースに遡って確認できます（qa/claims.py）。
• 正確なロゴを使用し、色はソースから取得し、近似値は使用しません。
• AIっぽく見せない。すべて大文字 / text-transform: uppercase、絵文字、斜体のディスプレイセリフ、紫のAIグラデーション、キラキラ、オーブ、パーティクル、レンズフレア、ネオンアウトライン、偽のUI、手続き型の電話や家は禁止です。
• フラッシュセーフ。約8秒間に最大1回の全画面フラッシュ、1秒間に3回以上のフラッシュは禁止です。最終ファイルで qa/flashcheck.py が通過する必要があります。
• サウンド。画面上のすべてのUIアクションにデザインされた効果音。音楽は効果音とナレーションの下にダッキングします。ビートポンピングは禁止です。
• フォーマットは、セーフゾーン内のネイティブレイアウトであり、クロップではありません。60 fps。1080pは4Kでレンダリングしてからダウンスケールします。
• ユーザーの明示的な許可なしに、投稿、アップロード、公開、またはクレジットの購入を決して行わないでください。

1. レイアウト

SKILL.md, LEARNINGS.md  このファイル、トラップ
research/RESEARCH.md    ステージ0: 会社名 / URL / コードベース -> ブランドキット + 真実 + 実際のUIキャプチャ
brand.schema.json       ブランドキットスキーマ
brands/demo/            「Tidewell」という架空のブランド。新しいブランド用にコピーします。
archetypes/             CONTRACT.md + 30のシーンテンプレート（scene.html + README.md）
formats/                presets.json（サイズ、セーフインセット、レンダープリセット、ラウドネス）+ safe-*.png オーバーレイ
shared/                 hf.js（ランタイム: フォーマット、ピック、シード付き乱数）、phone.js（フォトリアルな電話）、type.js、uikit/（チャット、通知、カレンダー、レシートコンポーネント）
audio/                  vo.py（ElevenLabs + 予算ガード）、mix.py、music.md、sfx/（INDEX.md、INDEX.json、ファイル）
qa/                     flashcheck.py、framecheck.py、safezone.py、claims.py、vo_diff.py、contact.py、run-all.sh
scripts/                new-film.sh、add-scene.py、set-format.py、set-brand.py、brand-css.py、render-matrix.sh、save-ref.sh、index-refs.py、shazam.py、xcorr.py、beats.py、peaks.py
templates/              SPEC.md（フィルム契約）、index.html、project/、structures/
reference/              PATTERNS.md（アーキタイプライブラリ + 法則）、RESEARCH-digest.md、studies/（18のリール分析 + INDEX.md）
examples/               完成したサンプルフィルムとそのブランドキット、SPEC、スチル

要件: Node 18+ (npx hyperframes)、Python 3.10+、ffmpeg、uv (uvx はQAおよびオーディオスクリプトを一時的な環境で実行します)。オプション: ナレーション用の ELEVENLABS_API_KEY（これがない場合、audio/vo.py はオープンソースのKokoro TTSにフォールバックします。詳細は audio/VOICE.md を参照）、音楽フォルダ ($MOTION_LIBRARY/music)。

シェルを持つ任意のエージェントで動作します。このファイルが「サブエージェント」と言及している場合、エージェントにサブエージェント機能がない場合はステップを順次実行してください。「Webフェッチ」は、エージェントが持つ任意のフェッチ/ブラウズツール、または curl を意味します。

2. パイプライン

0. 調査 (research/RESEARCH.md)。リポジトリがある場合はコードベースモード（最も正確）、そうでない場合はWebサイトモード、両方できる場合は両方を使用します。出力: brands/<id>/brand.json、ソース付きの truths、brands/<id>/assets/ui/ 内の実際のUIキャプチャ、および5～8個のプロダクトモーメント。
1. ブリーフィング。対象者、フォーマット、長さ、ナレーション/音楽のみ/無音、視聴者が必ず理解すべきこと。
2. ブランドキット。brands/demo/ をコピーし、パレット（9段階のglowRamp）、ファイル付きフォント、ロゴ、UIキャプチャ、ストーリー、真実、音声を入力します。brand.schema.json に対して検証します。
3. スキャフォールド。scripts/new-film.sh <brand> <dir> <format> [format...] [--palette id] -> ブランドブロック（フォント、CSS変数、window.BRAND）、film.json、SPEC.md、オーディオスタブを含む index.html。いつでも再テーマ化: scripts/set-brand.py <dir> <brand> [palette]。フォーマット切り替え: scripts/set-format.py <dir> <fmt>。
4. 脚本。SPEC.md のセクション2: プロダクトモーメントごとに1行（実際のUI、画面上のテキスト、ナレーションライン、証明、ハードサイズターゲット）。読み上げ制限: 毎秒3ワード以下、1行42文字以下、最大2行。
5. まずナレーション（ナレーションフィルムの場合）。audio/vo/script.txt、ナレーション行ごとに1行、次に python3 audio/vo.py say <dir> --voice <id> --take <name>。タイムスタンプ付きで1回リクエストし、アラインメントで分割、フィラーをカットし、ポーズを制限します。lines.json が長さを提供します。qa/vo_diff.py <dir> <take> で確認します。予算ガードは、ジョブ上限を超える呼び出しを拒否します。
6. ストーリーボード。ナレーションとバーグリッド（scripts/beats.py <wav> <dur>）に基づいて作成します。SPEC.md セクション3: アーキタイプ、イン/アウト、トランジション（最初は非フラッシュ、PATTERNS セクション4）、効果音イベント。
7. 音楽。ビートに合わせたウィンドウにカットされた3つのオプション（リビールでブルーム、ロゴでリゾルブ）。選択したものをレンダリングします。audio/music.md を参照してください。
8. アーキタイプから構築。python3 scripts/add-scene.py <dir> <archetype> <scene-id> <start> <dur> [--vars JSON]、その後カスタマイズします。サブエージェントを使用する場合: シーングループごとに1つのビルダーが、自分のファイルのみを所有し、次に独立した批評家がスナップショットを確認し、その後修正します。
9. ミックス。audio/events.json（音楽、ナレーション行、audio/sfx/INDEX.md からの時間指定付き効果音、ダッキング）-> python3 audio/mix.py <dir> -> audio/mix.wav（-14 LUFS / -1 dBTP）。
10. QA。npx hyperframes check でエラー0、ドラフトレンダリング、次に qa/run-all.sh <dir> <video> <fmt>（framecheck、flashcheck、safezone、claims、loudness、fps）。qa/contact.py <video> 10 <prefix> のシートをセクション0と照らし合わせてレビューします。
11. レンダーマトリックス。scripts/render-matrix.sh <dir> [--4k 16x9]: フォーマットごとに、4Kキャプチャを1080pにダウンスケール、オーディオをミックス、QAゲートを実行します。最初に空きディスク容量を確認します。
12. 納品。動画、index.html ギャラリー、および短い REPORT.md（内容、使用したクレジット、音楽と音声の代替案、不足した点）を含むフォルダ。ユーザーが開けるようにします。

3. フォーマット (formats/presets.json)

id	キャンバス	セーフインセット (上/下/左/右)	用途
16x9	1920x1080	108/108/192/192	YouTube、LinkedIn、X、サイト
9x16	1080x1920	270/680/70/140	Reels、TikTok、Shorts
1x1	1080x1080	86/86/135/135	IG/LinkedIn フィード
4x5	1080x1350	108/108/86/86	IG/FB フィード
banner	1920x600	60/60/96/96	README / サイトヘッダーストリップ（無音ループ）

シーンは window.BRAND.format を読み取り、フォーマットごとにレイアウトを分岐します（[data-fmt="9x16"]）。短辺は常に1080ピクセルなので、ピクセルサイズは引き継がれます。縦長フォーマットではヒーロー要素をスケールアップします。

4. アーキタイプ（詳細は reference/PATTERNS.md）

glow-field (A01, 全画面WebGLライト) | glass-slab (A02, リアルなストリーム回答を表示するAIパネル) | glass-tile-click (A03) | word-blur-in (A04) | tracking-collapse (A05) | chip-marquee (A06) | status-stack (A07, リファレンス実装) | wordmark-lockup (A08) | phone-tunnel (A09) | drum-wheel (A10) | card-carousel (A11) | network-lines (A12) | composer-send (A13) | card-burst (A14) | checklist-fix (A15) | orbit-chips (A16) | list-swap-toggle (A17) | object-launch (A18) | brutal-type (A19) | icon-ring (A20) | calendar-pick (A21) | product-hero (A22) | chat-thread (A23) | container-morph (A24) | notification-pile (A25) | docusign-sign (A26) | stripe-paid (A27) | logo-sting (A28) | branch-tree (A29) | counter-pill (A30) | logo-wheel (A31, ループする「連携サービス」カルーセル)。

フィルム構造 S1-S8（SaaS解説、13秒縦型、プレミアムポリッシュチェックリスト、ダークシネマティック、Figmaショーケース、グラデーションオープナー、手作りスティング、プルーフプレート）は PATTERNS.md のセクション5にあります。契約: archetypes/CONTRACT.md（ブランド非依存のCSS変数、window.BRAND、インスタンスごとの変数、フォーマットネイティブ、フラッシュセーフ、README内の効果音キュー）。

5. 新しいリファレンスリールの研究

• scripts/save-ref.sh <url> は yt-dlp でリールをダウンロードし、2 fpsの概要と楽曲IDを作成します。scripts/index-refs.py がそれをインデックス化します。
• 2秒ごとに10 fpsのストリップと、キーモーメントでのネイティブfps実行を構築します。フレームごとに1つの要素を追跡してイージングを特定します。scripts/beats.py でビートグリッドを作成します。パレットの16進数。フラッシュプロファイルのためのフレームごとの輝度。
• reference/studies/<id>.md を記述します: ショットリスト、要素ごとの構成、カメラ、イージング数値、トランジション、タイポグラフィ、パレット、奥行き、サウンド、コピー構造、AIっぽくない理由、AIっぽくする要因、アーキタイプ。そこにある18の研究が実践例です。

6. 実績のあるルック

• Glow (A01): 1つのWebGLシェーダー。スカラー場 -> 9段階ランプ、ノイズワープ、ディザ。GSAPプロキシトゥイーンによって駆動されるモノトーン・エルミートキーフレームテーブルからのユニフォーム。
• Glass: backdrop-filter: blur(22px) saturate(1.5) brightness(1.15)、mask-composite によるグラデーションベベル、内側のハイライトとシャドウ、コンタクトシャドウ、モーション時の1つのシーン。
• タイポグラフィ: 500のグロテスク、単語ごとのブラーイン 14 -> 0 px、スケール 1.06 -> 1、power3.out、行の再センタリング、連続的な引き戻し。
• 実際のUI: 製品のコンポーネントを、そのソースまたはキャプチャからHTML/CSSで再現します（shared/uikit/ が出発点）。HF.phone は画面をフォトリアルな電話にマッピングします。