書き出し・プレビュー

3 つの書き出し経路と、軽量化プレビューの仕組み。

Smart Preview (Proxy)

重いプロジェクトでプレビューを滑らかに再生するためのプロキシ機能。トップツールバーの Smart Preview ボタンで ON / OFF。

• ON: 高解像度 / 高 fps 素材を低解像度 (半分や 1/4) にダウンスケールして再生。編集の応答性が劇的に向上。
• OFF: 常にフル解像度で描画 (最終的に近い見え方)。

プレビュー専用で、書き出しには影響しません。

モーションブラー

トップツールバーの Toggle Motion Blur で、動きのあるオブジェクトに時間的なブラーをかけます。実写的で滑らかな見た目を実現。

MP4 書き出し

トップツールバーの Export MP4 をクリックすると、ブラウザ内で完結して MP4 ファイルを生成・ダウンロードします。mediabunny を使用 (静的 import、`npm` で管理されているためオフラインでも動作)。

処理の流れ

1. コンテナ判定: getFirstEncodableVideoCodec でブラウザが対応するエンコード可能 codec を取得 (H.264 / VP9 / AV1 の優先順)。
2. フレームキャプチャ: コンポジションの全フレーム (時刻 0 〜 duration、fps 間隔) を Canvas 経由で VideoFrame として取得。
3. 音声ミックス: Video / Audio オブジェクトの音声トラックを Web Audio API でミックスし、MP4 コンテナに統合。
4. エンコード: mediabunny の Output API でエンコード + mux。
5. ダウンロード: ブラウザの Blob URL 経由で自動ダウンロード。

進捗と中断

書き出し中は進捗バーが表示され、フレーム番号 / 推定残り時間が更新されます。Esc または「キャンセル」ボタンで中断可能。

出力解像度

コンポジションの width × height がそのまま出力解像度になります。書き出し前に コンポジション設定 を確認してください。

Render Queue (バッチ書き出し)

複数のコンポジション / 複数の設定を一括で書き出したいときは Render Queue ボタン。ジョブをキューに追加して順次処理:

1. Render Queue をクリック → ジョブ一覧モーダル。
2. Add Job で対象コンポジションと書き出しプリセットを選択。
3. 複数のジョブをまとめて追加可能。
4. Start で順次処理。完了したものは履歴に残り、再書き出しも可。

書き出しプリセット

Presets タブから以下のプリセットを 1 クリックで適用できます:

• Vibrant Bloom — 強めのブルーム + 彩度アップ
• Cinematic Bloom — 弱めのブルーム + ティール/オレンジのカラーバランス
• Heavy Blur — ガウシアンブラー大
• Soft Focus — 微かなブラー + 軽い bloom

プロジェクト切替

Project Switcher で複数のプロジェクトを切り替えて編集可能。各プロジェクトは独立した IndexedDB エントリを持ちます。