セガ、『PSO2』シリーズで新たに実装されたトゥーン表現の解説記事を公開。既存モデルを生かしながら描画方法を切り替え

2023.08.29
ニュース見た目を良くする3DCG
この記事をシェア!
twitter facebook line B!
twitter facebook line B!

この記事の3行まとめ

  • 『ファンタシースターオンライン2(以下、PSO2)』『PSO2 ニュージェネシス(以下、NGS)』で実装されているトゥーン表現の解説記事が公開
  • 既存のモデルに合わせ、従来とは異なる方法でトゥーンレンダリングを実装
  • ランプテクスチャの追加が難しいモデルデータへの対応も行う

2023年8月10日(木)、セガの技術ブログ「SEGA TECH BLOG」にて、『NGS』『PSO2』のトゥーン表現を解説した記事「『PSO2 ニュージェネシス』におけるトゥーン表示対応について」が公開されました。

トゥーンレンダリングを想定していないモデルデータでの工夫

『NGS』ではトゥーンレンダリングを想定したモデルデータを作成していなかったため、一部の実装では一般的な手法とは異なり、その方法について同記事で解説されています。

本作でトゥーン表示する際は、ディファードレンダリングのGBufferから取得した情報を使用しています。『NGS』のレンダリングシステムは、不透明の描画には「ディファードレンダリング」、半透明・カットイン画面の描画には「フォワードレンダリング」が用いられています。

GBufferの内容(画像はSEGA TECH BLOGより引用)

『NGS』のトゥーン表示におけるレンダリングパス(画像はSEGA TECH BLOGより引用)

カットイン画面とは、本作においてチャット画面やショップでのプレビューで使われている画面を指しています。

カットイン画面(画像はSEGA TECH BLOGより引用)

これまでの処理ではフォワードレンダリングを用いていたため、GBufferの情報を出力していませんでした。トゥーン表現を適用するにあたり、フォワードレンダリングの結果だけでなく法線、マテリアル情報などを含めたGBufferを出力するように変更したといいます。

トゥーン表現対応後のカットイン描画のパス(画像はSEGA TECH BLOGより引用)

ランプテクスチャの追加が難しいモデルデータへの対応

拡散反射光(陰影)は、ランプテクスチャ(※)を用いて表現する方法が一般的です。しかし『NGS』では既存のモデルデータとの兼ね合いなどの理由から、ランプテクスチャを使用せずに、用意した一律のパラメーターの値を元に陰影を計算して表現します。

※ ランプテクスチャとは、色の段階を設定したテクスチャ。本作では、陰影をアニメのような表現に近づけるために使用されている

ランプテクスチャではなく、計算によって3段階に陰影が分けられている(画像はSEGA TECH BLOGより引用)

上記の陰影付けの方法では、例えば肌の色が暗いキャラクターでは意図しない陰影描画が発生するため、鏡面反射光(スペキュラ)に対しても一律のパラメーターを用意して、3段階の陰影をもってトゥーン表現を実現しています。

拡散反射光だけでは陰影が落ちない例(画像はSEGA TECH BLOGより引用)

鏡面反射光も考慮することで、綺麗に陰影が落ちるようになった(画像はSEGA TECH BLOGより引用)

アウトライン表現

『NGS』は、GBufferの深度、法線、マテリアルの情報を元に「顔と毛髪以外は法線によるアウトラインを使用する」「毛髪のみ、マテリアルによるアウトラインを使用する」など、パーツごとに異なる方法でアウトラインを描画しています。

また、『PSO2』では「フォトンマフラー」など不透明と半透明を組み合わせたパーツが用いられています。この場合、アウトラインは半透明部分を無視し、不透明部分に沿った不自然な描画がされてしまいます。

その対策として、半透明部分を表すアルファマスクを作成。これにより、半透明部分にアウトライン描画されないよう対応しています。

GBufferの各情報を元にアウトラインを描画している(画像はSEGA TECH BLOGより引用)

マスクを用意することで、半透明部分にアウトラインが描画されないようにしている(画像はSEGA TECH BLOGより引用)

その他、トゥーン表現に対応するために施したモデルの調整手法などの詳細は、こちらをご確認ください。

SEGA TECH BLOG「『PSO2 ニュージェネシス』におけるトゥーン表示対応について」

関連記事

Adobe、USDファイルをFBXやglTFなど5つのフォーマットに変換できるプラグイン群「USD File Format Plugins」をオープンソースで公開
2024.03.01
3ds MaxやMaya、Houdini、UEなどでマテリアルを共有できる規格「MaterialX」がアップデート。Non-Photorealistic Rendering(NPR)用のライブラリが初めて追加された
2024.02.29
VRM用アニメーションファイル形式「VRMA」が正式リリース。あらゆるVRMモデルでアニメーションを共有可能
2024.02.22
実写映像を3Dアニメーション化するAIツール「Wonder Studio」にUEエクスポート機能追加。カメラやキャラクターアニメーションなどの要素に分解も可能
2024.02.16
ゲームづくりに役立つ無料&商用利用可能な素材サイトまとめ。3Dモデルやサウンド、フォントなどを一気に揃えよう
2024.01.26
Unity、エディタ上とランタイムの両方でglTFを扱える『Unity glTFast』パッケージをリリース。オープンソースの『glTFast』が公式パッケージに
2024.01.17

注目記事ランキング

2024.02.27 - 2024.03.05
1
『フォートナイト』で動く本格的なゲームが作れるツール「UEFN」とは?従来のクリエイティブモードから進化したポイントを一挙紹介!
2
【CHALLENGE1】「クリエイター ポータル」を使って、UEFNで作成した島を世界中に公開する
3
【2022年5月版】今から始めるフォートナイトの「クリエイティブ」モードープレイ開始から基本的な操作方法まで解説
4
UEFNで使えるプログラミング言語「Verse」のノウハウが集結。『UEFN.Tokyo 勉強会 03 Verse Night』レポート
5
フォートナイト クリエイティブとUEFNで使える仕掛け一覧
6
フォートナイト クリエイティブとUEFNで使える仕掛け一覧 Vol.1「アイテム系」
7
フォートナイト クリエイティブとUEFNで使える仕掛け一覧 Vol.5「島の設定」
8
フォートナイトとUEFNがv28.30にアップデート。「NPCスポナー」が、スポーン・撃破時のエフェクトや移動速度のカスタマイズに対応
9
【STEP2】UEFNの基本的な使い方を覚えよう
10
【CHALLENGE2-1】フレンドと一緒にゲームを作ろう――UEFNプロジェクトをチームメンバーとリアルタイムで共同編集する
11
【STEP1】「UEFN」を入手しよう
12
まるで『マイクラ』?ボクセル地形を生み出す無料アセット「VoxelPlugin Free」で”地形を掘ったり積み重ねたり”して遊んでみよう
13
フォートナイト クリエイティブとUEFNで使える仕掛け一覧 Vol.4「ゲームシステム系」
14
フォートナイト クリエイティブとUEFNで使える仕掛け一覧 Vol.7「NPC系」Part1
15
フォートナイト クリエイティブとUEFNで使える仕掛け一覧 Vol.2「ユーティリティ系」
16
フルカラー書籍「UEFN(Unreal Editor For Fortnite)でゲームづくりを始めよう!」、ついに本日発売!全国書店で好評発売中!
17
【CHALLENGE3】UEFNの機能「ランドスケープ」を使ってオリジナルの地形を作る
18
NIKEのAir Maxをテーマにしたフォートナイトの島『Airphoria』、制作に関するチュートリアルが公開
19
フォートナイト クリエイティブとUEFNで使える仕掛け一覧 Vol.10「UI系」Part1
20
フォートナイト クリエイティブとUEFNで使える仕掛け一覧 Vol.10「UI系」Part2
21
『フォートナイト』で建築ビジュアライゼーション!?UEFNでオリジナルの世界観をどう作り上げたか、その手法を解説【UNREAL FEST 2023 TOKYO】
22
フォートナイト クリエイティブとUEFNで使える仕掛け一覧 Vol.3「プレイヤー系」
23
フォートナイト クリエイティブとUEFNで使える仕掛け一覧 Vol.6「チーム・対戦系」Part1
24
フォートナイト クリエイティブとUEFNで使える仕掛け一覧 Vol.7「NPC系」Part2
25
フォートナイトとUEFNがv26.30にアップデート。ロビー画面が一新され、クリエイターが島ごとにロビー背景を自由にカスタムできるように
26
【STEP6-1】「オリジナルキャラクターを登場させよう」――Fabでアセットをダウンロードしよう
27
「UEFN」って実際どうなの? 編集部が3時間で「みんなで遊べるアクションゲーム(?)」を作ってみた
28
【STEP4-2】リスポーンとチェックポイントの仕組みを作る
29
【STEP5-1】スタート時のカウントダウンを作る
30
フォートナイト クリエイティブとUEFNで使える仕掛け一覧 Vol.6「チーム・対戦系」Part2
VIEW MORE

イベントカレンダー

VIEW MORE

今日の用語

レンダリング(Rendering)
レンダリング コンピューターグラフィックスにおける、各種データ(3Dモデルなど)をプログラムを用いて計算し、画像として表示すること。レンダリングを行うプログラムをレンダラー(Renderer)と呼ぶ。
VIEW MORE

Twitterで最新情報を
チェック!