UE5の最新グラフィクスを使いこなすためのN個の勘所 | EGC2024 (Yutaro Sawada & Nori Shinoyama)

Unreal Engine 5 の最新グラフィクスを使 いこなすためのN個の勘所 Epic Games Japan Developer Relations Lead 篠山範明 Epic Games Japan Developer Relations Engineer 澤田 祐太朗

Introduction Unreal Engine 5に対して高まる期待 ● ● ● ● 無限のポリゴン数を高速に表示できて！ ただライトを置くだけでリアルなライティングが可能！ Megascansの様々なアセットを無料で自由に使えて！ プロシージャルからオープンワールドの仕組みもあって！ UEを使えば思い描いたハイクオリティなグラフィクス、シーンが作れる！

その一方で... こんな意見も....

草がない

葉もない

草も葉も。。ある！

草も葉も。。ある！ けど。。。。

キャラクタの映り込みが。。。黒い

建物に入れない

Unreal Engine 5の 各種機能を用いて 自由に作った

Unreal Engine 5の 各種機能の 得手不得手を理解し 得意な部分を最大限 活かして作成した

Unreal Engine 5に対する 漠然とした期待値 Unreal Engine 5 に対する期待値

本セッションのコンセプト ● UE5のグラフィクス技術の 得意な所と不得手な所を知り ● 漠然な期待値の境界線を ある程度はっきりさせる Unreal Engine 5 に対する期待値

免責事項 境界線のイメージを持って頂くために、 どうしても 「これはできません」 「これは難しいです」 というような話がでてしまいます が、UE5を否定してるわけではありません！ 得意な点を理解し活用してもらうためにも、 現状の限界をお話するだけです UE5は物凄いスピードで進化してます 来年には今回の制限の多くが解消されてるかもしれません! Unreal Engine 5 に対する期待値

● Agenda ● ● 篠山 ○ Introduction - UE5の最新Graphics技術 ○ 勘所: 複数フレーム処理 ○ 勘所: 仮想化とストリーミング ○ 勘所: 既存アセットの流用 澤田 ○ 勘所: 影について ○ すぐに使える設定&Tips集 まとめ

勘所: 複数フレーム処理 Temporal / Progressive 処理

4K? 8K? 求められる高解像度

複数フレーム処理 Temporal Super Resolution (TSR)

Native 4Kそのままレンダリング 57.33ms TSR使用 1080pでレンダリングして4Kに 26.08ms

複数フレーム処理 Temporal Super Resolution (TSR) ● ● 低解像度のレンダリングを行いつつ、 過去の複数フレームを参照してアップスケールする手法 計算するピクセル量を減らすので、 Nanite/Lumen含めた多くの処理負荷を劇的に下げる

複数フレーム処理 TSRの注意点 ターゲットの高解像度に達する(収束する)ために、十分なサンプルを集める必要がある 100% 100%のターゲット解像度でレンダリングしたら、アップスケールも不要 そのまま100%の画像を出力すれば良い ターゲット 高解像度

複数フレーム処理 TSRの注意点 ターゲットの高解像度に達する(収束する)ために、十分なサンプルを集める必要がある 70% 70% 内部解像度が低くなるにつれ、必要なフレームが増える ターゲット 高解像度

複数フレーム処理 TSRの注意点 ターゲットの高解像度に達する(収束する)ために、十分なサンプルを集める必要がある 50% 50% 50% 50% 内部解像度が低くなるにつれ、必要なフレームが増える ターゲット 高解像度

複数フレーム処理 TSRの注意点 ターゲットの高解像度に達する(収束する)ために、十分なサンプルを集める必要がある ．．． 50% 50% 60fps -> 30fpsになると、収束する時間も倍になる ターゲット 高解像度

複数フレーム処理 TSRの注意点 内部解像度が低かったり、フレームレートが遅い中で画面が大きく動くとボケやすい https://twitter.com/tempkinder/status/1639482361871216645

• https://twitter.com/tempkinder/status/1639482361871216645

複数フレーム処理 TSRの注意点 ターゲットの高解像度に達する(収束する)ために、十分なサンプルを集める必要がある ．．． 50% 50% ターゲット 高解像度 描画関係ない部分で処理落ちが起きても 、TSRの収束に時間がかかるため 絵がブレる場合がある

複数フレーム処理 TSR の収束時間のチェック ● UE5公式ドキュメントに色々な条件での 収束までの時間など細かく記載 ● stat tsrコマンド ● ● stat unitと同時使用で表示 TSRのチラツキや遅延などに対する指標となる

● Agenda ● ● 篠山 ○ Introduction - UE5の最新Graphics技術 ○ 勘所: 複数フレーム処理 ○ 勘所: 仮想化とストリーミング ○ 勘所: 既存アセットの流用 澤田 ○ 勘所: 影について ○ すぐに使える設定&Tips集 まとめ

勘所: 仮想化とストリーミング Virtualization and Streaming

勘所1: 仮想化とストリーミング Nanite = 仮想化ジオメトリ (Virtualized Geometry) ● 高精細なオブジェクトは... ● ● ● データサイズが非常に大きくメモリにのらない ポリゴン数が多くレンダリングに時間がかかる 部分的なオブジェクトの詳細をストリーミングしている

https://twitter.com/tempkinder/status/1518946168222273536

• https://twitter.com/tempkinder/status/1518946168222273536

勘所1: 仮想化とストリーミング NaniteはVirtual Textureと同等の制約を持つ カメラカットが急に切り替わると、 Naniteのストリーミングが間に合わない https://twitter.com/tempkinder/status/1525300653051875328

• https://twitter.com/tempkinder/status/1525300653051875328

勘所1: 仮想化とストリーミング 対策: Cinematic Prestreaming ● カットシーンなど、 事前にシーンが決まっている場合 ● ● 事前に、どんな NaniteやVirtual Textureを 読み込むかをレコードし保存する 実際のSequencer再生時にはそのデータを 読み込むことで、遅延を 0にすることができて る

勘所: 仮想化とストリーミング まとめ ● 大きなデータサイズのオブジェクトを一定のメモリにおさめる ために、データの仮想化技術を使って Virtual textureや Naniteはできています ● それらは高速ストリーミングにて読み込まれるため、カメラが 急速に移動するとストリーミングが間に合わず低解像度のオ ブジェクトが見える場合があります ● カットシーンなどは解決策を用意しましたっ ただし、テレポートなど瞬時に切り替わることには未対応で、 フェイドインなどの対策が必要です

● Agenda ● ● 篠山 ○ Introduction - UE5の最新Graphics技術 ○ 勘所: 複数フレーム処理 ○ 勘所: 仮想化とストリーミング ○ 勘所: 既存アセットの流用 澤田 ○ 勘所: 影について ○ すぐに使える設定&Tips集 まとめ

勘所: 既存アセットの活用 Megascans / Marketplace

Quixel Megascans

既存アセットが有料無料で沢山使える！ これでシーンを自由に構築だ！ ↓ なんか描画が変... 処理負荷めちゃくちゃ重たくなる...

モジュラーアセット vs Lumen Card

既存アセットの活用 モジュラーアセット モジュラーアセット: 建物などを一体で作らず、パーツに分解し、それを組み立てオブ ジェクトを作成する

既存アセットの活用 Lumen Card LumenはGIを計算するために各オブジェクトを覆うLumen Cardを作成する

既存アセットの活用 Lumen Card LumenはGIを計算するために各オブジェクトを覆うLumen Cardを作成する City Sample の Lumen Card

既存アセットの活用 Lumen Card ● 一体でシーンを作ってしまうと、 Lumen Cardが詳細な形を捉えられ ないので、計算できない部分が増え てしまい不正確なGIとなってしまう ● ピンク部分は Lumenが計算できない 部分

既存アセットの活用 Lumen: モジュラーアセット vs Lumen Card ● 基本ルール ● Lumenを正しく動かすために、モジュラーアセットを活用しましょう

既存アセットの活用 モジュラーアセット vs Lumen Card ● モジュラーアセット多すぎるとLumenの計算量増大してしまう問題

既存アセットの活用 モジュラーアセット vs Lumen Card ● RayTracingGroup IDでLumenカードをひとまとめにしてくれる https://twitter.com/tempkinder/status/1590365740859011074

• https://twitter.com/tempkinder/status/1590365740859011074

既存アセットの活用 モジュラーアセット vs Lumen Card ● 各モジュールアセットのRayTracingGroupIDを同一にすることで、カードを一つにま とめてくれます。処理負荷やメモリ消費量を激変させます

既存アセットの活用 モジュラーアセット vs Lumen Card ● 建物一体でカードを作ると Lumenが計算できない部分が発生するんじゃなかったの？ VS 矛盾

建物に入れない

既存アセットの活用 モジュラーアセット vs Lumen Card ● 現状、この２つを同時に満たすようなシステムはない。 外壁と内壁を分けるなど工夫が必要と思われます VS

勘所3: 既存アセットの活用 まとめ ● Unreal EngineではMegascansを筆頭に無料 で 使える大量のアセットがあります ● ただし、そのアセットがそのまま活用できるかは わかりません ● 処理負荷が過剰にかかったり、正しい結果が得 られない場合もあります ● 想定シーンと使用したい技術を吟味し、 最初に相性を確認することをお勧めします

● Agenda ● ● 篠山 ○ Introduction - UE5の最新Graphics技術 ○ 勘所: 複数フレーム処理 ○ 勘所: 仮想化とストリーミング ○ 勘所: 既存アセットの流用 澤田 ○ 勘所: 影について ○ すぐに使える設定&Tips集 まとめ

勘所: 影について

UE5から追加されたVirtual Shadow Maps

注意点 - デフォルト設定 UE4からUE5に移行した場合 UE5で新規作成した場合 Shadow Maps Virtual Shadow Maps

2つの設定 r.Shadow.Virtual.Enable : 1でVirtual Shadow Maps、0だとShadow Maps

大きな違い Shadow Maps ・UE4からの手法 ・ライトやメッシュの可動性によって 様々な手法で影を表現 ・静的ライティング等の 組み合わせが可能 ・セットアップにもよるが比較的軽量 Virtual Shadow Maps ・Virtual Textureの技術を活用し 広域かつ高品質な影を表現可能 ・効率的にキャッシュシステムを 活用した場合非常に高速 ・メモリ消費量は多くなりがち

VSMの活用

Virtual Shadow Mapsの概要 必要な場所に必要な解像度のTextureを利用するVirtual Textureを応用 高解像Shadow Mapを利用 Page 128 × 128

VSM全体で行われているPage管理 すべてのライトのShadow Mapsが単一のプールで管理される ※Separate Static Shadowの場合2つのプール Texture2DArray:

VSMのキャッシュ 青い部分が更新Pages (Invalidated) (デフォルト:r.Shadow.Virtual.Cache 1) 動かないものが少なければ、ほぼStaticなShadowに

VSMの処理負荷やメモリ対策 1. ライト毎に必要とされるページ数を減らす コンソールコマンドにてBias調整 r.Shadow.Virtual.ResolutionLodBiasLocal r.Shadow.Virtual.ResolutionLodBiasDirectional 2. 常に画面上すべてのモノが動くとキャッシュが効かない → 画面全域に映る草などは VSMから除外しContact Shadowで描画 (スクリーンスペースベースのShadow)

VSMの挙動や設定について Unreal Engine 5 における レンダリング & デバッグTips https://www.docswell.com/s/EpicGamesJapan/5Q8Q67-2023-12-21-185240

• https://www.docswell.com/s/EpicGamesJapan/5Q8Q67-2023-12-21-185240

すぐに使える設定&Tips集 Unreal Engine 5 Tips

Lumenの調整方法

Lumenの基本の最適化 基本は、スケーラビリティの設定 ・[Cinematic (シネマティック)] ムービー レンダー キュー用設定 ・[Epic] 30 fps コンソール向け設定 ・[High (高)] 60 fps コンソール向け設定 ・[Low (低)] および [Medium (中)] Lumen 機能が無効になる

プリセットの中身について \Engine\Config\BaseScalability.ini

Lumenのその他最適化 アセット側で可能な対応としては... Lumenカードの描画負荷を下げる事が必要に ・Static Meshを可能な限りNanite化 ・Lumenカードをマージ ・Lumenカードの解像度が下がるように調整

Lumenカードの可視化 r.Lumen.Visualize.CardPlacement 1

Lumenカードのマージ

Lumen - Cardのマージの効果 r.LumenScene.SurfaceCache.MeshCardsMergeComponents 0 r.LumenScene.SurfaceCache.MeshCardsMergeComponents 1 ゲーム実行中に r.LumenScene.DumpStats 1

r.LumenScene.DumpStats ゲーム実行中に r.LumenScene.DumpStats 1 オプション 1 : 基本情報の出力 2 : Distance Field AtlasのDump 3 : Lumen Sceneのグループ設定を含むプリミティブリストを出力

Lumenカードの解像度 ミラーマテリアルを床に割り当て、スクリーントレースをオフにした状態

FLumenSurfaceCacheUpdateMeshCardsTask 最大1024の解像度で動的に変更される ・設定できる値 CardMinResolution以下が要求されると真っ黒に(デフォルト:4) r.LumenScene.SurfaceCache.CardMinResolution カードのOBBのサイズ(XまたはYの最大値)と距離に応じたスケール(デフォルト:100) r.LumenScene.SurfaceCache.CardTexelDensityScale カードのOBBのサイズ(XまたはYの最大値)に応じたMax値を求める係数(デフォルト:0.2) r.LumenScene.SurfaceCache.CardMaxTexelDensity 遠くでも描画したい場合はTexelDensityを両方を上げる 逆に軽量化したい場合は両方を下げる

Lumenの最適化 基本は、スケーラビリティの設定 アセット側で可能な対応としては... Lumenカードの描画負荷を下げる事が必要に ・Static Meshを可能な限りNanite化 ・Lumenカードをマージ ・Lumenカードの解像度が下がるように調整

Naniteの調整方法

様々なマテリアルに対応しましたが... 実情としてMaskedなどは非常に重く、 特に60fpsを目指す場合は不透明(Opaque)描画が好ましい 弊社タイトルでも樹木は、ポリゴンで葉を作り不透明で描画 https://www.unrealengine.com/ja/tech-blog/ bringing-nanite-to-fortnite-battle-royale-in-chapter-4 ※GDC2023にて公開した Electric Dream環境デモの樹木はMasked Material 全く使えない、ということではなく注意が必要

• https://www.unrealengine.com/ja/tech-blog/bringing-nanite-to-fortnite-battle-royale-in-chapter-4

NaniteのProfileGPU ・Naniteが関連してくる大きいものは... ・VisBuffer ・Shadow Depth ・Lumen (分散されるので1フレームだと大きくでない) 以下コンソールコマンドを有効化すると マテリアルごとのラスタライズ時間を確認可能 r.Nanite.ShowMeshDrawEvents 1

Naniteの最適化の指針 ・オーバードローを減らす ・Masked等 Programmable Rasterizer は最小限に

OpaqueとMaskedの比較 ・Nanite Visualization → Overdraw Maskedはラスタライズが重く、Overdrawを引き起こす

WPOを距離によって無効化 StaticMeshComponent単位でWPOを無効化する距離を設定(Disable Distance) Nanite Visualization -> Evaluate WPOでWPOが評価されるマテリアルを可視化

Naniteの表示量をコントロール Naniteがターゲットとする三角形のエッジの長さをピクセル単位で指定 r.Nanite.MaxPixelsPerEdge 1 大きい値を設定する →ピクセルあたりの詳細度が下がる →メッシュが荒くなる 小さい値(0.1など)を設定すると →ピクセルあたりの詳細度が上がる →メッシュが更に高精細に 最大PoolSizeは以下で設定 r.Nanite.Streaming.StreamingPoolSize

ハイポリなモデルの表示には有用 ・最適なクラスタ単位で描画されるため負荷に関しては緩やか(出力解像度に依存) ・Lumen、VSMなどはNaniteに最適化されている ※右図は非Nanite化した状態 LODを作れば多少最適化可能だが これをエンジンが解決してくれるのは強み

Naniteメッシュサイズの削減 Naniteメッシュは、三角ポリゴン比率を維持(Triangle Percent)と 相対誤差をトリミング(Relative Error)で調整可能 (Naniteメッシュをリダクションし、パッケージ化時のサイズを削減)

フォールバックターゲット UE5.3からフォールバックメッシュの設定にAutoが追加 デフォルト設定だとすべてのメッシュがRelative Error 1としてリダクション r.Nanite.Builder.FallbackTriangleThreshold(デフォルト値:0)で変更可能 設定Triangle数を超える場合Relative Errorを1として設定

その他Tips

Render Resource View サイズ等でソートすると大きいリソースを手軽に早期に発見できるので非常に有用

DumpGPUコマンド コマンドdumpgpuを実行することでウェブブラウザで確認できるGPU Dumpを出力 ※エディタ上の場合でもPIE実行後可能

その他リソースの最適化 最適化のために持っている複数のBufferを無効化 Reversed index buffers: r.SupportReversedIndexBuffers=False Depth only index buffers: r.SupportDepthOnlyIndexBuffers=False Initial pose, skin weights, cloth, color, …: r.FreeSkeletalMeshBuffers=1 CitySampleでは 400MB 以上のメモリ削減 専用のIndex Bufferをそれぞれ 保持することで若干の処理速度 向上を見込むもの SkeletalMeshのCPUメモリを 開放する(場合によっては必要)

● Agenda ● ● 篠山 ○ Introduction - UE5の最新Graphics技術 ○ 勘所: 複数フレーム処理 ○ 勘所: 仮想化とストリーミング ○ 勘所: 既存アセットの流用 澤田 ○ 勘所: 影について ○ すぐに使える設定&Tips集 まとめ

Unreal Engine 5の 各種機能を用いて 自由に作った

Unreal Engine 5の 各種機能の 得手不得手を理解し 得意な部分を最大限 活かして作成した

Unreal Engineの持つ機能はどれも非常に強力です ただし、万能ではなく様々な制限があります (勿論日々改善に取り組んではいますが) それらを理解して シーンやワークフローを構築することで、 各機能を最大限に活かしたグラフィクスを達成できます

Thank you!