「BLUE PROTOCOL」は“劇場アニメクオリティ”。壮大で精緻なアニメ表現はどのように制作されているのか

　バンダイナムコオンラインとバンダイナムコスタジオによる共同プロジェクトであるオンラインRPG「BLUE PROTOCOL」。本作は、劇場アニメのようなクオリティのビジュアル表現を目指して開発が進められている。実際に、クローズドβテスト（CBT）にて体験できた本作の世界観やグラフィックスは、手描きのアニメーションやイラストのような雰囲気を大いに感じさせるものだった。

　そういったビジュアル表現はどのようにして制作されているのだろう。CEDEC 2020では、バンダイナムコスタジオ 第3スタジオ 第11プロダクションの千家英嗣氏および奥村大悟氏、角広昭氏、長尾弘子氏、平山英輔氏、杉山和也氏が、Unreal Engine4（UE4）を駆使してどのような制作手法で構築してきたかを紹介した。

劇場アニメのような世界。壮大で精緻なセルルックなゲーム

　「BLUE PROTOCOL」は、壮大で精緻なセルルック（セルアニメーション表現）のゲームにするというグラフィックスコンセプトのもと開発されている。「セルルック」と言われると、ディテール削り目で大雑把、少しこじんまりしたものというイメージが浮かぶが、そうではない。「BLUE PROTOCOL」では、その先入観を消すために、「“劇場アニメの世界”に入り込めるようなもの」を作るというキーワードがある。

実際のゲーム画面。まさしく「壮大で精緻なセルルックなゲーム」になっている

　では、具体的にどういう世界設定で、どのように作られたのか。本作の企画の話が上がったときは、SFのオンラインRPG企画だったが、実際はサイエンス感があまりなく、「剣と魔法と過去の超文明」というイメージに固まったという。そこで、中世の甲冑と宇宙服を合わせたら面白いのではないかというアイディアが浮かび、それに19世紀20世紀辺りのミリタリーやモダンなファッションを組み込んだ。これにより、SFではないが、ファンタジーと聞いて思い描くようなイメージとは一味違ったスタイルになっている。

　しかし、こういったセルルック表現と自由なカメラ操作は相性が悪い。カメラを固定した状態で見た目を最適化できれば、手描きアニメへの再現度は高まるが、あらゆる角度から見てもアニメの雰囲気を壊さないようにするのは難しいのだ。

　そこで本作では、アニメっぽいと感じる瞬間や要素を重ねていくことで実現しようしている。例えばキャラクタークリエイション画面。ここでは、アニメの設定画のようなレイアウトになっており、アニメのキャラクターらしさを醸し出している。また、操作キャラクターが様々な表情を浮かべることで、生き生きとした印象を与えるようにしている。ほかにも、攻撃エフェクトなどを不透明にしたり、画面の端から光が差し込むようなENV用エフェクト、フィルターを使ったりを積み重ねて、アニメの中で冒険しているような雰囲気を出そうとしている。

アニメのキャラクターのらしさはどこから？ 輪郭線や表情まで細かく解説

　実際にキャラクター表現はどのような手法で実装したのか。輪郭線、シェーディング、リムライト、髪の毛スペキュラー、キャラクリエイション、表情の順で紹介された。

これが最終ルック

　まず、輪郭線。本作ではポストプロセスで輪郭線を描画している。開発当初は輪郭モデルのみで表現していたが、モデルデータのサイズ削減と作業コスト低減のため、ポストプロセスの輪郭線描画がメインになったという。

カメラからの深度情報を使いモデルのアウトラインに対して輪郭線を描画している。赤い印の箇所は、内部のため輪郭が描かれていない

そこで、頂点フェイスカラーの明度差を使いラインを描画している。明度差が大きくなれば太く、小さければ細く描画される

関節部などのモデルの重なり部分は、ワールドノーマルで描画。コントラスト差がある部分に輪郭が描かれる

手や指など、形が一続きな箇所は頂点フェイスカラーで塗り分けられないため効果的

輪郭モデルは、一般的な裏面モデルを法線方向に膨らませる手法を使っている。尖った先端は方向がズレると変になるため、ツールを使って隣接エッジの平均値へ修正

輪郭モデルは、顎/口/耳など、モデル全体では使用せずにピンポイントで使用

当初はワールドノーマルを使用していたが、鼻筋などに不要なラインが描かれたため、顔はオフにしている

髪の毛は複雑な凹凸が多いので、輪郭モデルを使用。ツンツンヘアーなどの部分は、そのままだと内部に複雑なラインが描かれる。見た目の簡略化のため、Zシフトで奥に押し込める手法も使っている

　次に、シェーディング。トゥーン境界はグラデーションを使わないくっきりとした境界のスタイルで表現している。背景への馴染みと設置感を上げるため、地面から胸元へかけてシェーダーでグラデーションを軽くかけている。なお、ノーマルマップは、dds圧縮のブロックノイズが境界部分へ悪影響を与えるため使用していない。

明暗のバランスは、5：5では逆光時に全て影色になるシチュエーションがあり、見た目が平坦化してしまう問題があったので、7：3で明るめの印象を表現している

ディフューズカラーに対する影色は自動的に作成し、作業量の軽減とデータ削減をしている。ただし、明度を下げると濁って見えるので、色相をズラして明度は下げるが彩度をあまり下げないルールになっている

常に影になる部分はテクスチャで表現。逆光時はトゥーンダウンでディテールを残している

顎の下などは頂点カラーでディフューズのオフセットをかけ影色になりやすいようにしている

帽子やヘルメットなどの落ち影表現は、ポストプロセスで表現。判別用にマテリアルの種類で区別をつけ、モデルの形をマスクとして使用し、下方へズラして使用している

　リムライトはポストプロセスを使い、キャラのアウトラインに対して均一な太さで描画。地面からの照り返しは減衰して入りにくいようにしている。また、モデルの閉塞部分はオクルージョンマスクを使って入らないようにしている。

　本作には時間変化があるのでライトの光源が真上に来る状態がある。その場合は、モデルの法線を調整しても、顔に不要な影が発生してしまう。そのため、肌のマテリアルには、ライトの角度が50％軽減して当たる仕組みを使っている。

体や衣装はモデル形状に合わせて変化しているが、顔は段階的に変化する

　続いて、髪の毛のスペキュラ表現が説明された。アニメでは作品の見た目の個性化に大きく影響する点だが、本作のスタイルでは以下の画像を再現する方向性で進めたという。

　カメラから見て近いところはスペキュラの球が小さくなる。外側に行くに連れ、単純に大きくするのではなく、笹の葉状のスペキュラの支点と終点方向に伸びるスタイルになっている。テクスチャは最大値で描画しておき、シェーダーで中心部を縮小させる方向になる。これを実装するためには、いくつかの問題を解決する必要があったという。

　まず、髪の毛を均等に配置したUV展開だと、1つのマスクに割り当てられる面積が小さくなり、境界部分にピクセル感が出てしまう問題があった。これには、割当面積を増やす対応を行ない、スペキュラ部分を別UV化。必要なフェースを再配置し、テクスチャのベイクを行なった。なお、dds圧縮の影響を回避するために未圧縮フォーマットで使用している。

　もう1つ、スペキュラの拡縮の判定をどう行なうかという問題。これは、テクスチャインポート時に各ハイライトの重心を判定し、そこからの距離によってUVを移動することでハイライトの縮小を行なう方法をとっている。各情報はテクスチャの各チャンネルに入れて使用しており、Rチャンネルは元の画像、Gチャンネルは重心からの横座標、Bチャンネルには重心からの縦座標、αチャンネルには拡縮する際に隣のものを参照しないように各ハイライトのIDを持っている。

実装結果

　本作におけるキャラクリエイションでは、男女体格別の3パターンから選択して進める。身長スライダーは単純なスケールアップではなく、上げれば等身が上がる仕組みになっている。また、肉付きに関しても膨らむ箇所とそうでない箇所の緩急をつけている。

　頭髪は、単色以外のもグラデーションカラーを選択できるように対応している。顔の内部は各パーツの選択方式で組み上げていく。個別に回転できるように開発しているという。瞳は、まつげの切り替えなどを実装中。ひげは、男のS体型でのみ選択可能。メイクなども種類を増やして実装している。また、ポーズ切替ボタンでポーズを変更しながらクリエイションを行なえるようになっている。

　画面内に複数のモデルを表示するため、複数の座標で撮影している。そのデータを2Dテクスチャとして使用しており、一画面内に重ね合わせている。

　衣装の着合わせでは、差分モデル作成のコスト作成のため、1つのアセットで済ませている。着合わせで干渉する部位へ頂点カラーを使い情報を入れている。具体的には、上着に対してグローブの長さは4段階で固定されており、干渉する部位を非表示にして表示している。ただ、消すだけでは太さの違いに対応できないため、接続部分に絞り骨を入れてモデル同士が干渉しない仕組みになっている。

　最後は、表情について。画面内にキャラクターが多数表示される都合上、データ削減のため骨で対応している。トータル150本の骨を使って作成されており、感情別に表情が25個ほど。目と口は組み合わせて使えるようにしている。

不透明素材でアニメ的表現に。セルルックのキャラクターと親和性の高いエフェクト

　本作のエフェクトでは、アニメ的な表現を目指すために、透過を行なわない不透明素材が多く使われている。不透明素材を取り入れることで、セルルックのキャラクターとの親和性が高まるのだ。

　しかし、不透明素材を多く取り入れると、エフェクトが重なり合った際に、画面の視認性が低下していしまうという問題が生じる。そこで本作では、これを改善するために、カメラ距離によるエフェクトの距離消し処理を行なっている。カメラが特定の距離まで近寄るとエフェクトが表示されなくなり、これにより視認性の低下を防ぐことができる。

　また本作では、テクスチャに歪みを加えるフローマップと、マスクとなるテクスチャの明暗をもとに消し込みを行なうディゾルブを組み合わせ、ランダム感とアニメ的な消し感を表現している。さらに、フレネルを使ったパーティクルメッシュの色の塗り分けにより、角度が異なるカメラから見られても同じ見た目にはならないようにしている。

　これらの工夫により、エフェクトにパターン感を与えないことと、多方向から見られても破綻しない見た目を実現している。

　次に、UE4のマテリアエルエディタのワールド位置オフセットを使用し、モデルの頂点を編集する機能を使用した頂点移動マテリアルの活用方法が紹介された。本作では、一部のエフェクトにスタティックメッシュモーフターゲットが使われている。これは、モデルのUVチャンネルに頂点の移動情報を格納し、2つのモーフターゲットをモデルに仕込む技術だ。

　例えば、トポロジの変化しない3種のモデルを用意し、スタティックメッシュモーフターゲットとして書き出すと、変形可能なモデルができる。それをパーティクルシステムでランダムに発生させ、雷のテクスチャを適用することで電撃のエフェクトが完成する。

　また、斬撃エフェクトを板で表現すると角度によって見えなくなってしまうが、ベーグル状のモデルにスタティックメッシュモーフターゲットでつぶれるように設定しておき、斬撃の挙動に合わせて先端をつぶすように設定する。そして、斬撃に連動して変形するモデリングに対し、カメラ方向に応じて模様がベーグルの外周をスクロールするように設定すると、視線移動に対応した斬撃エフェクトを表現できる。

　ポストエフェクトでは、アニメの撮影処理の再現を目指したとのこと。アニメの撮影処理とはいわゆる仕上げ工程のことで、全体的な色調整や、パラと言われる画面にグラデーションをかける処理、光源に対するフレアなど、様々な特殊効果を加える。アニメにおいてはなくてはならない工程で、劇場アニメの表現を目指す本作では、この再現は必須と考えていた。

　本作では、パラの挙動は太陽を基準とし、サンフレアと連動する形になっている。ブループリントを使用し、太陽のワールド座標をマテリアルに送るようにし、スクリーンスペースUVを歪ませることでパラを、太陽位置のスクリーンスペース座標から画面中央を向くように設定したUVによるテクスチャでサンシャフトを再現している。しかし、これらを常時表示したいわけではないので、カメラが日陰に入っているかどうかを判定する仕組みを実装。これをマテリアルで処理することで、日向と日陰でエフェクトの入り方を切り替えることができるようになった。しかし、瞬間的にフレアが切り替わると画面が光でパカパカするため、数秒かけて変化するようになっている。

説明のためにポストエフェクトの強度を10倍にしている

アニメテイストを意識した背景制作

　本作の背景では、フォトリアルな表現ではなく、日本のアニメ背景アートのようなテイストが目標になっている。しかし、アニメテイストだからといってモデリングが大雑把にならないように注意し、形状はリアルなものと同じ用にしっかりと作り込んでいる。

　しかし、テクスチャーを手描きで仕上げようとすると、時間がかかりすぎたり、作業者のスキルによりクオリティのばらつきが大きくなるという問題がある。そこで、テクスチャ作成のメインツールをPhotoshopからSubstanceに変更し、アニメ背景アートのような見える要素を抽出してSubstanceマテリアル化することで、手早くばらつきの少ないテクスチャをしたいと考えたという。

【具体例】

オブジェクトのエッジ部分は、現実よりもやや強調した描き方をしている

　草原マテリアルは、アニメ背景美術を参考に、カメラからの距離により草地のテクスチャカラー情報を減らすという点と、草原全体に色ムラを付けるという点、ハイライトを追加して風によりきらめく草を表現するという点に着目した。

上記3点の要素がない草原

取り入れた草原

　また、アニメ表現を意識して取り入れたポスト処理として、SNNフィルタがある。SNNフィルタは、近接するピクセルの情報を拾い、平均値を入れることで手描きアートっぽくディテールを潰すフィルタだ。SNNフィルタのかかり具合もカメラからの距離によって調整されており、近くはSNNフィルタをオフにし、遠景の方ではオンになるようになっている。

　さらに本作では、カスタム機能として影に色をつけられるようにしており、影の色はカメラから遠い場所と近い場所で指定できるようになっている。パラメータでNearからFarのカラーに切り替わる距離を設定できるほか、主だった影の部分と影の縁の部分で影色や反映率が個別に制御でき、影の描き方を調整できるようになっている。

近景には青みを入れ反映率は弱め、遠影は緑色に振り反映率をやや強めにしている

　ほかにも、ボリューメトリックフォグとボリューメトリックシャドウの実例が紹介された。

　「BLUE PROTOCOL」だけでなく、セルルックなゲームが増えてきている昨今。すでに驚くほどアニメテイストを感じられるグラフィックスとなっているが、次世代機が登場することもあり、今後どこまで“アニメーションらしさ”が追求されていくのか非常に楽しみだ。