『Hi-Fi RUSH』開発事例 グラフィックスと最適化紹介【UNREAL FEST 2023 TOKYO】

『Hi-Fi RUSH』開発事例 グラフィックスと最適化紹介 Tango Gameworks（ゼニマックス・アジア(株)）田中康介 Tango Gameworks（ゼニマックス・アジア(株)）駒田喬

自己紹介 田中 康介 ● 2011年にTango Gameworksにプログラマーとして入社。 ● 『サイコブレイク』ではVFX, 『サイコブレイク2』ではグラフィックスを担当。 ● 『Hi-Fi RUSH』ではリードグラフィックスプログラマーとしてグラフィックス 全般を担当。 2

自己紹介 駒田 喬 グラフィックス担当、物理とアニメーションも担当 CEDEC2022 Ghostwire: Tokyoの表現を支える プロシージャルアニメーション 3

目次 ゲームの紹介 描画パイプライン紹介 描画パイプライン (Base Passまで) 描画パイプライン (Lighting Passまで) 描画パイプライン (Toon Post Process Pass前まで) 描画パイプライン (Toon Post Process Pass) 描画パイプラインまとめ GPU物理シミュレーション まとめ プログラマー視点のグラフィックス紹介。 この中辛少し辛めかもしれないです。 4

ゲームの紹介 ゲームの紹介 描画パイプライン紹介 描画パイプライン (Base Passまで) 描画パイプライン (Lighting Passまで) 描画パイプライン (Toon Post Process Pass前まで) 描画パイプライン (Toon Post Process Pass) 描画パイプラインまとめ GPU物理シミュレーション まとめ 5

Hi-Fi RUSH特徴 (トゥーン表現) キャラ、背景、全世界が独自トゥーン表現 6

Hi-Fi RUSH特徴 (60FPS) 60FPSリズムアクションゲーム 7

Hi-Fi RUSH特徴 (Gen9ターゲット) Xbox Series S, Xbox Series XのGen9世代が開発ターゲット。 新しいハードウェアで新しいトゥーン表現が目標。 60FPSで動くGen 9トゥーンレンダリングのゲーム。 8

Hi-Fi RUSH特徴 (Native解像度) シャープ、クリーン、カラフルがキーワード。 Gen9コンソールでNative解像度がターゲット。 PC版はオプション機能としてSuper Resolutionにも対応。 目標解像度は Xbox Series S 1440P Xbox Series X 4K 9

Hi-Fi RUSH特徴 (Native解像度) 60FPS、Native解像度の目標は達成。 XboxではDynamic Resolutionを保険として有効。 Gen9のNative解像度を頑張った結果 幅広いスペックのPCで60FPSで動作可能。 Steam Deckでも60FPSで遊べます。 10

Hi-Fi RUSH特徴 (UE4) Unreal Engine 4を使用。 Hi-Fi RUSHの完全トゥーン調グラフィックスの為にエンジン改造。 UE4 4.27.2が最終バージョン。 11

Hi-Fi RUSH特徴 (UE4) パフォーマンス重視だけどビジュアルにもこだわりたかった今作が Deferred Toon Renderingでどのようにして目標を実現できたかをお 伝えできればと思います。 12

Digital Foundry Review 冒険的なトゥーン表現 固い60 FPS Xbox Series S 1440p https://www.youtube.com/watch?v=8qppoWhanwk&t=503s Xbox Series X 4K 高評価！ https://www.youtube.com/watch?v=8qppoWhanwk 13

• https://www.youtube.com/watch?v=8qppoWhanwk&t=503s
• https://www.youtube.com/watch?v=8qppoWhanwk

描画パイプライン (Base Passまで) ゲームの紹介 描画パイプライン紹介 描画パイプライン (Base Passまで) 描画パイプライン (Lighting Passまで) 描画パイプライン (Toon Post Process Pass前まで) 描画パイプライン (Toon Post Process Pass) 描画パイプラインまとめ GPU物理シミュレーション まとめ 14

描画パイプライン概要 UE4 標準のDeferred Renderingの描画パイプラインを拡張。 ・描画パスを追加することで独自Deferred Toon Renderingを実装。 ・UE4の良い箇所はスタイライズして利用。 ・UE4の重い箇所は自前描画パスを追加して代替機能を実装。 15

描画パイプライン概要 (対応３D描画機能) 描画パイプラインでは様々な3D描画機能に対応。 ● Forward Light, Decal LightなどのToon用Light ● Dynamic Shadow Map ● Static Shadow Map ● Capsule Shadow ● AO Volume Shadow ● Probeベース Diffuse Global Illumination ● Screen Space Ambient Occlusion ● Screen Space Reflection ● Post Process Outline ● Volumeベースの空間Post Process Toon Shading 16

描画パイプライン概要 (対応３D描画機能) 今回は紹介できないですが、以下の3D描画機能にも対応。 ● Volumetric Fog ● Camera Motion Blur ● Toon Motion Blur ● Tone Map ● Bloom ● Lens Flare 17

エンジン改造方針 マージ問題やプラグイン互換性問題 を考える。 方針は ・既存ソースコードの変更は最小限に。 ・なるべく新規ソースコードに新規パスを追加する。 ・必須ではない改造は行わない。 18

描画パイプライン (Base Passまで) ゲームの紹介 描画パイプライン紹介 描画パイプライン (Base Passまで) 描画パイプライン (Lighting Passまで) 描画パイプライン (Toon Post Process Pass前まで) 描画パイプライン (Toon Post Process Pass) 描画パイプラインまとめ GPU物理シミュレーション まとめ 19

とある１フレームのGPU Capture PIX on Windowsでとある1フレームのGPUキャプチャーを用意。 20

このシーンをキャプチャー 21

Timelineで生成される描画バッファ 22

Depth Prepass シーン全体の深度バッファをまず生成。 DBuffer Decalを使用しているため有効になっているUE4標準パス。 23

Depth Prepass (描画結果) 24

Shadow Pass UE4標準の影描画パス。 Dynamic Shadow有効ライトごとにShadow Depth Textureを生成。 影OnlyライトのSpotLight動的影や並行光源のCascade Shadow Mapを描画。 25

影OnlyLight 動的影 SpotLightの影などは専用影LightActorを用意。 影描画はそのActorを配置することでのみ使用可能。 処理負荷に余裕があり、配置が効果的な場合のみ影LightActorは使用可能。 26

影有りLightの使用には注意！ 27

Shadow Pass (描画結果) 28

Shadow Pass (最終描画結果) 29

Base Pass Material Editorで作成した多くのMaterialをこのパスで描画。 UE4 Deferred RendererのGeometry Passに相当する重要なパス。 30

Base Passの役割 本作でのBase Passの大きな役割は２つ。 ・Deferred Toon Renderer用GBufferを作成。 ・Forward Lighting処理のToonのLit/Shade決定とForward Lightによるライ ティング。 31

Base Pass GBuffer出力に関して 標準的GBuffer構成のGBufferA, B, CのRGBA8 Buffer３枚を使用。 処理負荷の増加を考え、Bufferは増やさず、GBufferのChannel用途変更を選択。 32

GBufferの内容 GBufferA R8G8B8A8 GBufferC R8G8B8A8 GBufferB R8G8B8A8 R World Normal X R Base Color R R Metallic (0固定) G World Normal Y G Base Color G G Specular (用途変更) B World Normal Z B Base Color B B Roughness A PerObjectGBuffe rData A GBufferAO (用途変更) A ShadingModelID+SelectiveOutputMask SSRを使用しているため、Roughnessは使用済み。 トゥーンではMetallicとSpecularは不要。GBufferAOも不要。 修正箇所が少なそうなSpecularとGBufferAOを用途変更して使用。 33

Custom Stencil UE4のCustom StencilをPost Process Material内での処理のために8-bitフ ルに活用。 Custom Stencilの問題点は専用Custom Stencil描画パスによる処理負荷の増 加。 34

GBuffer Stencil GBufferの用途変更 = GBuffer Stencil GBuffer Stencilは処理負荷増加を避けた軽量Stencil Bit。 Material単位に処理負荷を気にせずに使用。 GBufferを持たないUnlitやTranslucentマテリアルでは使用できない。 このようなマテリアルはToon処理対象外なので問題にはならなかった。 GBuffer Stencil > Custom Stencil (処理負荷の軽さでは) 35

GBuffer Stencil (GBufferAO) // GBUFFERAO GBUFFER STENCIL BITS #define HBK_AO_STENCIL_CHARACTER_MASK #define HBK_AO_STENCIL_SKIP_NORMAL_OUTLINE #define HBK_AO_STENCIL_SKIP_DEPTH_OUTLINE 4 16 32 ・CHARACTER_MASKはキャラ判別に使用。 ・ SKIP_NORMAL_OUTLINE, SKIP_DEPTH_OUTLINEはPost Process Outlineの処理スキップに使用。 36

GBuffer Stencil (Specular) // SPECULAR GBUFFER STENCIL BITS #define HBK_SPECULAR_STENCIL_SKIP_SHADOW_MAIN #define HBK_SPECULAR_STENCIL_SKIP_SHADOW_2 #define HBK_SPECULAR_STENCIL_SKIP_SHADOW_3 #define HBK_SPECULAR_STENCIL_SKIP_SHADOW_4 #define HBK_SPECULAR_STENCIL_ENV_SKIP_AMBIENT_CUBEMAP #define HBK_SPECULAR_STENCIL_ENV_SKIP_STATIC_SHADOWMAP #define HBK_SPECULAR_STENCIL_ENV_SKIP_SSAO 1 2 4 8 16 32 64 STENCIL_SKIP_SHADOW系フラグは並行光源影や影OnlyLightの適用をSkip に使用。 Ambient Cubemap, Static Shadow Map, SSAOなどは各種ライティング効果 の適用Skipに使用。 37

Base Pass (Forward Lighting) Base Passの段階でForward Lightingも計算。 Base Passはエンジン改造が不要なので、ライティングの試行錯誤が行い やすい。 38

Base Pass (Lit/Shade決定) Lit Color = Base Color ToonのLit/Shade状態はBase Passで計算。 Lit ColorはGBufferのBase Colorに格納。 Shadow ColorはIsShadeMaskフラグをGBuffer Stencilに格納、実際の Shadow ColorはDeferredで後続パスで決定。 39

Base Pass (Forward Lighting) 上のシーンではForward LightのCutout機能を使用。 専用Forward Light Actorを配置してシーンをライティング。 40

Base Pass (Forward Lighting) Lit Color = Base Color Forward Lightの計算結果はGBufferのBase Colorに格納。 この事で問題が発生しましたが、GBufferは太くせず、GBuffer Stencil を使用して対応。 41

生成バッファ（Base Passまで） Base Passが終わりDeferred RendererのGeometry Passまでが完了。 42

描画パイプライン (Lighting Passまで) ゲームの紹介 描画パイプライン紹介 描画パイプライン (Base Passまで) 描画パイプライン (Lighting Passまで) 描画パイプライン (Toon Post Process Pass前まで) 描画パイプライン (Toon Post Process Pass) 描画パイプラインまとめ GPU物理シミュレーション まとめ 43

Ambient Occlusion Pass UE4標準のSSAOを描画。 44

Ambient Occlusion Pass (描画結果) 45

Ambient Occlusion Pass (最終描画結果) 46

Ambient Occlusion Pass (最終描画結果) 47

Capsule Shadow Pass UE4標準のCapsule Shadowを描画。 48

Capsule Shadow (キャラ影利用) 動的影 Capsule Shadowを影として使用することでNPC, Partner, 敵キャラに常にどの場 面でも影を落とせています。 Capsule Shadowの処理負荷は軽い。 49

Capsule Shadowは処理負荷が軽い！ 50

Capsule Shadow (カメラ角度変更) 51

Capsule Shadow Pass (描画結果) 52

Capsule Shadow Pass (最終描画結果) 53

World Volume Lighting Pass World Volume Lightingパスは新規に追加した描画パス。 UE4のVolumetric Lightmapを改造したProbeベースのGIパス。 54

World Volume Lighting Pass (説明) 通常のVolumetric Lightmapだとレベル単位にベイク。 Actor単位にベイクできるように改造。 55

World Volume Lighting (使用方法) １） 2） １）World Volume Lighting Volumeを配置。 ２）独自メニュからベイクを開始。 配置Volumeの空間限定でVolumetric Lightmapがベイクされ、 VolumeにVolumetric LightmapのIndirection TextureとBrick 3D Texture Dataを保存。 56

World Volume Lighting (利点) Volume範囲内でVolumetric Lightmapをベイクするので、ベイクが高速。 データも球面調和のAmbient情報のみが保存されるように改造したため、 軽量。 VolumeのBox GeometryでDeferredで描画するため描画も高速。 57

ProbeのDebug Visualization 58

World Volume Lighting Pass (描画結果) 59

World Volume Lighting (最終描画結果) 60

AO Volume Pass AO Volumeパスは新規で追加した描画パス。 61

AO Volume Pass (描画結果) 62

AO Volume Pass (最終描画結果) 63

Lighting Pass UE4の標準Deferred RenderingのShading Pass。 このパスでは独自Deferred Lightの描画と、影OnlyLightのタイプ情報を描画。 64

32-bit HDR 64-bit HDR Scene Color r.SceneColorFormat 32-bit HDR Scene Color Dynamic Rangeの精度的に問題はなく、スペックが低いプラットフォームほど 有効な高速化。 ただしR11G11B10形式なので、Alpha Channelがない。 65

Lighting Pass (64-bit RT準備) 32-bit Scene Color 64-bit Lighting Buffer 新規追加独自描画パスで32-bit HDRのSceneColorを64-bit HDRの新 Lighting Bufferにコピー。 66

Lighting Pass (Shadow Projection) 続いて影有りライトの場合、UE4標準パスのShadow Projectionパスを 実行。 67

Lighting Pass (Shadow Projection) 今回のシーンですとPlayer影の影OnlyLightのShadow Mask Texture を描画。 68