作業の進め方
Three.js Post-Processingは、レンダリング済みのシーンを変換するEffectComposerとパスを扱います。例として、グロー、アンチエイリアス、アンビエントオクルージョン、被写界深度、アウトライン、カラーグレーディング、カスタムのスクリーンスペースシェーダーがあります。
マテリアル作業との違いは適用範囲です。ポストプロセッシングはレンダリング済みの画像に作用し、構図全体に影響し得ます。パスの順序、ターゲット解像度、リサイズ処理、エフェクトなしのシーンとの比較は、実装計画に含める必要があります。サンプルのコンストラクターとレンダラーの対応状況は、使用前にインストール済みのThree.jsリリースで確認してください。
期待される成果物
- 順序付けされたコンポーザーのパスチェーン
- 視覚的な目的に結び付けたエフェクト設定
- リサイズ処理とエフェクトコストの比較
ブリーフからレビューまで
- 01意図を決める
何を発光させるか、何にピントを合わせたままにするか、何を強調するかを指定します。
- 02パスを組み立てる
シーンのレンダリングから始め、意図した表現に必要なパスだけを追加します。
- 03比較とプロファイリング
エフェクトなしの表示、リサイズ後の出力、目標解像度でのレンダリングコストを確認します。