UE5レンダリングフロー総おさらい(2024) 基礎編！[CEDEC+KYUSHU 2024]
534.5K Views
January 31, 25
スライド概要
※本資料は2024年11月に開催されたCEDEC+KYUSHU2024にて講演したものに、大幅な加筆修正及び口頭説明部分を加えたものです
ありがたいことに、ゲームのみならず映像や建築など様々な分野でUnrealEngineをお使い頂いております。ただその一方、様々な設定や手法が混在しておりレンダリングフローがより複雑化しているのも事実です。本セッションではUE5のレンダリングフローを俯瞰で眺めながら、重要な点やTipsをアーティストやテクニカルアーティスト向けにご説明させて頂きます。本講演が、クオリティが高くまた安定したグラフィクスを実現するための手助けとなれば幸いです。
Unreal Engineを開発・提供しているエピック ゲームズ ジャパンによる公式アカウントです。 勉強会や配信などで行った講演資料を公開しています。 公式サイトはこちら https://www.unrealengine.com/ja/
関連スライド
各ページのテキスト
CEDEC KYUSHU 2024 Unreal Engine 5 レンダリングフロー総おさらい (2024) 基礎編 Epic Games Japan, Customer Success, Lead 篠山 範明
2024年11月現在、Unreal Engineは5.5までリリースされました ありがたいことに、Unreal Engineを用いた沢山の素晴らしいゲームが 日本からリリースされました
国内で採用された様々なUnrealのタイトル事例
そして、Unreal Engineは更に様々な業界で使われるように
ゲーム以外の分野での利用例 建築 車 映像 特撮 ライブ マンガ
様々な素晴らしい事例の傍ら... こんな意見も...
結局ゲームエンジンだから これぐらいのクオリティしか でないよね！
シェーダ コンパイル！？ エディタ固まるんです けど！？
無料アセットで シーン構築したけど クオリティも パフォーマンスも悪いよ!!
実機に出したら3fpsしかでない... 来月から量産フェイズだよ...
なにかがおかしい...
最初に結論 数十ミリ秒の単位で絵を出し続けるために リアルタイムレンダリングは様々なテクニックを駆使しています それは万能ではなく 使う側がそれらの得手不得手を理解し工夫することで パフォーマンスとハイクオリティのグラフィクスを同時に達成しています
しかし 様々な業界で 様々なバックグラウンドを持った方が 様々な期待値をもって Unreal Engineを使う様になりました
Draw Call? Shader Compile? LOD? Upscale? Streaming? Deferred Rendering?
Draw Call? Shader Compile? LOD? Upscale? Streaming? Deferred Rendering? ゲーム業界の当たり前は、 他の業界の当たり前ではないかもしれない
Draw Call? Shader Compile? LOD? Upscale? Streaming? Deferred Rendering? では、 (UE5の)リアルタイムレンダリングについて話すときの おさえておくべきポイントってなんだろう？
本セッションのテーマ ● UEのスタンダードなレンダリング手法である Deferred Renderingパスを基準に UEのレンダリングを俯瞰で眺めながら、 重要な点を理解し、メンタルモデルを形成する ● より細かなことを知りたいときにそのドキュメントにいけるようなハブにする
このドキュメントの使い方 説明する項目の右上にそのページに関する具体例や設定方法が書いてあるページへ のリンクをおいておきました(公式・非公式ドキュメント問わず有用なものへの)
本講演で言わないこと ● ● ● 各技術の具体的な操作方法、設定方法 各プラットフォーム固有のお話 アートのお話 ● こうすると絵が綺麗になるみたいな話はしません。できません。 ※日ごろからソースコードを追ってる人は 回れ右してソースコードに戻りましょう！
※リアルタイムレンダリングについて既に 知見のある皆様 Deferred Renderingはわかるよーという方 UE5の癖を集中して知りたいという方 そんな方には、 こちらのドキュメントは飛ばして、 右のドキュメントを是非ご参照ください 本ドキュメントに記載されていない、 より具体的かつ注意点をコンパクトに 紹介しています UE5の最新グラフィクスを使いこなすための4個の勘所 [CEDEC+KYUSHU 2023]
● ● UE5.5で用意している レンダリング手法 ディファードレンダリング ○ ○ ○ ○ ○ Agenda ● オブジェクト描画(BasePass) ライティング 半透明描画 ポストエフェクト アップスケール まとめ
※本講演は基礎のみとなります ● 本講演はレンダリングフローの中でも基礎 となる４つのパスしか説明しておりません ● 総おさらいしようと思ったのですが、その 時点でスライドが300ページを越えてしま いました ● ですので、本講演は「基礎編」とさせて頂 き、後に「発展編」として残りのパスを説 明したいと思います ● 公開まで今しばらくお待ちください
自己紹介 Who I am? 篠山 範明 ● ● Epic Games Japan, Customer Success, Lead ● X(Twitter): @tempkinder ● 国際きき酒師 (皆、日本酒を飲もう！) ● 今！九州が！あついです！
今! 九州が! あついです！
有志によるUnreal Engine Meetupの開催! Unreal Meetup Fukuoka Unreal Engine Kyushu LT会 in 鹿児島 「UE/UEFN＋地方創生」を想起させる現地イベントの熱狂。ハイブリッド開催でも講演やブース出展の熱を余すことなく伝えた 「第2回 Unreal Engine KYUSHU LT会 in 鹿児島」参加レポート
なんと次は長崎でも！ 皆様、是非ご参加ください！ https://x.com/font_a_ine/status/1809530588485021977
更に、もう一つ、九州で熱いやつ！
知ってますか？
ももいろクローバーZが所属するスターダストプロモーション内スタープラネット所属、 九州を拠点に活動するアイドルグループ。グループ名の「ばってん」は、主に九州地方で使われ る方言から来ており、九州、そして全国を元気にできるグループを目指す 水曜日のカンパネラのケンモチヒデフミが楽曲提供したりと、ダンス、エレクトロを基軸に、和 を意識した幅広いジャンルとユニークな世界観が高く評価されている。ステージでのクールでシ ステマティックなダンスパフォーマンスと、九州ののびのびとした環境で育ったメンバーのほん わかとしたキャラクターとのギャップも魅力 更にはSony様の360 AudioをはじめVRやARなどテクノロジーとのコラボにも積極的！ 東京では3000人規模のホールを埋めるのに、福岡でライブをしても観客の半分以上が関東から来 てるなんてことも...僕の事ですね。九州の人に是非もっと知ってもらいたい！ いや、これを読んでいるアンリアルエンジンユーザの方にも是非知ってもらいたい！ 是非これ以降のスライドは下のおすすめプレイリストを聞きながらお読みください ばってん少女隊おすすめYoutubeプレイリスト
● ● リアルタイムレンダリング？ ディファードレンダリング ○ ○ ○ ○ ○ Agenda ● オブジェクト描画(BasePass) ライティング 半透明描画 ポストエフェクト アップスケール まとめ
この絵がどんな流れで生成されるか？
オフラインレンダリング(プリレンダリング) ● ● ● ● 一枚の絵を数秒 ~ 数十時間かけて生成 高品質 物理法則に基づいた様々な光のシミュ レーションを時間をかけて行う CPUメイン・GPUメインで計算される リアルタイムレンダリング ● ● ● ”リアルタイム”に厳密な定義はないが一般的な ゲームでは 60fps=0.016秒, 30fps=0.033秒で絵を出す必 要がある この速度でなるべく高品質な絵を出すために、 様々な簡略化や独自のテクニックをを使用する GPUメインで計算される
オフラインとリアルタイムのレンダリング時間比較 1時間 オフラインレンダリング （様々なので1枚1時間と仮定、 これはめちゃくちゃ速い方） 22万5千倍速い! 0.016秒 リアルタイムレンダリング (60fpsと仮定)
高速にレンダリングするための工夫をイメージしやすくするため ハードウェアの大まかな流れを先に見させてください
GPUレンダリング Storage ハードウェアのイメージ CPU GPU Memory GPU Memory 登場人物たち Monitor
GPUレンダリング Storage ハードウェアのイメージ CPU GPU Memory GPU Memory 事前準備 必要なデータをストレージからメモリに、 メモリからGPUメモリへと前もって転送しておく Monitor
GPUレンダリング CPU Storage ハードウェアのイメージ GPUに描画の指示 Memory 必要なデータをストレージからメモリに、 メモリからGPUメモリへと前もって転送しておく GPU GPU Memory Monitor
GPUレンダリング CPU Storage ハードウェアのイメージ GPUに描画の指示 Memory 必要なデータをストレージからメモリに、 メモリからGPUメモリへと前もって転送しておく GPU GPU Memory 描画して モニターに 出力！ Monitor
GPUレンダリング この一連の処理を 0.016秒でループでき るようにしていくのが リアルタイム レンダリングの世界 Storage CPU ハードウェアのイメージ GPUに描画の指示 Memory 必要なデータをストレージからメモリに、 メモリからGPUメモリへと前もって転送しておく GPU GPU Memory 描画して モニターに 出力！ Monitor
● ● リアルタイムレンダリング？ ディファードレンダリング ○ ○ ○ ○ ○ Agenda ● オブジェクト描画(BasePass) ライティング 半透明描画 ポストエフェクト アップスケール まとめ
本日の主役 Deferred Renderingパス
UE5公式ドキュメント: パストレーサー UE5公式ドキュメント: フォワードレンダリング UE5.5で用意しているレンダリング手法 それぞれに異なった効果や制限があり、それに沿って各マテリアルやUEの設定を行う必要があります Path Tracing Deferred Rendering Forward Rendering 映像などリアルタイムでないレン ダリング用の用途 UE5の標準レンダリング手法 主にVRやモバイルなどで使われる 比較的軽量とされるレンダラー 高品質だがレンダリングに時間が かかる PCやコンソールなどはこれを使わ れているといっても過言ではない 今回はこちらを中心に話します！
Deferred Renderingパスの流れを簡単に見ていく
この絵がどんな流れで生成されるかを見ていきましょう
各オブジェクトがあって...
BasePass 不透明/Masked オブジェクト描画 オブジェクトからG-Bufferを作成 ※G-Bufferとは 後のライティングやポストエフェクトで 使われるための中間バッファ オブジェクトの 法線やマテリアル情報が入る G-Buffer
BasePass 不透明/Masked オブジェクト描画 ライティング G-Buffer
BasePass 不透明/Masked オブジェクト描画 ライティング G-Buffer 半透明描画
BasePass 不透明/Masked オブジェクト描画 ライティング G-Buffer 半透明描画 Post Process + UpScale (画面が 小さいので 次のページ...)
この低解像度な画像が, ポストプロセスやアップスケールを経て...
BasePass 完成！ 不透明/Masked オブジェクト描画 ライティング 半透明描画 Post Process + UpScale 高品質なアップスケール技術により、 内部解像度を低くして処理負荷をおさえています
参考記事: なぜなにリアルタイムレンダリング by もんしょさん ディファードレンダリングの仕組みや利点欠点が詳細に説明されています より詳細が気になる方は是非確認してみてください
BasePass 不透明/Masked オブジェクト描画 ライティング 半透明描画 ※アンリアルエンジンは、 この様に基本的なレンダリングフローが固定されてます フローを変えたり独自のパスを追加するためには、 エンジン改造が必要な場合もあります Post Process + UpScale
BasePass 不透明/Masked オブジェクト描画 ライティング 今回は この４つを大きな流れとして 分けて説明していこうと思います 半透明描画 Post Process + UpScale
BasePass 不透明/Masked オブジェクト描画 ライティング と言いつつ。。。その前に 半透明描画 Post Process + UpScale
BasePass 不透明/Masked オブジェクト描画 ライティング これはすべてGPUの中の話 半透明描画 Post Process + UpScale
世界は広大である... このすべてがGPUの中に収まるのか？
見えるものだけ描画すればいいじゃん？ カメラから見えないもの省いてこう？
CPUが、 GPUに描画させる データを大まかに 選別してくれます CPU GPUに描画の指示 GPU GPU Memory 描画して モニターに 出力！ Monitor
UE5公式ドキュメント: 可視性カリングおよびオクルージョン カリング CPU InitView BasePass 不透明/Masked オブジェクト描画 ライティング 半透明描画 GPU 実際にカメラから見えるものを選定してGPUに知らせる InitViewsというフェイズがCPUにあります。 Post Process + UpScale
UE5公式ドキュメント: 可視性カリングおよびオクルージョン カリング InitViews Frustum Culling カメラの視野（視錐台） に入っているものだけを選ぶ
参考動画 https://youtu.be/N_VO3RWkEAI Youtubeに飛びます
UE5公式ドキュメント: 可視性カリングおよびオクルージョン カリング InitViews Occlusion Culling 前に物があり完全に隠れている オブジェクトを省く
参考動画URL https://youtu.be/zjwgSaWvff4 Youtubeに飛びます
UE5公式ドキュメント: 可視性カリングおよびオクルージョン カリング InitView -> Frustum Culling / Occlusion Culling
UE5公式ドキュメント: 可視性カリングおよびオクルージョン カリング Initviews InitViews stat initviews コマンドによって、これらFrusutm CullingやOcclusion Culling の効果を見ることができます。
UE5公式ドキュメント: メッシュ描画パイプライン Draw Call ところで。。。Draw Call(ドローコール)？ ● CPUがGPUに「これを描画して！」 と命令を出すこと ● この命令を発行するCPU側の負荷に （またそれを解釈するGPU側でも負荷に なる場合も） ● 「最適化のためにドローコールを減 らそう！そのためにオブジェクトを マージしよう！」など聞きますが... ● UE5からは もう少し楽観視しても良いかもです
Draw Call Auto Instancing 4種類、合計192個の Static Mesh Actorを置いた場合、 これらの描画のDrawCallは何回？？ 192回??
Draw Call Auto Instancing 描画結果を見てきます
Draw Call Auto Instancing 描画結果を見てきます 1種類目
Draw Call Auto Instancing 描画結果を見てきます 2種類目
Draw Call Auto Instancing 描画結果を見てきます 3種類目
DrawCall Auto Instancing 描画結果を見てきます 4種類目 4回のドローコールで描画完了！
Draw Call Auto Instancing 現在のUE5では、 同じオブジェクト(スケールなどはOK)で 同じマテリアルだと 自動的にまとめられてドローされます
UE5公式ドキュメント: メッシュ描画パイプライン Draw Call ドローコールに対しての大雑把な見解 非常に大雑把な意見ですが。。。 最近のUE5のプロジェクトを見る限り ドローコールが問題となっている場面は非常に少なく それよりも単純に描画がリッチすぎてGPU負荷が高いことが多い気がします ドローコールにセンシティブにならないでも良いのでは。。。 というのが個人的な見解です
Draw Call 発展編: Q. (Hierarchical) Instanced Static Mesh Actorはもういらない？ A. そんなことはない 描画との直接の関係はないが、Actorが多すぎると単純なメモリ消費量の増加や 各Actorの初期化や更新のCPUコストが発生する そういった部分の負荷が大きい場合は、Instancedにまとめることも考慮すべき
CPU InitView BasePass 不透明/Masked オブジェクト描画 ライティング 半透明描画 Post Process + UpScale GPU CPUが終わったので、GPU側のDeferred Renderingパスを見に行きます
BasePass 不透明/Masked オブジェクト描画 ライティング 半透明描画 Post Process + UpScale 一番重要かつアセットを活用する部分のため、 重点的に説明させていただきます
BasePass 不透明/Masked オブジェクト描画 Opaque / Maskedマテリアル のオブジェクトを レンダリングして G-bufferを作成する G-Buffer
BasePassではオブジェクトの描画が行われるため オブジェクトの基礎的な構造を確認しましょう
Base Pass オブジェクトの基本構造 ポリゴンメッシュ テクスチャー マテリアル/シェーダ
Base Pass オブジェクトの基本構造: 本日説明するもの ポリゴンメッシュ ● ● Level of Detail Nanite ● ● ● ● テクスチャー マテリアル/シェーダ MipMap Streaming Virtual Texture Compression ● ● ● Shading Model PBR Shader Compile
Base Pass オブジェクトの基本構造: 本日説明するもの ポリゴンメッシュ ● ● Level of Detail Nanite Naniteは また後ほど... ● ● ● ● テクスチャー マテリアル/シェーダ MipMap Streaming Virtual Texture Compression ● ● ● Shading Model PBR Shader Compile
Polygon Mesh ポリゴンメッシュ ポリゴンメッシュ = 物体の表面を形成する三角形(ポリゴン)の集合体 これを高速に処理するための基礎的な手法 Level of Detailを見ていきます
Official Document: LOD の作成と使用 Official Document:スケルタルメッシュの LOD Polygon Mesh Level of Detail: コンセプト オブジェクトのディティールを表現するために 高密度になりがちなポリゴンメッシュですが...
Polygon Mesh Official Document: LOD の作成と使用 Official Document:スケルタルメッシュの LOD Level of Detail: コンセプト すごく遠くにいたりと描画面積が小さい場合でも、 この高密度なポリゴンを計算するのは効率が悪いのは想像つくかと思います
Polygon Mesh Official Document: LOD の作成と使用 Official Document:スケルタルメッシュの LOD Level of Detail (LOD) とは？ 遠くにいるオブジェクトの描画負荷削減やちらつき防止のための低ポリゴンモデル UE上で自動生成することも、独自メッシュをいれることも可能 どれぐらい遠くでメッシュが切り替わるかの設定も細かくできます
Polygon Mesh Official Document: LOD の作成と使用 Official Document:スケルタルメッシュの LOD Level of Detail: コンセプト このLODにより、実際に遠くでレンダリングされるメッシュは 非常に数少ないポリゴンでレンダリングできます リアルタイムで多くのオブジェクトを高速にレンダリングするための 基礎的な手法です
Polygon Mesh Level of Detailの設定方法 LODの ● ● 作成 切り替わりのタイミング などはUE内で自動で設定したり、 もしくは個別に自身で設定できます 詳しくは右下のリンクを参照ください Official Document: LOD の作成と使用 Official Document:スケルタルメッシュの LOD
Polygon Mesh Official Document: プラットフォームごとの LOD Official Document: プラットフォームごとに LOD 画面サイズを最適化する Tips: プラットフォーム別のLevel of Detailの制御 各プラットフォームの最大LODを設定できる これで描画負荷もパッケージサイズも削減できる可能性がある
Base Pass オブジェクトの基本構造 ポリゴンメッシュ ● ● Level of Detail Nanite ● ● ● ● テクスチャー マテリアル/シェーダ MipMap Streaming Virtual Texture Compression ● ● ● Shading Model PBR Shader Compile
Wikipedia: ミップマップ UE5 のミップマップの基本的な設定について Texture MipMapとは MipMap 遠い部分は 低解像度のMipMapで ● ● 事前計算で作成された 解像度が½, ¼, ⅛… と縮小されたテクスチャ群 これらを用いることで ● ● メモリアクセス効率化 による処理速度の向上 また遠景のモアレ対策にも つながる 近い部分は 高解像度のMipMapで 同じサイズに 拡大
ミップマップの呪い（？）にご注意 UE5 のミップマップの基本的な設定について Texture MipMapによるモアレ対策の改善 ● 遠くのモアレ対策 ● ● 遠景で高解像度のテクスチャをサンプリングしようとすると、 モアレと呼ばれるノイズが生じてしまいます Mipmapは遠景で低解像度のテクスチャをサンプリングさせることでこのモアレを改善します MipMapにより遠景のノイズが改善される例 (英語版Wikipedia: MipMapより)
Texture ゲームエフェクトデザイナーのブログ UE5 ２の累乗じゃないテクスチャのミップマップ生成 煮干蕎麦 丿貫(東京) Tips: MipMapのためにテクスチャ解像度は 2のべき乗(1024とか2048とか)じゃないといけない？ 以前まではそうでしたが、UE5.1より2のべき乗でなくてもMipが作成できるようになりました！ 詳しくは右下のmokoさんのリンクを参照ください！ （ここのラーメンは美味しいです）
ところで...
世界は広大である。そしてディティールも沢山。
Storage CPU GPU Memory GPU Memory GPUメモリに全部収まるのか...? Monitor
※ GPU Memory量の調べ方 (Windows) Task Managerを開きGPUを選択すると “Dedicated GPU Memory” という項目があります ここでお使いのGPUの メモリ総量と現在の消費量が確認できます
Storage CPU GPU Memory GPU Memory Monitor すべての建物、キャラクタのポリゴンやテクスチャ... メモリに収まらない！！！（様な大きなシーンも描画したい！）
Official Document: テクスチャストリーミングの概要 Streaming 大切な考え方: ストリーミング/Streaming その瞬間に必要なデータのみを読み込み、不必要になったら追い出す技術 データが非常に大きく、全部を一度にメモリに乗せられないときなどに有用 例: Youtubeなど動画全体を読み込むとデータが非常に大きくなってしまうの で、再生している箇所近辺の動画の前読みし見終わったら順次消していく 前読みされている一部分
テクスチャストリーミングの流れを 順を追って見ていきましょう
Official Document: テクスチャストリーミングの概要 Streaming ストリーミング/Streamingの動き方 Storage Memory GPU Memory CPU Mip 3 Mip 2 Mip 1 これぐらいなら、 Mip1までのテクスチャで十分だな... Mip 0 MipMap
Official Document: テクスチャストリーミングの概要 Streaming ストリーミング/Streamingの動き方 Storage Memory GPU Memory CPU Mip 3 Mip 2 Mip 1 Mip 1まで読み込もう！ Mip 0 MipMap
Official Document: テクスチャストリーミングの概要 Streaming ストリーミング/Streamingの動き方 Storage Memory GPU Memory CPU Mip 3 Mip 2 Mip 1 Mip 0 要求されたMipまで読み込む MipMap
Official Document: テクスチャストリーミングの概要 Streaming ストリーミング/Streamingの動き方 Storage Memory GPU Memory CPU Mip 3 Mip 2 遠くにいったぞ... もうMip2までで十分だ Mip 1 Mip 0 MipMap
Official Document: テクスチャストリーミングの概要 Streaming ストリーミング/Streamingの動き方 Storage Memory GPU Memory CPU Mip 3 Mip 2 Mip1はもうメモリに いりません！ Mip 1 Mip 0 MipMap
Official Document: テクスチャストリーミングの概要 Streaming ストリーミング/Streamingの動き方 Storage Memory GPU Memory CPU Mip 3 Mip 2 Mip 1 Mip 0 MipMap メモリから出す！
Official Document: テクスチャストリーミングの概要 Streaming 大切な考え方: ストリーミング/Streaming このようなStream In/ Stream Outを常に動的に行うことで、 ● ● ● 一定のメモリ量で 大量のテクスチャを リアルタイムでレンダリングしています ここでTexture Streamingで良くある問題2点をシェアさせてください 1. ストリーミングが間に合わない 2. ストリーミングのメモリプールに入りきらない
Official Document: テクスチャストリーミングの概要 Streaming あるある1. Streamingが間に合ってないケース Storage Memory GPU Memory CPU Mip 3 一瞬でワープしてきた！ 近い！ Mip 0のテクスチャが必要だ！ Mip 2 Mip 1 Mip 0 MipMap でもMip0なんてメモリにないよ！ 今から読み込むけど数フレームかかるよ！
Official Document: テクスチャストリーミングの概要 Streaming あるある1. Streamingが間に合ってないケース Storage Memory GPU Memory Mip 3 Mip 2 Mip 1 読み込まれるまで数フレームボケて表示 Mip 0 MipMap
Official Document: テクスチャストリーミングの概要 Streaming あるある1. Streamingが間に合ってないケース Storage Memory GPU Memory Mip 3 Mip 2 Mip 1 読み込み終わったのでやっと想定のmipを表示 Mip 0 MipMap
Streaming Texture Streaming Pool Over Budgetの意味 Texture Streaming Pool のSizeの設定手順 あるある2. Streaming用に確保したメモリ量を オーバー ● Texture Streaming用のメモリサイズ （Pool Size）はコンソール変数 r.Streaming.PoolSize によって決めら れます ● 沢山テクスチャがあるときなど、このス トリーミングバジェットに納まらないと きがあり、一部のテクスチャはボケたま まかも ● その際はr.Streaming.PoolSizeの拡大を ご検討ください いつまでたってもボケたままかも...
Streaming 発展: Mesh Streaming (ご紹介まで) ● このStreamingをLODメッシュでも行う Mesh Streamingがプロジェクト設定にあります ● 二種の設定方法 ● ● 各メッシュ ● Num Stremed LODsでStreamできるLODの数を設定 LOD Groups ● 設定されているLOD Groupの ● MaxNumStreamedLODsを設定 ● bSupportLODStreamingを1に
Official Document: ストリーミング バーチャル テクスチャリング Virtual Texture 大切な考え方: 仮想化/Virtualize 仮想化データとは、大雑把には 「オブジェクトを断片的に読み込めるデータにする」と、とらえて良いかも Virtual Textureはテクスチャをタイルに分割し、 そのタイル単位で読み込めることができます
Official Document: ストリーミング バーチャル テクスチャリング Virtual Texture Virtual Texture そしてこのVirtual TextureはMipMap内部でもタイル単位で 読み込むことができます
Official Document: ストリーミング バーチャル テクスチャリング Virtual Texture Virtual Texture カメラから近い部分だけ詳細なMipを読み込んで、遠くの部分は荒いMipを読み 込むことでメモリ削減しつつ高精細なテクスチャ表現ができます
Virtual TextureとそのStreamingの仕組み、またよく頂く質問への回答 より詳しく知りたい人はぜひこちらをご参考に！
テクスチャのフォーマットについて [UE5] 画像の圧縮フォーマット Compression 紹介まで: テクスチャの圧縮(フォーマット) GPU GPU Memory ● GPUが高速にテクスチャを読み込み処理するために、 GPUでレンダリングされるテクスチャはあらかじめGPUが定 義したフォーマットに圧縮変換する必要があります ● DXT1/5, BC4…などなど、聞いたこともあるかもしれません ● 本スライドでは詳細は触れませんが、重要な点なので是非右 下のmokoさまやヒストリアさまのブログをご確認ください
Textureの仮想化技術Virtual Textureを説明しましたが、 これをポリゴンメッシュに応用したものがあります
オブジェクトの基本構造 ポリゴンメッシュ ● ● Level of Detail Nanite ● ● ● ● テクスチャー マテリアル/シェーダ MipMap Streaming Virtual Texture Compression ● ● ● Shading Model PBR Shader Compile
Nanite = Virtualized Geometry シネマクオリティの超高密度ポリゴンをリアルタイムでレンダリング LODの作成も不要
これはNaniteによってリアルタイムでレンダリングされたメッシュです
メッシュ表示させると、どれだけ高密度かわかるかと思います
Naniteは一つのオブジェクトだけをハイポリゴンで描画する技術ではありません この部屋には500体の像があり、総ポリゴン数でいうと160億ポリゴンを超えます
メッシュ表示してみます
Nanite Nanite = 仮想化ジオメトリ (Virtualized Geometry) ● 超高精細なオブジェクトは... ● ● ● データサイズが非常に大きくメモリにのらない ポリゴン数が多くレンダリングに時間がかかる それらを解決するために、 Virtual Textureの様に オブジェクトの詳細を部分的にストリーミングしています
SIGGRAPH2021 - Nanite Deep Dive より Nanite Nanite ● Virtual Textureの ポリゴンオブジェクトバージョン ● オブジェクトを事前に ● ● クラスタ化 階層化
SIGGRAPH2021 - Nanite Deep Dive より Nanite Nanite ● レンダリング時 ● ● ● ● 視点(ピクセル)に応じて 必要に応じた詳細度のクラスタを読み 込む(または破棄)することで メモリ消費量を一定に保ちながら高精 細なオブジェクトをレンダリングする
Official Document: Naniteのサポートされている機能 Nanite UE5.5現在 Naniteがサポートする機能 ● ● Naniteはそのデータの特性上、 マテリアルなど一部制約があります 例: マテリアル ● ● ● 対応: Opaque (不透明) および Masked (マスク) 未対応: Translucent(半透明) 例: 変形 ● ● ベータ対応: World Position Offset 検証中: Skeletal Mesh 毎バージョン更新があるので、バージョンアップの 度にオフィシャルドキュメントをご参照ください
https://x.com/tempkinder/status/1518946168222273536 動画説明 Naniteの部分的なジオメトリの変化をわざと見えるようにオフセットをつけた例です 実際は、この変化が視覚的に気づかないぐらい小さなピクセルレベルで行われています
Nanite 参考: Naniteのアルゴリズム超概要 データを ストリーミング (次フレーム以降の) ストリーミング リクエスト Hardware Software クラスタリング 事前準備 (Editor) 表示する クラスタを決定 ラスタライズ ランタイム Visibility Buffer 作成 G-Buffer に書き出し
Nanite 参考: 通常のメッシュとNaniteの描画パス Hardware Nanite Pass Software G-Buffer に書き足し Polygon Mesh Pass 通常メッシュのみで G-Buffer作成 通常のメッシュのパスとNaniteのパスはG-buffer上でマージされます G-Bufferの中に、「Naniteか通常メッシュで作成されたかどうか」という情報は残りません
Nanite NaniteはVirtual Textureと同等の制約を持つ https://x.com/tempkinder/status/1525300653051875328 カメラカットが急に切り替わると、 Naniteのストリーミングが間に合わない
Nanite sann参考資料: Unreal Engine 5 における レンダリング & デバッグTips こちらにより詳細なNaniteの仕組みと検証結果があります！ 是非ご参考にしてください！
Nanite 発展編 Q: 低ポリゴンモデルもNaniteにした方が良い？ めちゃくちゃ良くある質問... ● EPICとしての回答) ● ● はい！なるべくNaniteにしてください！ 個人的な回答) ● いろいろな場合があるので一概に言えません。ぜひ計測してみてください！ (弊社エンジニアの澤田が調査資料を近々公開するとか。。。）
オブジェクトの基本構造 ポリゴンメッシュ ● ● Level of Detail Nanite ● ● ● ● テクスチャー マテリアル/シェーダ MipMap Streaming Virtual Texture Compression ● ● ● Shading Model PBR Shader Compile
Official Document: マテリアルの基本概念 Material マテリアル マテリアルはそのオブジェクトの質感設定や 様々なレンダリングのパラメータを設定するものです
Official Document: マテリアルの基本概念 Material マテリアル UEではノードベースでマテリアルを作成していきます
Official Document: マテリアルの基本概念 Material マテリアル このノードを駆使することで、様々な表現ができます (上図は、どちらも平面にマテリアルで凹凸をつけています)
Official Document: マテリアルの基本概念 Material マテリアル では、”質感”とはなんだろう？？
ライト来たけど どうカメラに返す？ 質感とはつまるところ、ライトに当たった際に 「オブジェクトがどのような反射やふるまいをするか？」 を定義するもの
ライト来たけど どうカメラに返す？ これを大きく定義しているのが マテリアルの Shading Model です
Official Document: シェーディング モデル Material Shading Model? ● そのマテリアルがどうライトと計算され るかを定義する重要項目 ● G-bufferに書き込まれ、後のライティン グ時に各ピクセルがどのShading Model かによって計算式が変更されます
Material 発展: 独自のShading Modelをつくりたい！ ● Shading Modelによるライティン グの計算はソースコードに書かれ てます ● つまり、独自のShading Modelが 必要となった場合、エンジン内部 を拡張する必要があります ● 実際追加する方法はCG Worldさま 記事に詳細に説明されているので 是非ご参照ください CG Worldさま記事 エンジン改造入門＆シェーディングモデルの追加
Base Color / Metallic / Specular / Roughness マテリアルの入力には色々なパラメータがありますが これらをどう設定すべきでしょうか？ Unrealでは、マテリアルの挙動は物理的な光学に基づき設計されています これをPhysically Based Rendering, 通称PBRと呼びます
100のエネルギーの ライトをあてるよ！ スーパートマトだ！ 500倍して50000エネルギーでかえすぜ！ 物理的に正しくない挙動の例 エネルギー保存則に反する
100のエネルギーの ライトをあてるよ！ 拡散される部分、吸収される部分、 鏡面反射される部分などを考慮して.. これぐいらかなぁ... 物理的に正しい挙動をシミュレーション エネルギー保存則を考慮する
Material Official Document: 物理ベースのマテリアル WolFarm チュートリアル 物理ベースレンダリング PBR: Physically Based Rendering ● 具体的にどのようなパラメータを与えることで現実の物体を再現できるか、 その詳細が公式ドキュメント「物理ベースのマテリアル」に記載されていま すのでご参照ください
Shading Modelを適切に設定し PBRベースでリアルなマテリアルを作成できた! そして量産に入ると必ず問題になるマテリアルの問題...
シェーダコンパイルが終わらない問題 について見ていきます
質問 1つのマテリアルを表現するために必要なシェーダは 何個でしょうか？
様々なオブジェクトの属性が、 様々なライティングをされます
一つのマテリアルでも...
様々なオブジェクトにアサインして、 レンダリングすることができます
Material Shader Shader Shader Shader これが可能なのは、 マテリアルは様々な場合に応じたシェーダを保持し、 それぞれの場合に応じて使用しているからです
Material Shader!! 全部に対応できる高性能シェーダを 1つ作れば良いんじゃないの？ いいえ。そうすると様々な場合分けなどの確認により 処理負荷が増大してしまうのです
Material Shader Shader Shader Shader そのため 各ユースケースに応じたシェーダを 複数持つ必要があります
悪意をもって1個のマテリアル内のシェーダを増やしてみました たった1個のマテリアルで240個のシェーダを保有
シェーダコンパイルが終わらない
シンプルな削減方法を一つご紹介
Shader Compile Project Settings / Rendering Shader Permutation Reductionによるシェーダ削減 ● プロジェクトで使わない機能を前もって指定することで、その機能の シェーダを生成しない
Shader Compile Project Settings / Rendering Shader Permutation Reduction OFFのままその機能を使うと警告が出る (レンダリングはされない)
25 17 全部つけたもの vs 全部消したもの シェーダ数を32%削減
そうは言っても... シーン内のマテリアルが増えれば触れるほど シェーダの数は増えていきます
シェーダの共有 及び 分散ビルド による解決
シェーダコンパイルを円滑にすすめるための方法 Derived Data Cache(DDC) Unreal Build Accelerator コンパイル結果をみんなで共有 別PCも使ってシェーダビルド
全員が同じプロジェクトで作業しているのに、 各自のローカル環境でシェーダコンパイル... 無駄じゃない？
このシェーダ達コンパイルしました！ ここに置いておきます！ 私達それ使います！ シェーダコンパイルする必要なし！ みんなでシェーダコンパイル結果を共有すれば、 チーム内で大幅な効率改善の可能性！
Shader Compile DDC: Derived Data Cache ● シェーダを含む様々なUEの中間 データを皆で共有するシステム ● ローカルネットワークに置いたり、 クラウド上に置いたりと様々な ユースケースに対応 Official Document: 派生データ キャッシュ (DDC) DDCを共有してストレスフリーな開発を！ キャッシュ(DDC)を共有する方法と注意点について
シェーダコンパイルを円滑にすすめるための方法 Derived Data Cache(DDC) Unreal Build Accelerator コンパイル結果をみんなで共有 別PCも使ってシェーダビルド
シェーダコンパイル 手伝って！ 他のPCに自分のシェーダコンパイルを分散させる
Shader Compile UBA: Unreal Build Accelerator Epicが無料で提供している分散ビルド環境 シェーダの分散ビルドにも対応！
Shader Compile UBA: Unreal Build Accelerator Epicが無料で提供している分散ビルド環境 ベータ
Shader Compile 素晴らしい日本語チュートリアル記事が出てます！ 「Unreal Build Accelerator(UBA)を利用した分散ビルドのセットアップ方法」 https://forums.unrealengine.com/t/unrealbuildaccelerator-uba/1826434
ポリゴンメッシュ ● ● Level of Detail Nanite ● ● ● ● テクスチャー マテリアル/シェーダ MipMap Streaming Virtual Texture Compression ● ● ● オブジェクトの基本構造の重要な点を かいつまんで紹介しました Shading Model PBR Shader Compile
BasePass 不透明/Masked オブジェクト描画 ライティング 半透明描画 Post Process + UpScale BasePassは以上となります 一番重要かつアセットを活用する部分のため、 重点的に説明させていただきました
不透明部分の BasePass 不透明/Masked オブジェクト描画 ライティング 半透明描画 Post Process + UpScale
UE5ではこのライティングがリアルタイムで動く
事前計算なしに、 様々な光源環境でハイクオリティなライティングが可能です
そのライティングの流れを理解するため、 このライティングを４つの要素に分解して考えていきます
● ● ● ● 直接光: Direct Lighting 影: Shadow 間接光: Indirect Lighting 映り込み: Reflection これからこの四つについてそれぞれ見ていきます
● ● ● ● 直接光: Direct Lighting 影: Shadow 間接光: Indirect Lighting 映り込み: Reflection の前に、直接光と間接光の説明だけ...
Direct Lighting Indirect Lighting
直接光 (Direct Lighting) ライトからの直接(Direct)のライティング
間接光 (Indirect Lighting) 二次反射。照り返し。複数回バウンドしたライティング 直接光で届かない場所へも、光が回り込む。
Direct Lighting Indirect Lighting
● ● ● ● 直接光: Direct Lighting 影: Shadow 間接光: Indirect Lighting 映り込み: Reflection 直接光から見ていきます
Official Document: ライトのタイプと可動性 Direct Lighting Unrealには様々なLightが用意されています Directional Spot Sky Area Point
Official Document: ライトのタイプと可動性 LightのMobilityのおさらい LightMap生成用 ライト ShadowMap 事前計算 ライト 事前計算なし ライト
参考記事: LightのMobilityを整理しよう
事前計算は様々な制約を生みます なので、次世代に向けては、 オブジェクトもライトも すべてを動的にしていく方法を ShadowMap LightMap生成用 事前計算 ライト 模索しています ライト なのでこのMovableを前提で 新規機能が開発されています 事前計算なし ライト
といっても、UE5でも Static/Stationaryな UE4時代の手法も健在 LightMap生成用 ライト ShadowMap 事前計算 ライト 事前計算なし 様々なプラットフォームや ライト ユースケースでの使用を想 定 しかし抜本的な改善などは 今のところ未定です
ここから数ページ程、 UE4時代から長く使われている Static / Stationaryなライトの手法に対しての 概要説明が続きます その部分のページの背景をグレーにしました ベイク処理などの使用予定のない方は 背景が黒に戻るまで 読み飛ばしてください
建築ビジュアライズにおけるLightmass実践使用方法 （フリーランス 真茅健一様） Static/Stationary Lighting Light Bake: ライティングの焼き付け ライティング結果を事前にテクスチャで焼き付け、 リアルタイムのライティングコストを削減する ただし、ライトもオブジェクトも変化しないスタティックなものに限られる
Static/Stationary Lighting Light Bake: ライティングの焼き付け キャラクタなど動的なオブジェクトにもスタティックなライトの影響を与えられる ボリュームデータも作成されます (Volumetric Lightmap/ Sparse Volume Lighting Sampleの二種類の手法）
Static/Stationary Lighting Light Bake: CPU/GPU Lightmass Lightmass: UnrealのLight焼き付けツールの名前 CPU: 複数PCで分散できます！ GPU: ベータ! 一台で高速に！リアルタイムプレビューできます！ 注意点: CPU/GPUで結果が異なります採用する際はクオリティも見て事前に比べる のをお薦めします GPU Lightmass のリアルタイムプレビュー
UE４時代の古い記事ですが、 Lightmass Deep Diveにて ライトベイクのアルゴリズムなど基礎的な部分をまとめています 気になる方は是非ご参照ください
Stationary Lightの挙動や仕組みについては、以下のブログに簡単に まとめましたのでこちらもご参照ください Stationary Lightの影について
Static/Stationaryのライティングの紹介を 終わります
ここからは全て動的なライトを前提 ShadowMap LightMap生成用 として話を進めます ライト 事前計算 ライト 事前計算なし ライト
Deferred Lightingは 影がなければ動的ライト沢山おいても軽い？
範囲の小さい Movable Lightを100個 VS 範囲の大きい Movable Lightを8個
Light Complexity Lightingの負荷を大まかに見積もる機能 Light Complexity Lightingの負荷を大まかに見積もる機能
範囲の小さい Movable Lightを100個 VS 範囲の大きい Movable Lightを8個 Light Complexityでの比較 (青->緑->赤と高負荷を示す)
Q: Deferred Lightingならライトを沢山おいていいのか？ ライトを沢山を”置けます”が、 ライトが触れるピクセルが増えれば増えるほど処理負荷は増えます。 簡易的に、Light Complexityという機能があるので、 そちらで高負荷なライティングの場所を探りましょう
● ● ● ● 直接光: Direct Lighting 影: Shadow 間接光: Indirect Lighting 映り込み: Reflection 次に、影を見ていきます
Shadow ● ● ● ● (Virtual) Shadow Map Contact Shadow Ray Traced Shadow Map (Distance Field Shadow)
Virtual TextureとそのStreamingの仕組み、またよく頂く質問への回答 Shadow Virtual Shadow Maps UE5の新機能 ● Shadow mapの解像度問題への対策 ● Virtual Textureの仕組みを活用した Shadow Map ● 視点に近い部分のShadowMapは細かく 視点に遠い部分のShadowMapは荒く... などができます
Unreal Engine 5 における レンダリング & デバッグTips Shadow Virtual Shadow Maps VSMはデフォルト設定からPoolSizeが512MB等消費メモリや負荷が高く 使用を断念されている声も頂いている...ため、5.4から改善が行われました
Unreal Engine 5 における レンダリング & デバッグTips Shadow Virtual Shadow Maps 最適化について - 5.4~ 例：PagePoolSizeを4096->100に制限(メモリは512MBから16MBへ削減) Pool Sizeに合わせた動的解像度VSM r.Shadow.Virtual.DynamicRes.MaxPagePoolLoadFactor デフォルト: 0.85 プールサイズの85％を超えた場合にPageのLODを調整する
Official Document: Hardware Ray Tracing Shadow Raytraced Shadow Hardware RayTracingを使用したShadow描画 従来のShadowMapやVirtual Shadow Mapに比べてより正確な影が出る
Official Document: ハードウェア レイ トレーシングの機能 Shadow Tips: Hardware Ray Tracing用シーン構築コスト ※注意点: Hardware Ray Tracingを使うためには Ray Tracingを計算するためのデータをGPUの中に別に持つ必要があります 勿論その分のメモリ、計算処理がかかります 実際のシーンでも Naniteのポリゴン表示 Ray Tracing界のポリゴン表示
[UE4] Shadow Rendering(影描画)機能入門 Shadow Contact Shadow ● スクリーン上で疑似的にトレースして近傍 の影を落とす ● ※未だ有効、多くのタイトルで採用 ● 草などの沢山のオブジェクトの影を従来の ShadowMapでレンダリングするのは未だ 高い処理負荷となる ● Contact Shadowなし Contact Shadowを落とす/落とさないモデルを選 択できる Contact Shadow あり
Official Document: Mega Lights Shadow MegaLights (Experimental in UE5.5) ● 数百個以上の動的な影つきライトをリアルタイムでレンダリングできる ● デモはPS5で30fpsで動作
Official Document: Mega Lights Shadow MegaLights (Experimental) ● なんで沢山のライトがおけるの？ ● ● 1フレーム、各ピクセルでの最大サンプリング量を固定している ライトの数が増えても処理負荷が増大しにくい MegaLightsのライトサンプリングの参考動画
Shadow MegaLights (Experimental) コンセプト ● 従来のライティング ● 結果は常に一定の正しいライティング ● ライトを置けば置くほど負荷が増加 ● パフォーマンスよりも結果の正確性を重視 ● Megalights ● 各ピクセル１フレーム内の最大サンプリング量 が決定している ● なのでライトの数によって負荷が増大しない ● その代わり、ライトが沢山ありすぎるとエラー が出る可能性も ● 結果の正確性よりもパフォーマンスを重視
● ● ● ● 直接光: Direct Lighting 影: Shadow 間接光: Indirect Lighting 映り込み: Reflection 間接光と映り込みは同時に
Indirect Lighting & Reflection 直接光 (Direct Lighting) とある点のライティング結果が知りたいとき... ライトからの影響だけを計算すればよい
Indirect Lighting & Reflection 間接光 (Indirect Lighting) 二次反射。照り返し。複数回バウンドしたライティング 直接光で届かない場所へも、光が回り込む。
Indirect Lighting & Reflection 間接光 (Indirect Lighting) どこからくるのかわからない... ライトの複数回反射を事前にシミュレートしておく必要がある とある点のライティング結果が知りたいときは... シーン全体を見に行く必要がある
Indirect Lighting & Reflection 参考: 反射/映り込み (Reflection) 反射や映り込みもGIと同様。とある点の反射を得るためには... シーン全体から反射する部分(とその部分のシェーディングも！)を 取得する必要がある
UE5から この計算量の高い間接光と映り込みの計算を リアルタイムで実現する技術が搭載されました
Lumen 完全に動的なグローバルイルミネーション ライトもワールドも動的変更が可能 ベイクなし、ライトマップUVなし
オフィシャルドキュメントより Indirect Lighting & Reflection 動的なGlobal Illuminationを実現
オフィシャルドキュメントより Indirect Lighting & Reflection 屋外から屋内まで柔軟に対応可能
オフィシャルドキュメントより Indirect Lighting & Reflection ReflectionやSpecularも
Lumenは幅広いシーンでの活用を想定 ● オープンワールドの広大な レンダリングから ● 屋内の局所的な レンダリングまで ● インタラクティブなゲーム から静止画/動画まで
そのためか内部の設定を非常に細かく制御できます lumenを調整するCvarだけでも200を越える....
Indirect Lighting & Reflection Lumen Algorithm 概要 各メッシュの カード形状作成 事前準備 (Editor) Lumen Sceneの構築と ライティング レイトレで GIを計算 ランタイム アップサンプリング！
Indirect Lighting & Reflection Lumen Algorithm まとめ Lumen Sceneの構築と ライティング レイトレで GIを計算 アップサンプリング！ これ本当に1フレームで計算できる？？？
複数フレーム分散... Lumen Card... Screen Trace... Lumenは内部で様々な工夫や近似を行い リアルタイムでGIやReflectionを計算しています そのため、Lumenは沢山の苦手な部分があります
Indirect Lighting & Reflection Lumenの苦手なところ 参考動画URL X(Twitter)に飛びます ライティングの高速な変化に対する遅延
Indirect Lighting & Reflection Lumenの苦手なところ 参考動画URL X(Twitter)に飛びます カメラの切り替え時の遅延
Indirect Lighting & Reflection Lumenの苦手なところ Lumenはまだ完璧な鏡面反射に 対応してません どんなに処理を重たくしても 鏡は作成できません
UE5の最新グラフィクスを使いこなすための4個の勘所 [CEDEC+KYUSHU 2023] この様なLumen, Nanite, TSRなところなどがまとまっております 是非、このスライドの読破後、読んでみてください
Unreal Engine 5 Lumenの仕組みと肝心なところ Lumenの中の動作を知りたい人へ... 少し詳しく書いたのでぜひご参考にして頂ければ幸いです
Indirect Lighting & Reflection Lumenと向き合う心構え ● 「あとはLumenが全部よろしくやってくれる！」という考えは捨てる ● できないところや苦手なところを理解し、避ける、工夫する ● そういった工夫を経て、パフォーマンスを維持しつつ素晴らしい絵を出して いる作品があると知る ● そして、Lumenは引き続き改善が続けられているため最新情報を追う
Indirect Lighting & Reflection UE5.5でLumenに大幅な最適化が！ ● Hardware Ray TracingのLumenがコン ソールで60fpsで動くように最適化さ れました ● リリースノートをチェックしてみてく ださい！ UE5.5リリースノート
Indirect Lighting & Reflection その他のReflection手法 (リンクの紹介まで...) Reflection Probe Screen Space Reflection Planar Reflection 事前計算で静的シーンの ReflectionMapを作成 動的に反射を作成、 画面に見えない反射は 表現できない 平面限定だが、完璧に 動的に反射を表現 重たいので映像向け
- https://dev.epicgames.com/documentation/ja-jp/unreal-engine/reflections-environment-in-unreal-engine#reflectioncapture(反射キャプチャ)アクタ
- https://dev.epicgames.com/documentation/ja-jp/unreal-engine/reflections-environment-in-unreal-engine#スクリーン空間の反射(screenspacereflections)
- https://dev.epicgames.com/documentation/ja-jp/unreal-engine/reflections-environment-in-unreal-engine#平面反射
● ● ● ● 直接光: Direct Lighting 影: Shadow 間接光: Indirect Lighting 映り込み: Reflection 非常にざっくりと、ライティングについて見てきました
BasePass 不透明/Masked オブジェクト描画 ライティング 半透明描画 Post Process + UpScale
Translucent 半透明リアルタイムレンダリングの大きな壁 様々な問題があります 1. 描画負荷 2. 描画順序 3. デプスを描画しない これらを簡単にですが説明していきます
BasePass 不透明/Masked オブジェクト描画 ライティング G-Buffer 不 透 明 不 透 明 不 透 明 不 透 明 不透明オブジェクトの描画は見える部分だけを一回描画 不 透 明
Translucent 半透明リアルタイムレンダリングの大きな壁 1. 描画負荷 2. 描画順序 3. デプスを描画しない 半 透 明 半 透 明 半 透 明 半 透 明 半透明オブジェクトははすり抜けるので何回も計算しなけばいけない 不 透 明
ピクセル描画の主な負荷 = 各ピクセル描画の重たさ * 描画される回数
画面全体の色を変える PostEffect 煙のエフェクト一個 どちらが重たいでしょう？？
右の煙のワイヤーフレーム表示 煙のエフェクト一個 半透明描画では、 透明でも沢山のピクセルを描画している可能性がある
画面全体の色を変える PostEffect 煙のエフェクト一個 たった一個のエフェクトでも、描画するピクセル数が増えれば PostEffect以上の負荷に簡単に跳ね上がる可能性があります
重なり具合を確認できる Debug View Shader Complexity
ピクセル描画の主な負荷 = 各ピクセル描画の重たさ * 描画される回数 どのように処理ピクセルを減らすか？ の一例を...
Official Document: Niagara レンダラ Translucent Particle Cutout スプライト描画の透明部分を減らす UV-Animationによるスプライト表示では、 透明部分が不要に出てきてしまう場合が多い
Official Document: Niagara レンダラ Translucent Particle Cutout スプライト描画の透明部分を減らす ”Particle CutOut” Particleの透明部分を、自動でポリゴン分割してくれる機能
Translucent Particle Cutout スプライト描画の透明部分を減らす ポリゴン数は少し増えるが、大幅なピクセル描画負荷を削減 あるタイトルではこれでエフェクトの描画負荷が3分の１にも
Translucent Particle Cutout スプライト描画の透明部分を減らす Cutoutの設定方法はやその他Niagaraの最適化などは Epic GamesのVFX Artistである池田による Unreal Engine 5 Niagaraにおける実践的な最適化とスケーラビリティ【CEDEC 2023】 を参考にしてみてください
Translucent 半透明リアルタイムレンダリングの大きな壁 1. 描画負荷 2. 描画順序 3. デプスを描画しない
Translucent 半透明リアルタイムレンダリングの大きな壁 1. 描画負荷 2. 描画順序 3. デプスを描画しない 4 半 透 明 3 半 透 明 2 半 透 明 1 半 透 明 奥から手前に描画していかないと正しい結果を得られない 不 透 明
1 順番を間違えてしまっている例 後ろにあるべき炎が前に出ている 2
2 順番が正しい例 1
Official Document: 透過処理のソートの優先順位 Translucent 半透明描画の順序は自動でソートされる ● ● 前提: UE5はメッシュコンポーネント 単位で描画順序をソートしてくれます （後ろから前の順で描画） それでも、どうしても描画順序を変え たくなることもあるかもしれません 4 半 透 明 3 半 透 明 2 半 透 明 1 半 透 明 不 透 明
Official Document: 透過処理のソートの優先順位 Translucent 半透明描画の順序を制御する ● メッシュコンポーネントのRendering カテゴリにある Translucency Sort Priorityにより、 描画順序の優先度を変更できます （値が高い方が最後に描画されます） TSP=0 3 TSP=0 半 透 明 2 TSP=100だから 最後に描画して！ TSP=0 半 透 明 1 半 透 明 4 半 透 明 不 透 明
Official Document: 透過処理のソートの優先順位 Translucent ※この自動ソートは完璧ではない ● 半透明オブジェクトが重なって いたりすると、 カメラの移動で容易にパカつき ます... こっちから見ると 緑が近い 中心 ● 現状、これを完璧に対応する手 法はなく、をなるべく避けて シーンづくりすることをお薦め しています 重なり 中心 こっちから見ると 赤が近い
半透明描画 発展: OIT (Order Independent Transparency) 参考記事: Unreal Engine 5.4のOITを試す まだExperimentalで実務では使えないのですが、 Pixelレベルで半透明描画をソートする機能も検証されています
半透明描画 半透明リアルタイムレンダリングの大きな壁 1. 描画負荷 2. 描画順序 3. デプスを描画しない
Translucent 半透明オブジェクトはDepthを描画しない Depthの世界では半透明オブジェクトはいないことに...
Translucent 半透明オブジェクトはDepthを描画しない 背景ぼかしたのに 半透明がぼけない... 被写界深度などのDepthを見て描画するポストエフェクトでは 半透明エフェクトが浮いてしまうことも
Translucent 半透明描画の複数のパス (Before / After DOF) 半透明描画にはDOFの前に描画するか別バッファに描画しDOFの後に合成する二 つのパスがあり、マテリアル内Translucency Passで設定できます (Default: After DOF) 半透明描画 Before DOF そのまま ライティング結果に 上書き After DOF 別のバッファに 書き込み DOFの後に合成 Post process + Upscale DOF (被写界深度) AfterDOF 合成
Translucent ※発展: 基本的にAfterDOFのままにしておくべし ※UE5のアップスケール手法であるTSRのエラーを回避のため、基本的にはAfterDOFで運用 して頂く事を強く勧めています しかし、そのままだと半透明オブジェクトにDOFがかからない。これを回避するために、 r.Translucency.AutoBeforeDOFという機能があります. DOFの設定とオブジェクトの距離を見て、ボケる範囲オブジェクトが来たら自動的にそのオブ ジェクトをBeforeDOFとしてレンダリングしてくれる機能です After DOFに設定されたオブジェクトも ボケる範囲にいくと自動的にBefore DOFに
半透明描画 半透明リアルタイムレンダリングの大きな壁 1. 描画負荷 2. 描画順序 3. デプスを描画しない 色々な手法で改善を試みているが、 万能策はなく、工夫したり、 一部を諦めたりしながら運用する必要があるかもしれません...
半透明描画 半透明リアルタイムレンダリングの大きな壁 上記で簡単に説明した半透明の描画問題について非常によくまとまっています TranslucencyとDOFとDistortionとPPMの描画優先問題について 是非参考にしてみてください！
BasePass 不透明/Masked オブジェクト描画 ライティング 半透明描画 Post Process + UpScale
UE5 Official Document: ポストプロセスエフェクト BasePass 不透明/Masked オブジェクト描画 ライティング G-Buffer 半透明描画 Post Process + UpScale
ポストプロセス前の状態
ポストプロセスにより様々な処理がかかり 最終的な絵になる
Unreal Engineのポストプロセスの処理順は 基本的にはソースコード内で定義されており 順序は固定されています
いまここ ポストプロセス前からどう絵が変わっていくかみていく
いまここ
いまここ
いまここ
UE5 Official Document: ポストプロセスエフェクト 独自のポストエフェクトはかけられないの？ いえ、勿論かけれます
UE5 Official Document: ポストプロセスマテリアル Post Process Post Process Material 独自のポストプロセスマテリアルを作成することで幅広い表現が可能
UE5 Official Document: ポストプロセスマテリアル Post Process Post Process Material 独自のポストプロセスマテリアル Blendable Locationでどこのパスの間に そのポストプロセスを入れるかを指定できます
UE5 Official Document: ポストプロセスマテリアル Post Process Post Process Material アニメ調・スタイライズド表現で特に重宝されています 日本のコミュニティで重宝されている二種類のポストエフェクトを紹介します Stylized PostProcess for Unreal Engine 5 PPLineDrawing
3D人さん(@ymt3d)による Stylized PostProcess for Unreal Engine 5 機能紹介とv2.0への展望
Alweiさん(@aizen76)による UE5 初心者・入門者向けPPLineDrawing導入手順
UE5.5 リリースノート Post Process Tips: 5.5よりマルチパスポストプロセスも可能に ポストプロセスマテリアル単体では困難だった表現が可能に
UE5 Official Document: ポストプロセスエフェクト Post Process - Upscale
Official Document: テンポラルスーパー解像度 Temporal Super Resolution (TSR) ● ● 低解像度のレンダリングを行いつつ、 過去の複数フレームを参照して アップスケールする手法 計算するピクセル量を減らすので、 Nanite/Lumen含めた多くの処理負荷を劇的に下げる
Official Document: テンポラルスーパー解像度 Native 4Kそのままレンダリング 57.33ms TSR使用 1080pでレンダリングして4Kに 26.08ms
Official Document: テンポラルスーパー解像度 Upscale TSRの注意点 ターゲットの高解像度に達する(収束する)ために、十分なサンプルを集める必要がある 100% ターゲット 高解像度 100%のターゲット解像度でレンダリングしたら、アップスケールも不要 そのまま100%の画像を出力すれば良い
Official Document: テンポラルスーパー解像度 Upscale TSRの注意点 ターゲットの高解像度に達する(収束する)ために、十分なサンプルを集める必要がある 70% 70% 内部解像度が低くなるにつれ、必要なフレームが増える ターゲット 高解像度
Official Document: テンポラルスーパー解像度 Upscale TSRの注意点 ターゲットの高解像度に達する(収束する)ために、十分なサンプルを集める必要がある 50% 50% 50% 50% 内部解像度が低くなるにつれ、必要なフレームが増える ターゲット 高解像度
Official Document: テンポラルスーパー解像度 TSRの注意点 ターゲットの高解像度に達する(収束する)ために、十分なサンプルを集める必要がある ．．． 50% 50% 60fps -> 30fpsになると、収束する時間も倍になる ターゲット 高解像度
Upscale TSRの注意点 参考動画URL X(Twitter)に飛びます 内部解像度が低かったり、フレームレートが遅い中で画面が大きく動くとボケやすい
Official Document: テンポラルスーパー解像度 Upscale TSRの注意点 ターゲットの高解像度に達する(収束する)ために、十分なサンプルを集める必要がある ．．． 50% 50% ターゲット 高解像度 描画関係ない部分で処理落ちが起きても、TSRの収束に時間がかかるため絵がブレる場合がある
Upscale TSR の収束時間のチェック ● UE5公式ドキュメントに色々な条件での 収束までの時間など細かく記載 ● stat tsrコマンド ● ● stat unitと同時使用で表示 TSRのチラツキや遅延などに対する指標となる
Upscale Tips: GPUベンダーから出ているplugin AMD FSR Nvidia DLSS GPUが固定されている場合は、こちらを使うのも十分妥当な手法と思われます 是非試してみてください
BasePass 完成！ 不透明/Masked オブジェクト描画 ライティング 半透明描画 Post Process + UpScale ざっくりとでしたが、UE5のレンダリングフローの 基礎となる部分を紹介していきました
● UE5.5で用意している レンダリング手法 ディファードレンダリング ● ○ オブジェクト描画(BasePass) ○ ライティング ○ 半透明描画 ○ ポストエフェクト ○ アップスケール まとめ ● Agenda
BasePass 不透明/Masked オブジェクト描画 ライティング 半透明描画 大枠の４つのパスについて話していきました 基本的なレンダリングフロー、 そして各フローの特徴をとらえて頂ければ幸いです Post Process + UpScale
Ambient Occlusion? UI? Fog? Tonemapper? Animation? Decal? まだまだ話してないことがある... だけど既に300ページ近くに達してしまいました... これらは、また追加資料として出したいと思います
Thank you! ばってん少女隊とUnreal Engineを 今後ともよろしくお願いいたします