この記事は、2024年3月7日に開催された「CyberAgent Game Conference 2024（CAGC 2024）」のセッション内容をAIによる自動文字起こしをベースに加筆修正したものになります。

セッション概要

複数のゲーム開発子会社を横断して活動しているSGEコア技術本部のグラフィックスチームの活動についてご紹介します。
現在開発中のスタイライズドレンダリングシステムの紹介、リリースされたゲームに組み込まれた高品質で軽量なポストエフェクト、Nova Shader、AirStickerなどのOSS開発、グラフィックスエンジニア育成のためのリアルタイムCG道場の実施など多岐にわたる活動についてお話しします。

スタイライズドレンダリングの基盤

まず最初に 現在開発中の、スタイライズドレンダリングの基盤についてお話します。この基盤は下記のような要件を満たすものを目指して開発を進めています。

• 多機能で様々なスタイライズドな表現ができる基盤
• プロジェクトごとにカスタマイズ可能
• 高品質でありつつ、現在のミドルスペックの端末にも対応

【機能の一部を紹介】ベースシェーディング

では、この基盤の機能の一部を紹介していこうと思います。

まずはベースシェーディング、現在スタイライズドな表現を行うときに、ベースとなるシェーディング手法としてさまざまな手法があります。

例えばUTSのようなベースマップ、1影マップといったテクスチャを使う手法や、ランプマップを利用するランプシェーディング、そして計算のみでシェーディングを行う手法などです。

このような手法にはどの手法にもメリット・デメリットが存在しています。かつ弊社ではさまざまなタイトルでスタイライズドな表現が行われていて、タイトルによって採用されている手法が異なってきています。

このようなメリット・デメリットを考慮して、かつその会社にとって扱いやすいシェーディング手法、そのようなものを考慮して、この基盤ではベースとなるシェーディング手法を選択できるようになっています。

【機能の一部を紹介】スペキュラ反射

続いて機能の一部としてスペキュラ反射についてお話しさせていただきます。

スペキュラ反射は現在2種類の手法を実装しています。基本的にはスタンダードスペキュラを使用することになりますが、物理ベースのGGXスペキュラも用意しており、リアルの表現を行いたい場合にはこちらも利用できます。

 

【機能の一部を紹介】リムライト

続いてリムライトです。リムライトは標準的なリムライトと、深度テクスチャを利用したリムライトの2種類を用意しています。

標準的なリムライトは一般的な実装となっており、ディレクショナルライトの方向とキャラクターの法線の内積を計算してリムを発生させるという実装になっています。

この標準的なリムライトは、キャラクターの後ろ側からライトが当たっている場合に、本来光が遮断されている場所にもリムライトが発生するという問題があります。

 

このような問題を解決するために、深度テクスチャを利用したリムライトを実装しています。

深度テクスチャを利用することによって、遮蔽されている部分やキャラクターの前面のような、光が入ってこない場所のリムライトが弱くなる効果を得ることができます。

【機能の一部を紹介】セルフシャドウ

続いてセルフシャドウです。こちら下記の2種類のセルフシャドウを用意しています。

• URP標準の影生成によるセルフシャドウ
• 独自アルゴリズムのセルフシャドウ

URP標準の影生成は、URPで作成されるシャドウマップを利用してセルフシャドウを落とすことになるのですが、標準のシャドウマップは広い範囲に影を落とす処理として作られているため、狭い範囲に影を落とすセルフシャドウと併用を行ったときに、きれいな影を落とすことが難しいという欠点があります。

 

このように、キャラクターの前髪の影を、キャラクターの顔に落としたいときに、ジャギーが目立つ品質の影が落ちてしまっています。

また、シェーディングの調整のためにライトを回すとセルフシャドウの落ち方にも影響を与えるという問題があります。キャラクターのライティングの調整をするときには、シェーディング用のライトを回して調整を行うことになるのですが、それに追従してセルフシャドウも影響を受けて、影の落ち方が変わってしまいます。

これは、現実世界の現象としては正しい表現なのですが、スタイライズドな表現ではライトの影響を受けずに決まった方向に影を落としたいという場面があります。

このような要望に応えるために独自アルゴリズムのセルフシャドウを実装しています。この独自セルフシャドウはメインライトの影響を受けないため、シェーディング用のメインライトを回転させたとしても、キャラクターのセルフシャドウの落ち方は変化しません。そして、もともと狭い範囲だけ影を落とすということを、想定してシャドウマップを作っているので、URPのシャドウマップと同程度の解像度であっても、非常に品質の高い影を落とすことができます。

 

このように、独自アルゴリズムのセルフシャドウは、ジャギー感が少なく奇麗な影がおちており、メインライトの回転の影響も受けていません。

軽量で高品質なポストエフェクト

ここまでキャラクターのシェーディングについて話をしてきましたが、ここからは軽量で高品質なポストエフェクトについてもお話しさせていただこうと思います。

Bloom

BloomはURPの標準で用意されているのですが、多くの解像度をサポートする必要がある、スマートフォンゲームにおいては、解像度が変わってしまうと光のあふれ方が変わってしまうといった問題があります。

この動画はUnity Editor上で解像度を変化させて、Bloomのあふれ方を表している映像なのですが、解像度を変えることによって、あふれ方が変わってしまっていることが分かります。この問題によって端末によってあふれ方が変わっていくといった問題が起きてしまいます。

そこでこの問題を解決するために、コアテクのグラフィックスチームでバッファサイズを固定化して解像度に依存してしまう問題を解消したBloomを作成しました。

このように、解像度を変化させても溢れ方が変化しないようになっています。

またバッファサイズの固定化だけではなく、ぼかしフィルターに関しても改良を加えてます。URPのぼかしフィルターはDual Filtering + Gaussianになっています。Gaussianのフィルター品質は非常に高いのですが、テクスチャのキャッシュヒット効率が落ちてしまうという問題があります。

この問題を解消するために、Dual Filtering + Tentを実装しています。これはもともとBiRPのBloomで使われていたフィルターなのですが、これを使うことによってキャッシュヒット効率の高い、テクスチャアクセスが行うことができパフォーマンスに関しても改善しております。

Anime Post Process

こちらスクリーンスペースでの安価な処理でボリューメトリックライティングを行うことができ、空気感のあるライティングを表現できるポストエフェクトになっています。

では、こちらをポイントライトを例に見ていこうと思います。次の画像は光源が何もない状態です。

このシーンにポイントライトを画面外に設置してみます。するとキャラクターや地面に対してライトが当たっていることが分かります。しかし、まだ空気感は弱いです。

 

これに対してAnimePostProccessをオンにすると、画面がぼやっと明るくなり、空気中の粒子もライティングされているような表現が行えます。これによって空気感が増しています。

このようにAnim Post Processでは、非常に軽い処理でボリューメトリックライトのような効果を得ることができます。

OSS開発

続いてOSSの開発についてお話しさせていただきます。

Nova Shader

まずはNOVA Shaderdです。こちらはURPに対応した、パーティクルシステムのための多機能シェーダーです。Nova ShaderはOSSですので、広く一般にも公開しているのですがサイバーエージェント内でも多数利用されているOSSです。そのため積極的に更新が行われています。

Nova Shaderでは次の動画のようなエフェクトなどが表現可能になっています。

また、直近ではUnity2023への対応や頂点変形機能などの実装が行われています。次の動画は追加された頂点変形機能です。

こちらの機能はコアテクのグラフィックスチームで開発したものではなくて、NOVA Shaderを利用している、子会社のエンジニアが開発してくれたものです。

このように先ほどもお話しさせてもらったように、Nova Shaderは広く使われているOSSなので、コアテクだけでなく子会社のエンジニアとも連携して積極的に機能拡張が行われています。

Air Sticker

続いてURPデカールのデメリットを補間して軽量に動作する、AirStickerというOSSを紹介します。

URPのデカールは投影ベースのデカールとなっているのですが、Air Stickerはメッシュデカールとして実装されています。

Air Stickerはアニメーションしているモデルへのデカールも対応しています。URPのデカールはアニメーションしているモデルの変形に追従することが難しいのですが、Air Stickerを利用するとモデルの変形に即したデカールを行うことができます。

続いてTerrainへのメッシュデカール機能について紹介します。こちらは外部の方からのIssueに応える形で実装した機能です。

Terrainで作成された地形データにはメッシュデータが存在しないためバージョン1.00では非対応になっていました。しかし、外部の方からGitHub Issueで要望を頂いたため、それに応える形でバージョン1.1.0で対応を行いました。

 

このようにNOVA Shader、AirStickerともに外部の方のIssueにも応える形で、機能拡張を行っていっていますので、ぜひ使っていただいてIssueやPRなど出して頂けると非常にありがたいです。

リアルタイムCG講座

では最後にサイバーエージェント社内で実施したリアルタイムCG講座、こちらについてもお話しさせていただこうと思います。

こちらは社内で行った研修になのですが、こちらを実施した目的は下記の２点です。

• リアルタイムCGの基礎知識の全体的なレベルアップ
• グラフィックエンジニア育成の再現性向上

研修の内容としましては3時間×4日間の短期集中で、かなり珍しい内容になっているのですが、ソフトウェアレンダリングを実装するという内容になっています。

この研修のために準備したものは、10万字弱のテキストと19個の演習プログラムを準備しました。10万弱なので薄い技術本1冊分くらいのボリュームです。そして演習プログラムはこちらMac版とWindows版の二つを準備しています。

また、こちらの研修は社内だけでなく、リアルタイムCG道場という名前で一般公開を行いました。こちらは募集後すぐに応募定員に達して2回応募人数を増員するほどの反響をいただきました。

この活動は研修といった内容になるんですけども、このような活動も社内で非常に高い評価をしていただくことができ、社内で実施されているAAA Quality Award（6月度）を受賞させていただきました。

 

最後に

では最後にコアテクのグラフィックスチームの活動について、まとめをさせていただきます。

まず現在、グラフィックスチームではスタイライズドレンダリングシステムの基盤、こちらを鋭意開発中となっております。

そしてURPのポストプロセスの利用だけではなく、さらにそれを軽量にしたポストプロセスや、URPで実現が難しいポストプロセスなどの開発も行っています。

そして内部向けの活動だけではなく、OSSの活動を行ったり、グラフィックス研修などの育成に関する活動を行ったりもしております。

以上でコアテクのグラフィックスチームで開発したレンダリング技術や施策のお話を終わらせていただきます。

最後までお読みいただきありがとうございました。