630.4K Views
December 11, 23
スライド概要
※資料内動画にはURLを添付しましたが、本番で使用した動画を埋め込んだバージョンのパワーポイントもこちらからダウンロードできます。
https://epicgames.box.com/s/8wxsv40of98fsj79ejq2ale676f0dgp1
Unreal Engine 5 のグラフィクス技術は非常に強力です。しかしそれらは万能ではなく様々な得手不得手があります。本ドキュメントでは、UE5のグラフィクス技術の現在の苦手な部分にあえてフォーカスしそれらを勘所として説明します。癖を理解することで、苦手な部分を避けより得意な部分に注力することで、シーン全体の魅力が高まるはずです。今回はゲームだけではなく映像の方でも、UE5 を駆使してハイクオリティのグラフィクスを作りたい方たちの基礎としてお役に立てる内容になっています。是非ご覧ください。
※本ドキュメントは CECEC+KYUSHU 2023にて講演した資料を配布用に編集したものです
Unreal Engineを開発・提供しているエピック ゲームズ ジャパンによる公式アカウントです。 勉強会や配信などで行った講演資料を公開しています。 公式サイトはこちら https://www.unrealengine.com/ja/
Unreal Engine 5 の最新グラフィクス を使いこなすための4個の勘所 Epic Games Japan Developer Relations, Lead 篠山範明 2023 Private & Confidential
Agenda ● Introduction - UE5の最新Graphics技術 ● 勘所: 複数フレーム処理 ● 勘所: 仮想化とストリーミング ● 勘所: 既存アセットの流用 ● 勘所: ? ● まとめ
Unreal Engine
2020年のGDCにて Unreal Engine 5 が発表されました
Unreal Engine 5 Revealed! | Next-Gen Real-Time Demo Running on PlayStation 5
それから今に至るまで、機能の進化と共に 高クオリティなリアルタイムグラフィックスの デモを公開しています
The Matrix Awakens: An Unreal Engine 5 Experience
Electric Dreams Environment Sample Project Unreal Engine
Introduction Unreal Engine 5に対して高まる期待 ● ● ● ● 無限のポリゴン数を高速に表示できて! ただライトを置くだけでリアルなライティングが可能! Megascansの様々なアセットを無料で自由に使えて! プロシージャルからオープンワールドの仕組みもあって! UEを使えば思い描いたハイクオリティなグラフィクス、シーンが作れる!
その一方で... こんな意見も....
草がない
葉もない
草も葉も。。ある!
草も葉も。。ある! しかし、ハイスペックな環境を要求
キャラクタの映り込みが黒い
建物に入れない
Unreal Engine 5の 各種機能を用いて 自由に作った
Unreal Engine 5の 各種機能の 得手不得手を理解し 得意な部分を最大限 活かして作成した
Unreal Engine 5に対する 漠然とした期待値 Unreal Engine 5 に対する期待値
本セッションのコンセプト ● UE5のグラフィクス技術の 得意な所と不得意な所を知り ● 漠然な期待値の境界線を ある程度はっきりさせる Unreal Engine 5 に対する期待値
Introduction 本日話すこと ● 様々な開発者さまをサポートする中で得られた 「期待値とのズレが大きい部分」 「ここを抑えておけばUE5の癖がつかめそう。。。」 という点をお伝えできればと思います ● ゲームだけではなく、映像も、業界を選ばず UE5の最新グラフィクス機能を使う皆様に向けてお話します
Introduction 本日話さないこと ● プラットフォーム固有の話 ● 各業界に特化した話 ● 各種機能の具体的な操作方法
Introduction 免責事項 境界線のイメージを持って頂くために、 どうしても 「これはできません」 「これは難しいです」 というような話がでてしまいます が、UE5を否定してるわけではありません! 得意な点を理解し活用してもらうためにも、 現状の限界をお話するだけです UE5は物凄いスピードで進化してます 来年には今回の制限の多くが解消されてるかもしれません! Unreal Engine 5 に対する期待値
Agenda ● Introduction - UE5の最新Graphics技術 ● 勘所: 複数フレーム処理 ● 勘所: 仮想化とストリーミング ● 勘所: 既存アセットの流用 ● 勘所: ? ● まとめ
自己紹介 Who I am? 篠山 範明 ● Epic Games Japan, ● Developer Relations, Lead ● [email protected] ● 国際きき酒師 X(Twitter): @tempkinder ● 九州大好き人間 年に何回も九州に行きます ● 九州の好きなところを少しだけ シェアさせてください…
LIBROM ● 「日本酒文化をもっと身近に」をコンセプト に、若い世代にも親しみ愛される日本酒を造 る新進気鋭のクラフトサケ醸造所 ● 福岡県天神からすぐ近くの高砂にて醸造 ● 日本酒の製法に副原料を入れてオリジナルの クラフトサケを作る ● レモンバーベナ ● あまおうとローズマリー ● スイートコーン ● カカオ お酒が飲める方は是非! 新たなサケの美味しさを味わえます!
それは忘れもしない2022年12月某日、とあるクライアントから深夜1時に磯丸水産(門前仲町店)に呼び出される。 「やばい。これは緊急案件か。もしやこの年末年始は返上か?」とびくびくしていたら彼は開口一番こう言った 「ばってん少女隊のライブが最高過ぎて。。誰かと共有したかった」 はい?なぜ直接会うのが3回目ぐらいの自分が呼ばれたのか全くわからなかったが、彼の異常な熱気だけは伝わ ってきた。実際、彼はずっと5cmぐらい浮かんでいた気がする。ふわふわしてた。ふわふわじじぃ。そのライブ は配信もあってライブ後も見れるとのこと。早朝家に着くなり眠気を抑えながら配信を購入して観てみた アホみたいに泣きました こんなに素敵なライブあったのかと。なんじゃこのグループは。めちゃくちゃかっこいいじゃないか。和を基調 とたバキバキのダンスミュージックを奏でながらもどことなく牧歌的な雰囲気をまとう。縁側でほうじ茶飲みな がらアイドルライブを楽しんでる不思議な感覚。ももクロの妹分らしく九州を拠点に活動するアイドルだが、東 京でも中野サンプラザを満員にする。なんでいままでちゃんと聞いてこなかったのか そのライブの一曲がこちら それからはそのクライアントに導かれるがままに、ライブに行き、特典会に行き、九州に行き、台湾に行き、カ ンボジアに行きと、ばってん少女隊を応援し続けることが生活の一部に。彼女たちは九州をモチーフにしたアル バムを出すほどに九州を軸にしながらも同時に世界を駆け巡っている。この一年で、タイ、台湾、フランス、カ ンボジアと様々な国で多文化の人達を和のグルーヴで沸かせている。そしてそれと同時にフンドーキンの企業祭、 宗像の農業祭や博多どんたくなどローカルなイベントにも積極的に参加しているこのギャップ。更にテクノロジ
和とテクノロジーの融合を九州から世界に届けている ばってん少女隊 Canon様の協力による Volumetric VideoのMusic Clip Canon x Batten Girls "OiSa Volumetric Video ver." Cutting Edge Technology Virtual Performance 九州のアイドルグループ「ばってん少女隊」の 新作VRがルミエール賞VR部門グランプリを受賞 8KのVR、立体音響、AR… テックとエンタメでJEを駆けた「ばってん少女隊」 ばってん少女隊 『ヒナタベル』× 360 Reality Audio -Music Video-
Agenda ● Introduction - UE5の最新Graphics技術 ● 勘所: 複数フレーム処理 ● 勘所: 仮想化とストリーミング ● 勘所: 既存アセットの流用 ● 勘所: ? ● まとめ
勘所: 複数フレーム処理 Temporal / Progressive 処理
4Kレンダリング時代
4Kでレンダリングした画像
処理負荷を見ると10fpsほど GPUが進化してもアセットの詳細度やレンダリング技術も高まる なので、4Kをそのままレンダリングするの未だに高負荷
複数フレーム処理 Temporal Super Resolution (TSR) UE5では低解像度でレンダリングした後にアップスーリングして高解像度を生成する Temporal Super Resolution, 略してTSRが搭載されています
こちらは、TSRを使って1080pでレンダリングした後に4Kにアップスケールした画像です
4Kそのままレンダリング 57.33ms 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 内部解像度が低かったり、フレームレートが遅い中で画面が大きく動くとボケやすい
複数フレーム処理 TSRの注意点 ターゲットの高解像度に達する(収束する)ために、十分なサンプルを集める必要がある ... 50% 50% ターゲット 高解像度 ロード処理でもゲームロジックでも、描画関係ない部分で処理落ちが起きたとしても TSRの収束に時間がかかるため絵がブレる場合がある
複数フレーム処理 TSR の収束時間のチェック ● stat tsrコマンド ● stat unitと同時使用で表示 ● TSRのチラツキや遅延などに対する指標となる ● UE5公式ドキュメントに色々な条件での 収束までの時間など細かく記載
複数フレーム処理 TSRの注意点2 (発展) 過去フレームとの変化を理解するために、 各オブジェクトの速度ベクトルを正しく出力する必要がある 速度ベクトルが正しく出力されない場合、 強いゴースティング(ブレ)を引き起こす場合がある
https://youtu.be/pctLFE9sJok World Position Offsetによる回転で生じたTSRのブラー
https://youtu.be/FkEgvnhnTrQ 原因は速度ベクトルがでていないため。前後のフレームの変化を正しく捉えられない
https://youtu.be/0XNVdJeFBaA 速度ベクトルを正しく生成するようにしてみる
https://youtu.be/uUYoGtN_nh4 ゴースティングがなくなり正しい描画になる
複数フレーム処理 TSRの注意点2 (発展) Epic Developer Communityに色々なパターンを記載しました! ゴースティングが起きている方はご確認ください!
まだまだあります
複数フレーム処理 Lumen
複数フレーム処理 Lumen Algorithm 概要 各メッシュの カード形状作成 事前準備 (Editor) Lumen Sceneの構築と ライティング レイトレで GIを計算 ランタイム アップサンプリング!
複数フレーム処理 Lumen Algorithm 概要 Lumen Sceneの構築と ライティング レイトレで GIを計算 アップサンプリング! これ本当に1フレームで計算できる???
複数フレーム処理 Lumen Algorithm 概要 Lumen Sceneの構築と ライティング レイトレで GIを計算 内部の様々な処理をフレーム分散して 1フレーム内の処理を減らしている!! アップサンプリング!
複数フレームに分割するということは... だんだん、徐々に、 正しいライティングに収束していくということ
複数フレーム処理 フレーム分散による遅延例 https://twitter.com/tempkinder/status/1503976333365301248 ライティングの高速な変化に対する遅延
複数フレーム処理 フレーム分散による遅延例 https://twitter.com/tempkinder/status/1526037005364174850 カメラの切り替え時の遅延
Unreal Engine5 Lumenの仕組みと肝心なところ Docswellでこれらの詳細を記述しています。 是非ご参考にしてください
勘所: 複数フレーム処理 まとめ ● リアルタイム性を維持するためにUE5には複数フレームを利用す る処理があり、それぞれの癖を理解して使う必要がある ● Temporal Super Resolution ○ 内部解像度が低いもしくはFPSが低下すると、高解像度画像 を作成するまでに沢山の時間を要するようになり画面がボケ やすくなります ● Lumen ○ LumenのGIが伝搬するのには複数フレームが必要 LumenのGIだけでシーン全体をライティングしようとする とライトの伝搬のラグがきになる場合 EmissiveベースのライティングなどはまだExperimental
Agenda ● Introduction - UE5の最新Graphics技術 ● 勘所: 複数フレーム処理 ● 勘所: 仮想化とストリーミング ● 勘所: 既存アセットの流用 ● 勘所: ? ● まとめ
勘所: 仮想化とストリーミング Virtualization and Streaming
これはNaniteを用いてレンダリングされたメッシュです
ポリゴン表示してみると、どれだけハイポリかわかるかと思います
Naniteは一つのハイポリメッシュを高速に描画する技術ではありません。 この部屋には500体の像があり、像だけで合計160億ポリゴンを超えています
ポリゴンを表示してみます
勘所: 仮想化とストリーミング Nanite = 仮想化ジオメトリ (Virtualized Geometry) ● 高精細なオブジェクトは以下の様な問題があり、 Naniteはそれらを解決しています ● データサイズが非常に大きくメモリにのりきらない ● ポリゴン数が多くレンダリングに時間がかかる
勘所: 仮想化とストリーミング Virtual Textureの方で解説していきます https://qiita.com/EGJ-Nori_Shinoyama/items/4a2e84dd1d3448e81bed Naniteはポリゴンでデータが複雑なので、Virtual Textureで説明します。 Virtual Textureが理解できれば“NaniteはVirtual Textureのポリゴン版”と理解しやすいはずです
勘所: 仮想化とストリーミング Virtual Texture 従来のTexture Virtual Texture 通常のテクスチャは使用するためにメモリに全部読み込む必要がありました しかし、Virtual Textureでは、テクスチャを部分的に読み込むことができます
仮想化とストリーミング Virtual Texture ● 良いところ ● 実際に視界から見えている部分だけを読み込める! ● メモリ消費量を多く減らせる! ● ↓実際のVirtual Textureのメモリの視覚化
勘所: 仮想化とストリーミング Virtual Texture ● MipMapも部分的に読み込める ● 遠くの部分は荒いMipMapだけを読み込み ● 近くは詳細なMipMapを読み込む ● 消費メモリを大幅に削減できる! MipMapも部分的に読み込める
勘所: 仮想化とストリーミング Nanite ● Virtual Textureの ポリゴンオブジェクトバージョン ● オブジェクトを事前に ● クラスタ化 ● 階層化 SIGGRAPH2021 - Nanite Deep Dive より
勘所: 仮想化とストリーミング Nanite ● レンダリング時 ● 視点(ピクセル)に応じて ● 必要に応じた詳細度のクラスタを読み 込む(または破棄)することで ● メモリ消費量を一定に保ちながら高精 細なオブジェクトをレンダリングする SIGGRAPH2021 - Nanite Deep Dive より
https://twitter.com/tempkinder/status/1518946168222273536
勘所: 仮想化とストリーミング NaniteはVirtual Textureと同等の制約を持つ https://twitter.com/tempkinder/status/1525300653051875328 カメラカットが急に切り替わると、 Naniteのストリーミングが間に合わない
勘所: 仮想化とストリーミング 対策: Cinematic Prestreaming ● カットシーンが事前に決まっている場合 ● どんなNaniteやVirtual Textureを読み込むか をレコードし保存する ● 実際のSequencer再生時にはそのデータを読み 込むことで、遅延を0にすることができてる
勘所: 仮想化とストリーミング 現状: 急なカメラ移動やテレポートには未対応 ● ストリーミングの遅れにより 低解像度オブジェクトが一瞬見えて しまうことがある ● カメラの非連続的な移動 ● シーン読み込み時 ● こういった部分では、フェイドイン などの対策を取る必要があるかもし れません
勘所: 仮想化とストリーミング まとめ ● 大きなデータサイズのオブジェクトを一定のメモリにお さめるために、データの仮想化技術を使ってVirtual textureやNaniteはできています ● それらは高速ストリーミングにて読み込まれるため、カ メラが急速に移動するとストリーミングが間に合わず低 解像度のオブジェクトが見える場合があります ● カットシーンなどは解決策を用意しましたっ ただし、テレポートなど瞬時に切り替わることには未対 応で、フェイドインなどの対策が必要です
Agenda ● Introduction - UE5の最新Graphics技術 ● 勘所: 複数フレーム処理 ● 勘所: 仮想化とストリーミング ● 勘所: 既存アセットの流用 ● 勘所: ? ● まとめ
勘所3: 既存アセットの活用 Megascans / Marketplace
Quixel Megascans 2023 Private & Confidential
Megascansは高品質なオブジェクト、テクスチャ、マテリアルを提供し Unreal Engineで使用する際は全て無料となっています
https://www.youtube.com/watch?v=V4GkaeZogno&ab_channel=Quixel 今日も世界のどこかで、Quixelチームが現実のオブジェクトをスキャニングし続けています
https://youtu.be/ParMLadMTaQ?t=130 UE5のエディタに組み込まれており、ドラッグアンドドロップするだけでMegascansの高品質なアセットを直ぐに 使うことができます
既存アセットが無料で沢山使える! これでシーンを自由に構築だ!
既存アセットが無料で沢山使える! これでシーンを自由に構築だ! ↓ なんか描画が変... 処理負荷めちゃくちゃ重たくなる... 今日はその一例を
既存アセットの活用 Lumen: モジュラーアセット vs Lumen Card モジュラーアセット: 建物などを一体で作らず、パーツに分解し、それを組み立 てオブジェクトを作成する
既存アセットの活用 Lumen: モジュラーアセット vs Lumen Card LumenはGIを計算するために各オブジェクトを覆うLumen Cardを作成する
既存アセットの活用 Lumen: モジュラーアセット vs Lumen Card LumenはGIを計算するために各オブジェクトを覆うLumen Cardを作成する City Sample の Lumen Card
既存アセットの活用 Lumen: モジュラーアセット ● 一体でシーンを作ってしまうと、 Lumen Cardが詳細な形を捉えら れないので、計算できない部分が 増えてしまい不正確なGIとなって しまう ● ピンク部分はLumenが計算できない 部分 vs Lumen Card
既存アセットの活用 Lumen: モジュラーアセット vs Lumen Card ● 基本ルール ● Lumenを正しく動かすために、モジュラーアセットを活用しましょう
既存アセットの活用 Lumen: モジュラーアセット vs Lumen Card ● モジュラーアセット多すぎるとLumenの計算量増大してしまう問題
既存アセットの活用 Lumen: モジュラーアセット vs Lumen Card ● RayTracingGroup IDでLumenカードをひとまとめにしてくれる https://twitter.com/tempkinder/status/1525300653051875328
既存アセットの活用 Lumen: モジュラーアセット vs Lumen Card ● 各モジュールアセットのRayTracingGroupIDを同一にすることで、カードを 一つにまとめてくれます。処理負荷やメモリ消費量を激減させてくれます。
既存アセットの活用 Lumen: モジュラーアセット vs Lumen Card ● 建物一体でカードを作ると Lumenが計算できない部分が発生するんじゃなかったの? 矛盾
建物に入れない この制約が、City Sampleで建物に入れないようになっている要因
既存アセットの活用 Lumen: モジュラーアセット vs Lumen Card ● 現状、この2つを同時に満たすようなシステムはない。 外壁と内壁を分けるなど工夫が必要と思われます VS
Naniteの制約
既存アセットの活用 注意点: Naniteの制約 ● UE5.3現在 ● Maskedは対応しました!ただし。。処理負荷は非常に重たくなります
草がない
葉もない
じゃあ、岩とかだけはNaniteにして、 木はNaniteにしなければいいじゃん …?
既存アセットの活用 注意点: Lumen/VSMはNaniteを高速に処理できる CEDEC2022 での弊社澤田の講演より (Docswellにて公開中)
既存アセットの活用 注意点: Lumen/VSMはNaniteを高速に処理できる
既存アセットの活用 注意点: Lumen/VSMはNaniteを高速に処理できる Lumen内部での計算 非Naniteメッシュの場合 通常のポリゴンでは、Lumenはメッシュカードを一面ずつレンダリングする
既存アセットの活用 注意点: Lumen/VSMはNaniteを高速に処理できる Lumen内部での計算 Naniteメッシュの場合 Naniteメッシュでは、Lumenはメッシュカード全面を一度にレンダリングする
既存アセットの活用 Nanite/非Naniteの採用 処理負荷は気にする? NO! アート最優先だ! GPUも最強だ! Nanite/非Nanite 気にしない YES! シーン内でMaskedが多い? NO! Maskedはないよ YES! Maskedばかり! シーン内のオブジェクトをなるべく Naniteオブジェクトに Lumen/VSMも使える Lumen/VSMを使用せず、 UE4時代のレンダリングも考慮に
勘所: 既存アセットの活用 まとめ ● Unreal EngineではMegascansを筆頭に無料 で使える大量のアセットがあります ● ただし、そのアセットがそのまま活用できる かはわかりません ● 処理負荷が過剰にかかったり、正しい結果が 得られない場合もあります ● 想定シーンと使用したい技術を吟味し、 最初に相性を確認することをお勧めします
Agenda ● Introduction - UE5の最新Graphics技術 ● 勘所: 複数フレーム処理 ● 勘所: 仮想化とストリーミング ● 勘所: 既存アセットの流用 ● 勘所: ? ● まとめ
勘所: 半透明 Translucency
半透明 半透明はRealtimeレンダリングの大きな壁 ● 無限のポリゴン、動的GI… UE5になってレンダリング技術は進歩してきました ● しかし、 半透明に関してはUE4からUE5への移行で大きな進化があまりありません
半透明 半透明はRealtimeレンダリングの大きな壁 【UE4】被写界深度半透明物体共生戦略手法零式(Type-0) 9年前に書いたブログですが UIや設定の変化はあれど、今でも同様の問題があります この記事をそのまま使って説明します
Effectをシーンに置いてみる
Depthは何も書かれていない
Depth Of Fieldをかけてみる
半透明 半透明はRealtimeレンダリングの大きな壁 Depthを描画しないため Depthを用いるエフェクトで問題が起こる UE5でもまだ起こる
半透明 半透明はRealtimeレンダリングの大きな壁 ● 発展 ● 被写界深度及びTSRで生じる半透明問題を解 消するために、UE5.2から AutoBeforeDOFという仕組みが入りました ● しかし、これが逆に邪魔しちゃう場合もあり オフで運用する例も多くみれらます ● EDCに書きます!
半透明 vs UE5の機能
半透明 半透明 vs Nanite
半透明 半透明 vs Lumen ● 半透明はLumenのGIを受けることができる ● 不透明用よりも低解像度なグリッド上にデータを格納 不透明 半透明
https://twitter.com/tempkinder/status/1508358803229605888 Lumenのライティングが半透明に影響している動画
半透明 半透明 vs Lumen ● LumenScene (LumenがGIやReflectionの計算時に参照する簡易シーン)に 半透明は入れない ● 半透明はGIやReflectionに寄与できない。。半透明のEmissiveはライティングに寄与しない↓ 不透明 Emissive 半透明 Emissive
半透明 半透明 vs Lumen ● しかし、Lumenは近傍の計算を行うためにScreen Traceを行う ● Depthを見るため、半透明パーティクルだと悪さしまくる https://twitter.com/tempkinder/status/1503174649718329349
Agenda ● Introduction - UE5の最新Graphics技術 ● 勘所: 複数フレーム処理 ● 勘所: 仮想化とストリーミング ● 勘所: 既存アセットの流用 ● 勘所: 半透明 ● まとめ
Unreal Engine 5の 各種機能の 得手不得手を理解し 得意な部分を最大限 活かして作成した
Unreal Engine 5に対する 漠然とした期待値 Unreal Engine 5 に対する期待値
Unreal Engineの持つ機能はどれも非常に強力です ただし、万能ではなく様々な制限があります (勿論日々改善に取り組んではいます) それらを理解してシーンやワークフローを構築すること で、UE5の機能を最大限に活かしたグラフィクスを達成 できます Unreal Engine 5 に対する期待値
ありがとうございました! ばってん少女隊とLIBROMもよろしくお願いします! 2023 Private & Confidential