UE5制作事例 “The Market of Light” ～Nanite／Lumenへの挑戦～
89.4K Views
October 06, 21
スライド概要
2021年10月2日に行われた「出張ヒストリア！ ゲーム開発勉強会2021」にて発表させていただいたスライドです。
イベント詳細
https://historia.co.jp/archives/22783/
講演動画
https://youtu.be/gUwPnJ50rEQ
講演者：
株式会社ヒストリア 佐々木 瞬 (代表取締役 / プロデューサー / ディレクター)
株式会社ヒストリア ヒストリア・エンタープライズ 真茅 健一(アーティスト)
講演内容：
ヒストリアでは2021年9月28日(火)に Unreal Engine 5（以下、UE5） の技術デモを兼ねた短編ゲーム”The Market of Light”をSteamにて公開しました。
本タイトルはUE5の新機能である、無限のポリゴンを扱う「Nanite」、完全に動的なライティングを可能にする「Lumen」をどう活かすかを主眼において開発されました。
本セッションでは技術デモとしての見どころや、このようなコンテンツになった経緯、Naniteを前提としたワークフローへの挑戦、
そして実際にNanite・LumenおよびVirtual Shadow Mapsを使用して得た技術的知見をお話いたします。
株式会社ヒストリアは、Unreal Engine専門のソフトウェア開発会社です。ゲーム事業とエンタープライズ事業、2 つの軸でソフトウェアの企画、開発を行っています。また、Unreal Engine の学習を目的とした作品制作コンテスト『UE5ぷちコン』や、『出張ヒストリア！ ゲーム開発勉強会』を主催、技術ブログを毎週更新など、Unreal Engine コミュニティを盛り上げる活動も行っております。
関連スライド
各ページのテキスト
UE5制作事例 “The Market of Light“ ～ Nanite / Lumenへの挑戦 ～
自己紹介 株式会社ヒストリア 代表取締役 佐々木 瞬 プロデューサー / ディレクター / エンジニア ゲーム系の専門学校を企画職として卒業。その後、ゲーム のディレクターを経て、エンジニアへ転身。前職で Unreal Engine 3 を使用していた経験から、2013年 Unreal Engine 専門会社のヒストリアを設立。ゲームと エンタープライズコンテンツの両方の制作を行う。 Unreal Engine 歴 10年くらい。
※ 前提 Unreal Engine 5 はまだ早期リリース版です ※
“The Market of Light”とは ►ヒストリアより無料公開 ►9月28日Steamで公開された 技術デモゲーム ►15-30分のコンテンツ
“The Market of Light”とは Steam https://store.steampowered.com/app/1691400/The_Market_of_Light/ PV https://www.youtube.com/watch?v=SKHYaGjW8JM
制作体制 ►ヒストリアと ヒストリア・エンタープライズの共同制作 ►今年の3月ごろに、エンタープライズチー ムの「今年のデモはどうしようかね」とい うところから始まった。 ►UE5はまだ無かったが、「2021年初頭に プレビューが登場予定」と言ってたし、そ ろそろ来るでしょう、ということで、今年 はUE5デモにしようと決まった。
制作体制 佐々木 プロデューサー/ディレクター 小林 誠 PM 真茅 アートディレクター 小林 大輔 背景アーティスト 天見 背景アーティスト 千葉 カットシーン/TA 他数名 ヘルプやコリジョン設定 橘内 リードエンジニア 柳田 エンジニア VFX 主なエフェクト UI Sound UI BGM・SE 後藤 QA
コンセプトワーク
UE5すげぇ！
Naniteすげぇ！
Naniteを活かすインタラクティブコンテンツにしよう！
コンセプト１：遠くからどこまでも近づける感動 遠くから超近接まで近づける感動でNaniteの凄さを表現できないか？ →虫の視点＋探索ゲーム
すげぇ！！
過去案件で似たような経験があった ↓詳しくはこちら 【特別対談】『見たことのない文化財』ー8K映像で美しく再現された文化財の裏側を制作陣に訊く【後編】 https://historia.co.jp/archives/19738/ どこまでも寄れることに感動があった！
コンセプト１：遠くからどこまでも近づける感動 「虫の視点」＋「探索ゲーム」に決定
コンセプト２：Epicデモとは違う雰囲気 岩は技術デモで使いやすいが、雰囲気が似てしまう。 技術デモでは珍しい、明るい雰囲気にしたかった。
コンセプト３：新しいワークフローへの挑戦 アセットベース＋自作。フォトスキャンもやる。 自作アセット ＋Marketplaceアセット ＋映画用アセット
舞台設定 ►フォトスキャンしやすい野菜や果物が良い。 たくさんばらまくことで、Naniteの威力も感じられる。 ►イタリアっぽいところの市場＋テントウムシに決まった。 ► アセット合わせで、野菜が大量にあるところを探した ► 川崎の「ラ チッタデッラ」とかのイメージ ►テントウムシからホタルへ……
シナリオ設定 ►コンテンツにメッセージを込めたかった。 EpicのKite Demoに憧れがあった。
シナリオ設定 「この技術が切り替わる面白い時代を一緒に楽しもう！」 「Unreal Engine 5 という新しいオモチャを一緒に楽しもう！」
シナリオ設定 「この技術が切り替わる面白い時代を一緒に楽しもう！」 「Unreal Engine 5 という新しいオモチャを一緒に楽しもう！」 Niagara Nanite Lumen
技術デモとしての柱 ►３つの目玉新機能 ► Nanite / Lumen / Niagara ►その他、重要な要素２つ ► Virtual Texturing、Virtual Shadow Maps ►Nanite時代の新たなワークフロー
Nanite時代のワークフローへの挑戦 超ハイポリが使える ＝ 作らなきゃいけない また業界のクオリティラインが上がってしまう……
Nanite時代のワークフローへの挑戦 何もしなければただ単にコストが爆増する！
アセット制作効率化の発想 プロシージャル技術 など アセット利用 など
アセット制作効率化の発想 プロシージャル技術 など 今回はこっちの検証 アセット利用 など
Nanite時代のアセット利用（仮説） ►使えるアセットの幅が広がる ► MegascansやMarketplaceのアセットが加工コスト低く利用できる ► 映画用アセットも使用できる ►ヒーローアセットや、足りないアセットを自分たちで作る ► 使用アセットに負けないクオリティで ►アセットの上手い使い方が今後のコンテンツ制作のカギ！ ……かもしれない。
ここからはより具体的な話を真茅よりお送りします。
自己紹介 ヒストリアエンタープライズ 所属 アーティスト まかや けんいち 真茅健一 ► 建築・自動車関連・放送・バーチャルライブなどゲーム以外の案件を担当しています。
アジェンダ 1.The Market of Lightの制作事例で見る UE5の新機能 ► Nanite ► Virtual Shadow Maps ► Lumen 2.The Market of Lightの世界を 表現するためにやったこと
1.The Market of Lightの制作事例で見るUE5の新機能 Nanite
Naniteとは ZBrush のスカルプトからフォトグラメトリスキャン まで、映画品質の数百万ポリゴンのソースアートを 直接インポートし、そのアセットを数百万個設置し ても、見た目の忠実度を損なわずにリアルタイムの フレームレートを維持しているという様子を想像し てみましょう。そんなことは不可能と思いますか？ 今、これが実現します！ https://www.unrealengine.com/ja/blog/unreal-engine-5-is-now-available-in-early-access?lang=ja より引用 つまり、超ハイポリゴンを大量に扱えるようになった
超ハイポリゴンを使ってみる ►プリレンダリング用ラズベリーのモデル ►三角ポリゴン換算で一粒750万ポリゴン！
NaniteなしでUE5に配置 一箱分配置すると1FPSとほぼフリーズ状態に
Nanite化してみる ► コンテンツブラウザもしくはスタティックメッシュエディタから Naniteを有効に
Nanite化してUE5に配置 1→120FPSに！！
Naniteだから可能な物量感のあるシーン Nanite化すれば超ハイポリゴンを大量に扱えるという前提でアセットを用意することに
The Market of Lightのアセット ►Megascansのアセット ►自作アセット ►プリレンダリング用の購入アセット ►UE5内で加工したアセット ►MarketPlaceのアセット Naniteを前提としたアセットワークを行った
Megascansのアセット ► 小物など多くのアセットは Megascansを使用 ► UE5内でQuixelBridgeを使い直 接インポートできるのは便利 ► Nanite設定があるものは使用 ► 企画の段階でMegascansのア セットを多く使えるようなシー ンを設定していた
自作アセット ►ヒーローアセットとなる噴水 ►フォトグラメトリで作ったアセット ►窓、壁、屋根などの汎用アセット
噴水 ►ヒーローアセットとなるためフルスクラッチで作成
噴水 ► モデリング Maya ► スカルプト ZBrush ► テクスチャリング Substance Painter
噴水 ►Mayaでベースメッシュを作り、ZBrushでスカルプト ベースメッシュ ZBrushでスカルプトしたモデル
噴水 ► スカルプトしたHighモデルのままだとUV展開時にMayaが固まるなど取り回しが悪い ► 微妙な凹凸はノーマルマップのほうが微調整が効く ↓ Naniteがあるものの取り扱いがいい程度のポリゴン数で抑えることに UE5で使用したモデル 約38万 Triangle ベイク用Highモデル 約820万 Triangle
噴水 ► 右のモデルからSubstance Painterでベイクしてノーマルマップを作成 ► それでもこれまでのアセットと比べると非常にハイポリゴン UE5で使用したモデル 約38万 Triangle ベイク用モデル 約820万 Triangle
フォトグラメトリを使用したアセット ►野菜の大半はMegascansを使用 ►検証としてブロッコリーはフォトグラメトリで自社制作
Megascansアセットをカスタマイズ Megascansのオリジナルデータ
Megascansアセットをカスタマイズ ►ヘタがないのでZBrushで追加 + Megascansのデータ → Megascansのデータを元にZBrush でスカルプト。
Megascansアセットをカスタマイズ ►蛍目線だとさらにディティールがほしい。 野菜の表面の毛のようなものはトライコームと言います
Megascansアセットをカスタマイズ ►プロジェクト初期のルックデブではトライコームの表現にヘア を検討していたが
Megascansアセットをカスタマイズ ►Naniteメッシュのほうがはるかに描画負荷が低かった → 670万Triangleものメッシュを Naniteに ヘタにトライコームを追加
Megascansアセットをカスタマイズ ►さらにディティールを追加 → テクスチャの解像感が足りない ディティールテクスチャを追加
Megascansアセットをカスタマイズ インゲームでの見え方
プリレンダリング用アセットの使用 ►これまで ► リダクションorローポリを作ってベイク ► 最適化に手間がかかるのでなるべくMARKET PLACEのゲーム用アセットを使って いた
プリレンダリング用アセットを加工 ►4万ポリゴンもあるが面取 りしていないため寄ったと きに角が目立つ ►これまでの手法 ・リダクションorローポリを作って ベイク ・最適化に手間がかかるのでなるべく MARKET PLACEのゲーム用アセット を選ぶ
プリレンダリング用アセットを加工 ►分割してベベルをかけ118 万ポリゴンに ►ローポリを作るより遥かに 楽にクオリティアップ
プリレンダリング用アセットの使用 ►ポリゴン数30倍になったがNaniteだとFPSは変わらなかった アセットワークが変わりアセット購入の自由度が増える
UE5内で加工したアセット ► UE5のモデリングツールでテクスチャからディスプレイスメントをかけ て地面モデルを作成 ただの プレーンが手軽にハイメッシュに
マクロレンズで葉を撮影 ►蛍目線だと通常サイズのテクスチャでは解像感が足りない ►葉っぱ一枚で8k x 4K の高解像度テクスチャを作成
Naniteの制限 ►全てのメッシュをNaniteにできるわけではない https://docs.unrealengine.com/5.0/ja/RenderingFeatures/Nanite/ より引用 詳細はNaniteの公式ドキュメントを御覧ください
Naniteにできなかったアセット
Naniteにできなかったアセット ワイヤーフレーム表示にするとNaniteメッシュは見えない
Naniteにできなかったアセット 植物などMaskedのマテリアルのもの ガラスなどTranslucentマテリアルのもの メッシュのLocationを元にランダム値を返すマテリアルの機能は Nanite化されたメッシュでは機能しなくなった
Naniteにできなかったアセット NaniteのマテリアルをTwo Sidedにすると裏が表示されず表は黒くなる
Naniteにできなかったアセット 植物と透明のマテリアル以外の大半はNaniteにできた
どんなメッシュをNaniteにすればいい？ ►ハイポリだけでなくローポリアセットでもNanite化してデメ リットはない ►なるべくNaniteにしたほうが後述の ►Lumen,Virtual Shadow Mapsを使う上でも描画負荷に優しい ► 一般的に Nanite は可能な限り有効にすべきです。スタティック メッシュで Nanite を有効にすると、通常はレンダリングが高速化され、メモリとディスク領域の消費が削減されます。 引用元 Naniteのドキュメント https://docs.unrealengine.com/5.0/ja/RenderingFeatures/Nanite/ ► Nanite 以外のジオメトリの VSM へのレンダリングは、Nanite ジオメトリよりもコストが高くなります。そのため、ポリゴン数の少ないメッシュも含めて、サポートされているすべてのジオメトリ で Nanite を有効にすることをお勧めします。唯一の例外は、Nanite 仮想化ジオメトリでまだサポートされていない機能の場合です。 引用元 Virtual Shadow Mapsのドキュメント https://docs.unrealengine.com/5.0/ja/RenderingFeatures/VirtualShadowMaps/
1.The Market of Lightの制作事例で見るUE5の新機能 Virtual Shadow Maps
Virtual Shadow Mapsとは ・一貫性のある高解像度シャドウイングを実現する ために使用される新しいシャドウ マッピング方法で す。 ・仮想シャドウ マップは非常に高解像度のシャドウ マップにすぎません。現時点の実装での仮想解像度 は 16K x 16K ピクセルです。 https://docs.unrealengine.com/5.0/ja/RenderingFeatures/VirtualShadowMaps/ より引用 レイトレーシングシャドウに近い高品質のシャドウマップ
シャープかつボケた影 Virtual Shadow Maps オン
シャープかつボケた影 Virtual Shadow Maps オフ
シャープかつボケた影 Virtual Shadow Maps オン
シャープかつボケた影 Virtual Shadow Maps オフ
デフォルト設定だと寄ったときに シャドウの解像度が足りず不正な影も落ちている
Virtual Shadow Mapsの設定 ► ドキュメントによるとVirtual Shadow Mapsはデフォルトでカメラから 64cm(2^6cm)~40km(2^22)カバーしています。 ► コンソールコマンドは以下で調整できます。 r.Shadow.Virtual.Clipmap.FirstLevel 6 r.Shadow.Virtual.Clipmap.LastLevel 22 https://docs.unrealengine.com/5.0/ja/RenderingFeatures/VirtualShadowMaps/より引用 詳細はドキュメントを御覧ください
デフォルト設定だと寄ったときに r.Shadow.Virtual.Clipmap.FirstLevel 6→ 4にすることで解決 (2^6=64cm) (2^4=16cm)
サブサーフェイスが効かない Virtual Shadow Mapsをオン 透け感がなくシャドウも不正
サブサーフェイスが効かない Virtual Shadow Mapsをオフ
葉のサブサーフェイスも効かない Virtual Shadow Mapsをオン
葉のサブサーフェイスも効かない Virtual Shadow Mapsをオフ
Virtual Shadow Mapsをオンオフして使用した カットシーン、蛍目線の時はVirtual Shadow Mapsをオフにすることに
1.The Market of Lightの制作事例で見るUE5の新機能 Lumen
Lumenとは Lumen は、次世代コンソール向けに設計された Unreal Engine 5 の新しい完全に動的なグローバル イ ルミネーションおよび反射のシステムです。これは、 Unreal Engine 5 のデフォルトのグローバル イルミ ネーションおよび反射のシステムとなります。 https://docs.unrealengine.com/5.0/ja/RenderingFeatures/Lumen/ より引用 ライトビルドなしにグローバルイルミネーションが可能に
Lumen Lumen 無効
Lumen Lumen 有効
Lumen デフォルトの設定
Lumen Directional LightのIndirect Lighting Intensityを1→15に
LumenはリアルタイムGI リアルタイムGIだからできたシームレスな時間変更
LumenはマテリアルのEmissiveにも有効 ただしマテリアルが画面外に出ると効果は消える
Lumenは複数のライトのGIにも対応している ライトが増えるとベイクできない分シャドウ負荷がネックに
Virtual Shadow Mapsの負荷がネックになる Virtual Shadow Mapsが重いから影を消せば…
Virtual Shadow Mapsの負荷がネックになる 他がリアルな分シャドウをオフにするとクオリティの低下が非常に目立つ
Virtual Shadow Mapsの最適化を試す https://docs.unrealengine.com/5.0/ja/RenderingFeatures/VirtualShadowMaps/ より引用 技術的詳細はVirtual Shadow Mapsのドキュメントをご覧ください 複数のライトを1パスで描画する実験的機能がある
Shadow Depthの増加分は下がらなかった Shadow Maps Virtual Shadow Maps 1Pass Virtual Shadow Maps 1Pass 2.69ms 2.25ms 5.72ms Shadow Depth 1.93ms 6.31ms 6.33ms 合計 8.56ms 12.05ms Lights 4.62ms 蛍歩行時に加え夜もVirtual Shadow Mapsはオフにした
2.The Market of Lightの世界を 表現するためにやったこと
蛍の視点感をだすために 歩行時は蛍の視点感を出したい
蛍の視点感をだすために 飛行時より画角を広げつつレンズの歪みをいれて蛍視点を演出 r.Upscale.Panini.D 0.25 で設定した
ボケでスケール感を演出 カットシーンは蛍の小ささを感じさせるレンズボケを意識した
ボケでスケール感を演出 飛行時はボケていると散策できないためボケを切っている
ボケでスケール感を演出 ►蛍目線時にはプレイに支障がない程度に背景のみぼかした ► マクロレンズで撮るサイズのスケール感なので普通に設定すると被写界深度が浅す ぎてボケすぎる 後ろボケをいいぐらいにすると 前ボケが大きすぎてプレイ不能 r.DOF.Kernel.MaxForegroundRadius 0.025→0 にして強制的に前ボケのみ切った
最適化について ► ドキュメントは細かく説明されているものの、まだ十分な最適化情報は なくエディタに出ていない設定を探したりと描画最適化が難しかった。 ► いくつかご紹介します
大量のアセットにものすごく近づけるには ►高解像度で多数のテクスチャが必要となる
GPUメモリがすぐにあふれる ►GPUメモリがすぐいっぱいになる ►するとエディタに左上にこのログが表示される ►GPUメモリがパンクしているので動作がすごく重くなる
Virtual Textureを使用 ► 画面に見える必要な部分だけテクスチャを読み込むため、高解像度テク スチャを大量に扱える ► 詳しくはヒストリアブログでも解説しています https://historia.co.jp/archives/14062/ ► 大半のテクスチャはVTとして使用した(古代の谷もそうなっています)
Virtual Shadow Mapsの設定 ►箱庭サイズの本コンテンツでは遠方の影は不要なため r.Shadow.Virtual.Clipmap.LastLevel 22→13 (2^22≒40km) (2^13≒80m) にすることでVirtual Shadow Mapsの負荷を1.2ms削減
Lumenの設定 r.LumenScene.CardAtlasSize 4096
Lumenの設定 r.LumenScene.CardAtlasSize 1024 2.46ms削減
Lumenの設定 r.Lumen.Reflections.MaxRoughnessToTrace 0.4
Lumenの設定 r.Lumen.Reflections.MaxRoughnessToTrace 0.2 2.68ms削減
古代の谷のDefaultEngine.iniは参考になる ► 古代の谷のDefaultEngine.iniで上書きしているレンダリング設定は非常に参考になる。 ► 例 ルーメンの設定 r.Lumen~ ► 例 バーチャルシャドウマップの設定 r.shadow.Virtual~ ► UIから設定できない細かい調整、最適化ができる。 ► 参考にしてThe Market of Lightに合うように値を調整していくつか使用した。 https://docs.unrealengine.com/5.0/ja/RenderingFeatures/Lumen/ より引用
まとめ
おかげさまで
おかげさまで ４.５万ダウンロード突破！
おかげさまで 公式動画に取り上げて頂きました！
※ 繰り返しになりますが Unreal Engine 5 はまだ早期リリース版です ※
まとめ ► Naniteだからといって（だからこそ？）世界を広げたら死ぬ ► 映画用アセットも使えると、単純にアセットの選択肢が広がる ► アプリケーションサイズが重くなるのどうしよう ► ゲーム体験として、LODからの解放は素晴らしい体験 ► エンタープライズでは割と早い段階から使えそう ► Steamで出すの大変
一緒に Unreal Engine 5 を楽しみましょう！