Remotion 動画ビルダー

Remotion 動画ビルダー は何をしますか？

あなたの Remotion の知識は古くなっている可能性があります。正確な API の動作が必要な場合は、公式の remotion-documentation MCP サーバー、または remotion.dev のドキュメントを参照してください。

まずはここから

• プロジェクトがまだ存在しない場合は、npx create-video@latest でスキャフォールディングし、ブランクテンプレートを選択してください。
• すべての remotion および @remotion/* パッケージは、完全に同じバージョンに固定し、キャレット範囲（^）は避けてください。
• 標準的なエントリ形状：
  • src/index.ts が registerRoot() を呼び出す
  • src/Root.tsx が <Composition> または <Still> ですべての動画を登録する

構築順序

1. 最初に入力コントラクト（契約）をモデル化する：
   • トップレベルのプロップススキーマ
   • タイムラインまたはイベントデータ
   • レンダリングプロファイル
2. zod を使用して共有プロップスを定義し、各 <Composition> にスキーマを渡します。
3. calculateMetadata を使用して、durationInFrames、width、height、変換されたプロップス、および defaultOutName を導出します。
4. シーン構造を <Series>（ナラティブ順）と <Sequence>（オーバーレイ、エントランス、フッテージウィンドウ、コールアウト用）で構築します。
5. Remotion v4.x プロジェクトでは、表示前にアセットを読み込む必要がある <Sequence> 要素に、明示的に premountFor を設定します。
6. アニメーションを磨く前に、サンプルデータとレンダリングスクリプトを追加します。

デフォルトとルール

• 特に指定がない限り、デフォルトは fps={30} およびランドスケープ（横長）は 1920x1080 とします。
• レイヤリングには AbsoluteFill を使用します。
• public/ からのファイルには staticFile() を使用します。
• フレームベースのロジックには useCurrentFrame() と useVideoConfig() を使用します。
• 控えめなモーションを推奨：
  • 高いダンピングを伴う spring()
  • クランプ（clamp）を含む interpolate()
• Math.random() は使用しないでください。代わりに remotion の random(seed) を使用します。
• テキストアニメーションはシンプルで読みやすく保ちます。
• 要件が本当に分岐を必要としない限り、ランドスケープ（横長）とポートレート（縦長）の出力は同じビジネスロジックを維持します。

パラメータ化動画のチェックリスト

• 1つの共有トップレベル z.object() スキーマ
• コンポーネントのプロップス形状に一致する defaultProps
• 入力に応じて動的な duration や dimensions を返す calculateMetadata
• ローカルプレビュー用のサンプル JSON または TypeScript データ
• すべてのターゲット出力に対するレンダリングスクリプト

フッテージ戦略

フッテージがオプションの場合、少なくとも以下のモードをサポートします：

• none
• placeholder
• real

実際のフッテージが存在しない場合でも、タイムラインとオーバーレイはレンダリングされる必要があります。

Millrace 起動動画

リクエストが Millrace または起動動画パイプラインに関するものである場合、実装前に references/millrace-launch-video.md を読んでください。

参考文献

• references/remotion-core.md
• references/millrace-launch-video.md