セル調表現で世界展開を目指す！　『BLUE PROTOCOL』におけるアニメ表現技法〜CEDEC 2020（2）

オンラインアクションRPGとして世界展開を目指して開発中の『BLUE PROTOCOL』では、日本産のゲームということをアピールする意味で、劇場アニメクオリティのセル調表現を目指して開発が進められている。クローズドベータテスト、負荷テストを実施したばかりの本作ではUnreal Engine 4を駆使し、どのような手法でキャラクターや背景、効果などを制作してきたのか、世界観のデザイン、セルアニメーション風の表現、UE4での実現方法など、バンダイナムコスタジオの担当メンバーの講演から紹介する。

TEXT＿安藤幸央（エクサ）/ Yukio Ando（EXA CORPORATION） EDIT＿小村仁美 / Hitomi Komura（CGWORLD）、山田桃子 / Momoko Yamada

オンラインアクション RPG『BLUE PROTOCOL』（ブループロトコル）』PV

＜１＞グローバル展開への布石

はじめに、株式会社バンダイナムコスタジオ第3スタジオ第11プロダクションアートディレクターの奥村大悟氏より『BLUE PROTOCOL』開発の全体の工夫について紹介された。

『BLUE PROTOCOL』のグラフィックコンセプトは、壮大で精緻なセル調のゲームにすることにあるが、セル調と一言で言っても様々な表現がある。そのためセル調の先入観が『BLUE PROTOCOL』のグラフィックにとっての最大の障害になった。アセットのデザインを依頼しても、それぞれの先入観でセル調の表現をしてしまう。そういった先入観をなくすべく、一言で伝わるよう「劇場アニメの世界に入り込めるようなゲームをつくる」というのをキーワードとした。

▲『BLUE PROTOCOL』の世界観を表現したコンセプトアート

▲コンセプトアートを基に作り込んでいったゲーム画面（クローズドベータ版）

具体的にどのような世界設定にしたのかというと、剣と魔法、過去の超文明という企画からまず思いついたのは甲冑と宇宙服の組み合わせだったという。それをベースに、軍服やモダンなファッションを取り入れ、ファンタジーともSFとも異なる世界観が描かれた。衣装については、大量生産の工業製品を身につけて生活しているという設定になっている。

▲企画から思い描いた世界観

▲そこから生まれた実際の衣装設定

また、セル調と自由に動くカメラ（視点）はとても相性が悪く、カメラが決まった上であれば、手描きアニメ風の表現を突き詰めることはできるが、カメラが動くとそうはいかない。何かひとつのスマートなやり方があるわけではなく、キャラクター、表情、エフェクト、ポスト処理などそれぞれの要素に小さなアニメっぽさを積み重ねることで実現した。

▲アニメの作画エフェクトっぽい不透明のエフェクト

▲環境エフェクトも、覆い焼きのように画面の端から光が入り込んでいる

これらの小さな工夫を積み重ねることで、アニメの中で冒険しているような雰囲気を出しているとのこと。

＜2＞ポストプロセスによる輪郭線表現

続いて、キャラクターパートのリーダーを担当した角広昭氏より、本作のキャラクター表現について解説された。

▲キャラクター表現の最終ルック

まずは輪郭線の描画について、輪郭線はアニメ表現において重要な要素のひとつだ。輪郭線のないスタイルもあるが『BLUE PROTOCOL』では、輪郭線を描いている。本作の輪郭線はポストプロセスで描かれており、モデルデータの削減と法線編集の作業コストの面でこの手法が選択されたという。

輪郭線を描くために使っている情報は次のとおり。

▲カメラからのデプス（深度）情報をポストプロセスの輪郭線描画に使っている。内部にあるものは輪郭が描かれていない（赤矢印）

▲上記で描かれなかったものを、頂点フェイスカラーの明度差を利用し、輪郭を描いている。明度差が大きければ太く描かれる

▲関節部など重なりのある部分の輪郭線はワールドノーマルのコントラスト差を利用。肌が接しているような部分に効果がある

▲手、指など形がひと続きのものはワールドノーマルのコントラスト差を利用する方法が効果的

また、一部の輪郭にはポストプロセスではなくモデルによる表現が採用されている。

▲裏面モデルを法線方法に膨らませる手法。法線方向を編集している。尖った部分は隣接エッジの平均値になるよう修正

▲輪郭モデルは顎・口・耳の部分などモデル形状がひと続きでオーバーハングしているところにピンポイントで使用する

▲同じく顎の部分で輪郭モデルが使われている例。顎を正面から見た場合はデプス情報で輪郭が描けるが斜めからだと難しい

▲髪は複雑な凹凸が多く、輪郭モデルを使用することで入り組んだ部分もラインが描かれている。見た目の簡略化のためZシフトで押し込める場合も

シェーディングに関しては、グラデーションを使わないくっきりとした境界のスタイルで表現。ノーマルマップは、圧縮ノイズが境界部分に悪影響を及ぼすため、使っていないという。

さらに、キャラクタクリエーションでは、アニメ設定画のような正面、左右アングルからのレイアウトを採用している。

▲キャラクタークリエーションは、男女、体格別の3パターンから選べる。身長は単なるスケールアップではなく、頭身が変わるしくみ

▲顔の内部はパーツの選択方式。瞳や色数アップ、まつげの切り替えなどが実装中

▲ポーズ変更ボタンで、完成イメージを見ながらキャラクターを作ることができる

このアニメの設定画のようなレイアウトは、画面内に複数のモデルを配置し、カメラごとに別座標で撮影することで実現しているという。

▲画面内に複数のモデルを配置し、カメラごとに別座標で撮影

▲3D撮影したものを2Dテクスチャとして利用、アルファを使って切り抜き1画面内で重ね合わせて使用している

▲衣装の着合わせは、1個のアセットで済ませている。干渉する部位は頂点カラーにデータを入れて判別している

▲グローブの長さは4段階、干渉する部位を非表示にして使っている

次ページ：
＜3＞不透明エフェクトの視認性をいかに担保するか

[[SplitPage]]

＜3＞不透明エフェクトの視認性をいかに担保するか

エフェクトを担当した平山英輔氏、杉山和也氏からは、不透明素材の活用やポストエフェクト、頂点アニメーションによるアニメ的表現などについて解説が行われた。『BLUE PROTOCOL』のエフェクトには、アニメ的表現を目指すため透過を行わない不透明素材を多く使用しているという。

▲不透明と半透明でのちがい。不透明素材でセル調のキャラクターとの親和性が高まる。画面からエフェクトが浮いて見えない

▲不透明エフェクトの弊害として、エフェクトの重なりでゲーム画面の視認性が低下してしまう

▲カメラ距離によってエフェクトの消し込み処理を行なっており、カメラに近いエフェクトは表示されなくなる

▲距離消しなしと、距離消しありの状態。複数のエフェクトが重なった際も視認性低下を防ぐことができる

『BLUE PROTOCOL』ではアニメ制作における撮影処理の再現を目指している。アニメの撮影処理とは、画面全体の色調整や、アニメのベタ塗りを緩和するために「パラ」と呼ばれる画面へのグラデーション効果、光源に対するフレア効果の追加などを行う工程だ。

▲ポストエフェクトのパラ表現効果を10倍に強調してわかりやすくしたもの。サンシャフトの挙動は太陽を基準としている。UE4のポストプロセスマテリアルの機能で作成

▲カメラが日陰に入ったかどうかでエフェクトを切り替える判定をすることで、適切なポストエフェクト表現が可能となった。また切り替わりが激しくなりすぎないよう、数秒かけて切り替わるようプログラミングされている

▲多くの機能を盛り込んだマスターマテリアルを用意し、朝、昼、夕方、夜のポストエフェクトを時間帯によってオーバーラップさせて利用

＜4＞情報量を調整しアニメテイストを追求した背景

背景のリードアーティストを務めた長尾弘子氏より、アニメテイストを意識した背景制作について解説された。モデル自体はリアルにつくり込んだ上で、テクスチャのテイストがフォトリアルになりすぎないよう、ディテールを減らし、テクスチャの情報量を調整しているという。

▲アニメテイストだからといってモデリングを簡単に済ますようなことはしていない。リアルなモデルをつくり込む。ZBrush使用

▲岩のベースカラーマップ、エッジを強調し、フォトリアルな情報は省略している。手書き感のある色むらを入れている

▲ゲーム画面に配置した参考画像

日本のアニメ背景アートのようなテイストを目標に掲げたが、全て手描きで仕上げようとすると時間がかかりすぎ、作業者のスキルによって仕上がりにバラつきが生まれてしまう。そうして作業が属人化してしまうと量産ができなくなるため、テクスチャ作成のメインツールにPhotoshopではなくSubstance Painterを採用。Substance Painterのマテリアル、フィルタ、ジェネレーターを共有することで、手早くクオリティのばらつきのないテクスチャを実現している。

草原マテリアルは、アニメの背景美術を参考にし、下記の3点に着目し実現するよう考えたという。

1：カメラからの距離により草地テクスチャのカラー情報を減らす
2：草原全体に色ムラを付ける
3：ハイライトを追加して風邪によりきらめく草を表現する