Launch Video（ローンチ動画）

プレミアムでハイエナジーな15〜60秒のローンチフィルムを作成し、スクロールを止めてコンバージョンを促します。フック→ティーズ→リビール→機能モンタージュ→エンドカードCTAという定型的なアークを、音楽に合わせて構築し、すべてのプラットフォームのアスペクト比で書き出します。

使用するタイミング

プロダクトドロップ、機能発表、トレーラー、ハイプ動画（15〜60秒）
ランディングページ用の「シズル」ヒーロービデオ
ブランドの瞬間が音楽のドロップと同期するビートシンクロナイズド・リビール

アーク（構成）

ビート	役割	30秒における割合（例）
フック（0〜3秒）	スクロールを止める印象的なフレーム/モーション	0〜3秒
ティーズ	製品をほのめかし、好奇心を高める。ビートに同期	3〜9秒
リビール	音楽のドロップに合わせて製品/ロゴが登場	9〜13秒
機能モンタージュ	高速でキネティック、1ショットにつき1つのメリット	13〜25秒
エンドカード	ロゴ＋タグライン＋CTA、クリーンに静止	25〜30秒

15秒の場合はよりタイトに、60秒の場合はモンタージュを長く（フックは長くしない）して、同じ比率で拡大縮小します。

絶対のルール（2つ）

サウンドデザインが映像をリードする。 まずトラックをロックし、ビートとドロップをマークしてから、それらのマークに合わせてビジュアルをカットします。完成したカットに後からスコアを付けてはいけません。リビールはドロップの「近く」ではなく、「ドロップ上」に配置します。
量より質。 完璧な数ショットは、多くの中程度のショットに勝ります。プレミアムでないショットは容赦なくカットします。

ドロップに合わせたビートシンク・リビール

オーディオ内のドロップの正確なタイムコードを見つけ、そのフレームでブランドマークが完全に表示されるようにリビールのタイミングを合わせます。インパクトを与えるためにマイクロなオーバーシュートを加えます。

import gsap from "gsap";
const DROP = 9.0; // 秒単位。トラックから計測
const tl = gsap.timeline({ paused: true });
// ティーズはドロップまで緊張を高める
tl.to(".tease", { opacity: 1, scale: 1.05, duration: DROP, ease: "power1.in" })
// リビールはドロップフレームでSNAPする
  .set(".logo", { opacity: 1 }, DROP)
  .fromTo(".logo", { scale: 1.18 }, { scale: 1.0, duration: .18, ease: "power3.out" }, DROP)
  .fromTo(".flash", { opacity: .9 }, { opacity: 0, duration: .25 }, DROP); // ホワイトフラッシュ
audio.addEventListener("play", () => tl.play());

固定グリッドではなく、トランジェント（過渡音）でカットします。最もハードなカットはキック/スネアのヒットに合わせます。ドロップに向けて速度をランプさせ（タイムリマップ）、ドロップ後はハードカットで抜けます。

キネティック機能モンタージュ

1ショットにつき1つのメリット、それぞれ約0.6〜1.0秒、ビートに合わせてハードカット。各ショット = 太字のキーワード + 1つのサポートビジュアル。

.feature { opacity:0; }
.feature.in .kw   { animation: pop .35s cubic-bezier(.22,1,.36,1) forwards; }
.feature.in .word { display:inline-block; }
@keyframes pop { from { opacity:0; transform:translateY(24px) } to { opacity:1; transform:none } }

// トラックから計測したビートマークでショットを駆動
const beats = [13.0, 13.8, 14.6, 15.4, 16.2]; // 秒単位
beats.forEach((t, i) => scheduleAt(t, () => showFeature(i)));

モンタージュ全体で1つのモーション言語を維持します（同じイージングカーブ、同じ出口）。速度が混沌ではなく、自信として伝わるようにします。

エンドカード

ロゴ＋タグライン＋CTAを2秒以上、静止させてクリーンに表示します。CTAと競合する動きは避け、ブランドを落ち着かせます。最も強い残りのビートでブランドの瞬間を決め、その後に鮮明なボタン/URLを配置します。

マルチアスペクト書き出し

中心安全圏を考慮してコンポーズすることで、1つのマスターからすべてのアスペクトにクリーンにトリミングできます。

アスペクト	使用例	解像度	安全圏
16:9	YouTube、ランディングヒーロー、X	1920×1080	主要コンテンツを中央90%以内に
9:16	Reels、TikTok、Shorts、Stories	1080×1920	テキストを中央80%の高さ以内に。上部12%、下部18%（UI）は避ける
1:1	フィード投稿	1080×1080	16:9フレームの中央正方形

ヒーロー/ロゴ/CTAは1:1の中央正方形内にデザインして、すべてのクロップに耐えられるようにします。16:9マスターをレンダリングした後、同じプロジェクトから9:16と1:1をリフレーム（単にレターボックス化するのではなく）します。

出力チェックリスト

トラックを最初にロック。リビールがドロップに正確に合っていること。
フックが最初の3秒間で視聴者を引き込めていること。
モンタージュ：1ショットにつき1メリット、ビートに合わせたハードカット、一貫したモーション言語。
エンドカードが2秒以上保持され、1つの明確なCTAがあること。
16:9 + 9:16 + 1:1の書き出し。主要コンテンツが中央安全圏内にあること。
プレミアムショットのみ。中途半端なものはカットされること。

納品と検証（レンダリングスチル → MP4）

パッケージ化されたヘルパー（scripts/内）: scripts/contact-sheet.sh sheet.png f-hook.png f-mid.png f-end.png でスチルをタイル表示し、scripts/probe-mp4.sh out.mp4 [WxH] [fps] でエンコードを検証します。詳細は scripts/README.md を参照。

ローンチフィルムがRemotionで構築/レンダリングされる場合は、ヘビーティアとして扱います：<Composition>（+ zod schema + defaultProps）を登録し、すべての値を useCurrentFrame() で駆動します。GSAPタイムライン、audioイベントコールバック、Date.now()、Math.random() はレンダリング時に使用しません（ビートとドロップのタイムコードはpropsに焼き込みます）。納品物は、アスペクトごとにレンダリングされた out/*.mp4（とプロジェクトファイル）です。

検証ループ — スチルをレンダリング → 検査 → エンコード。 defaultProps だけでなく、出荷用の props（実際の見出し/タグライン/CTA）を使用してアークのサンプルを検査します。

# フック→リビール→エンドカードにわたるフレーム精度のスチル
npx remotion still Launch out/f-hook.png   --frame=24  --props=props/launch.json   # フックは最初の3秒を獲得
npx remotion still Launch out/f-reveal.png --frame=270 --props=props/launch.json   # ロゴがドロップフレームでSNAP
npx remotion still Launch out/f-end.png    --frame=899 --props=props/launch.json   # エンドカード：ロゴ+タグライン+CTA、クリーンに静止
# 各項目を検査：忠実度（製品/ロゴ、タグライン、CTAテキストが正確、ブランドカラーが正しい、リビールがドロップフレームにあるか）
#   およびアーティファクト（テキストオーバーフロー、オフキャンバス、9:16の下3分の1にCTAがあるか、フォント欠落、フラッシュフレームが固まっているか）

マルチアスペクト — すべてのアスペクトをエンコードする前に、各アスペクトでマスターを検証します。 リフレームのバグ（ヒーローが安全圏から押し出される）はすべてのアスペクトで繰り返されます。一度で発見します。

for ar in 16x9 9x16 1x1; do                                 # アスペクトごとにリビールとエンドカードを確認
  npx remotion still Launch "out/reveal-${ar}.png" --frame=270 \
    --props=props/launch.json --props-merge="{\"aspect\":\"${ar}\"}"
done
# すべてのアスペクトでスチルがクリーンか？ → 次にそれぞれをエンコード：
for ar in 16x9 9x16 1x1; do
  npx remotion render Launch "out/launch-${ar}.mp4" --props=props/launch.json --props-merge="{\"aspect\":\"${ar}\"}"
done
npx remotion render Launch out/demo.gif --codec=gif --props=props/launch.json   # README用デモ

終了する前に確認すること：

npx remotion still がフック/リビール/エンドカードでクリーンにレンダリングされること — エラーやフォント/アセットの欠落がないこと。
ロゴ/タグライン/CTAテキストが正確で、ブランドカラーが正しいこと。リビールがドロップフレームに合っていること。主要コンテンツが中央安全圏内にあり、9:16の下3分の1にかかっていないこと。
フレーム駆動のみ — GSAP/オーディオコールバックのタイミング、Date.now()、Math.random() がないこと（ビート/ドロップはpropsに焼き込まれていること）。
出荷用propsが正しくレンダリングされること（defaultProps だけでなく）。エンドカードが2秒以上保持され、1つのCTAがあること。
マスターを16:9 + 9:16 + 1:1でエンコード前に検証済みであること。MP4が再生できること。（オプション）README用のGIF。

参考ファイル

references/launch-structure.md — 30秒フィルム（15〜60秒に拡張可能）のショットバイショットの完全なテンプレート。ビートシンクされたリビールのタイミング、キネティックモンタージュのショットレシピ、サウンドデザイン優先のワークフロー、16:9/9:16/1:1の詳細なマルチアスペクト安全圏マップを含む。

Launch Video（ローンチ動画）スキル