西川善司の「試験に出るゲームグラフィックス」（10）「ストリートファイターV」における高密度なノンフォトリアル表現，そのレシピを探る・中編

　当初は前後編でお送りする予定だった「ストリートファイターV」（PC / PlayStation 4，以下 ストV）編だが，捨てるには惜しいほど情報量が多かったので中編，後編の3部構成でいくことにした。前編から数か月もお待たせすることになってしまって申し訳ない。


　前編は開発背景や基本グラフィックススペックについて紹介したが，中編となる今回は「3Dグラフィックスを採用するもゲームメカニクス（＝バトルシステム）は2Dベース」という本作特有のグラフィックスシステムを見ながら，カプコンの伝統芸とでも言うべき「2D格闘ゲームならではの表現レシピ」というものを考えていくことにしたい。

3Dグラフィックスで2D格闘ゲームを成り立たせる工夫（1）2D格闘ゲームメカニクスをUE4に統合

　ストVは3Dグラフィックスを活用してはいるが，ゲームメカニクスは2Dベースだ。これは前作「ストリートファイターIV」（PC / PlayStation 3 / Xbox 360 / Arcade，以下 ストIV）から引き続いた要素でもある。

　2D格闘ゲームは，技を繰り出したキャラクターのグラフィックス（＝見た目）とは別レイヤーで設定される矩形（＝四辺形）の組み合わせで「攻撃判定」と「やられ判定」を設定し，それらを基に「攻撃が命中したかどうか」を判断していく。3D格闘ゲームが，キャラクターの立体的な部位同士の衝突判定を取っているのとは対象的である。

　さて，ストIVのときのカプコンは，ゲームエンジンとして開発元であるディンプス独自の「XG」を採用しており，2D格闘ゲームメカニクスもXGベースとなっていた。しかし今回のストVでは前編でも触れたとおりEpic Gamesの「Unreal Engine 4」（以下，UE4）を採用しているので，当然ゲームメカニクスも新しくせざるを得ない。
　このあたりを振り返ってもらったところ，ストVのプロモーションプロデューサーである綾野智章（あやのともあき）氏とアートディレクターである亀井敏征（かめいとしゆき）氏はそれぞれ次のように話していた。

綾野智章氏

綾野智章氏：
　ストVにおける2D格闘ゲームのメカニクスを実現するにあたっては，「UE4にこれまでのカプコン2D格闘ゲームにおけるメカニクスを組み込む」形を採用しました。これがストVにおいて「2D格闘ゲームらしい遊びごたえ」を成立させているキモになっています。

亀井敏征氏：
　我々が開発した2D格闘ゲームメカニクスを統合することにより，UE4のインタフェース上で，各キャラクターの技のモーションに対し，矩形ベースの「攻撃判定」「やられ判定」の出現や消失をフレーム単位で設定できるようになっています。
　ランタイムにおいては，UE4に統合された2D格闘ゲームメカニクスが動作する仕組みになっています。背景のキャラクター制御やゼネラルストーリーなど，例外はありますけれども，基本的に，UE4のブループリント（＝ビジュアルプログラミングシステム）はゲームメカニクスでは活用していません。

3Dグラフィックスで2D格闘ゲームを成り立たせる工夫（2）透視投影と平行投影のハイブリッドグラフィックス

　こうして2D格闘ゲームとしての作り込みを進めていくことになったわけだが，実のところ，「2D平面として設定した『攻撃判定』と『やられ判定』」は，3Dグラフィックスと微妙に相性がよろしくない。

筆者手持ちの55インチテレビに棒を貼り付けて，そこにバルログをぶら下げている例

　どういうことかを理解してもらうには実例を見てもらうのが手っ取り早いということで，まずは右の写真を見てほしい。これは，テレビの上部に，テレビの表示面に対して直行する向きで棒を貼り付け，そこにバルログ人形をぶらさげたうえで，それを1mほど離れた場所から斜め下向きに撮影したものだ。

　続いて下の写真は，カメラをテレビに正対する場所へ固定したうえで，バルログ人形をカメラの画角中央へ置いた状態とカメラの画角端へ置いた状態の比較だ。バルログ人形の見え方に違いが出ているのが分かるだろうか。

カメラの画角中央へバルログ人形を配置した状態（左）と画角右端に配置した状態（右）の比較

上の写真のバルログ人形にクローズアップした写真。明るさが異なるのは無視してほしい

　視点正面にあるオブジェクトは視線を真っ直ぐ伸ばした先にあるが，視点正面からずれた端にあるオブジェクトは，視線をかなり斜め方向に伸ばした先にあるため，オブジェクトを斜めに見ることになる。結果として画角の端にあるバルログ人形では人形の正面側まで写っている。
　バルログ人形の「像の面積」だけに着目すれば，カメラの画角中央部に置いてある像よりも端の像の方が広く（≒太って）写るということだ。

　3D空間を仮想的なカメラ（視錐台）で切り取って画面に描画する3Dグラフィックスでも，この「バルログ人形写真実験」と同じことが起こりうる。もちろん，こうした現象は現実世界でも起きているので不具合ではない。

普通の3Dグラフィックス描画手法だと，画面中央と端とではここまで見え方が異なってしまう

　3Dグラフィックス描画パイプラインにおいて，こうした見え方を実現するのは「透視投影」である。
　それに対して透視投影をキャンセルした投影法が「平行投影」（もしくは「正射影」）だ。
　平行投影は，部品などの見え方や大きさが画角の中央と端で変わることがないため，メカニカルイラストレーションや設計図などでよく用いられる。

透視投影100％の描画結果

平行投影100％の描画結果

　では，ストVでは透視投影と平行投影のどちらを採用しているのだろうか？


亀井敏征氏：
　ストVでは，闘い合う2体のキャラクターで，透視投影50％，平行投影50％のハイブリッド投影を行っています。これによって，3Dグラフィックスのビジュアルとしてのダイナミズムと2D格闘ゲームのメカニクスとのズレとの間でバランスをとっています。
　ただし，背景でこうしたハイブリッド投影を行う意味はないため，一般的な透視投影100％で描画していますね。もっとも，カプコンの2D格闘ゲームは，ドット画時代から，魚眼レンズに近い，パースきつめの広角デザインを背景グラフィックスで採用してきた伝統があるので，ストVでもこのチューニングは入れてありますが。

製品版では，闘い合う2体のキャラクターを透視投影50％，平行投影50％のハイブリッド投影で描画することになった

　なお，イベントや超必殺技――ストVでは「クリティカルアーツ」――の演出でカメラアングルがダイナミックに変わるシーンでは，闘い合うキャラクターも背景も同一の透視投影変換によって描画しているそうだ。つまり，そうした特殊な場面ではいわゆる「普通の3Dグラフィックス」として描画しているということである。

3Dグラフィックスで2D格闘ゲームを成り立たせる工夫（3）3Dグラフィックスで2Dスプライト的な描画制御を行う技術

　2D格闘ゲームにおける暗黙のルールとして，「闘い合う2体のキャラクターが重なったときは攻撃側キャラクターの全身を見せる」というものがある。
　これは，攻撃キャラクター側のパンチやキックといった身体の部位が，これを受けるキャラクター側に遮蔽されて見えなくなってしまうと，攻撃側と防御側の双方に以下のとおり不都合が出てきてしまうためだ。

• 攻撃側：攻撃部位が相手キャラクターのどこに当たったのか分からないと，次の技を繰り出すタイミングを見極めにくい
• 防御側：攻撃部位が自キャラクターのどこに命中しているのか分からないと，上段ガードと下段ガードのどちらで受ければいいのか判断しにくい

　要するに，「ゲームとしての都合」として，攻撃側のキャラクターグラフィックスは全身を見せてあげなければならないのである。

攻撃側が最前面に描かれるのは他社の2D格闘ゲームでも同じだ。画面は上が「ザ・キング・オブ・ファイターズ’95」，下が「サムライスピリッツ」のものだが，攻撃側が最前面にあり，攻撃を受ける側はその奥になっているのが分かる。決して「1P/2Pどちらかが前面」ということはない

　ドット画時代の2D格闘ゲームのグラフィックスは2Dスプライトを活用して描画していたため，高優先順位を与えて描いたキャラクターのほうが先に描いたキャラクターの上に必ずオーバーラップ表示されることになる。そのため，攻撃側キャラクターのスプライトを高い優先順位で描くようにしておけば，「攻撃側キャラクターの全身を見せる」という格闘ゲーム的ルールを遵守できていた。

　しかし，3Dグラフィックスだとそうはいかない。
　各キャラクターはX，Y，Zの三次元座標で管理されており，それこそ身体の各部位が三次元的な立体物なので，攻撃側と防御側をどういう順番で描こうが，立体的な遮蔽関係に配慮した描画が行われてしまう。
　たとえば，攻撃側が繰り出した拳は，位置関係によっては防御側の「脇を固めた肘」に遮蔽され，視点からは見えなくなるケースもあり得るのだ。
　しかし，と綾野氏は言う。


綾野智章氏：
　ストVは2D格闘ゲームなので，「攻撃側キャラクターの全身を見せる」という鉄則は守らなければなりませんでした。


　では，いかにしてこのハードルを乗り越えたのか。亀井氏は次のように続ける。


亀井敏征氏：
　鉄則を守るにあたっては，攻撃側キャラクターの全身形状を抜くようなマスクをリアルタイム生成し，このマスクを防御側キャラクター側に適用することで，「攻撃側と防御側が折り重なった領域で視点から見えるのが必ず攻撃側になる」よう制御しています。

バルログのスライディングで転ばされるユリアン。3Dグラフィックス的には「バルログがユリアンの右足よりもカメラの手前側にいる」ため，これだと転ばされる位置関係にはいないことになるのだが、2D格闘ゲーム的にはこうしたほうが技を見やすいのだ

　「GUILTY GEAR Xrd -SIGN-」（PlayStation 4 / PlayStation 3 / Arcade）では，攻撃側キャラクターの深度値を視点側に約1メートルオフセットさせる制御を入れることで攻撃側の深度テストを常時合格させて「攻撃側キャラクターの全身を見せる」ことを実現していた（関連記事）。
　それと比べるとストVではやや画像処理的なアプローチになっているのが興味深い。

チュンリーのめくり飛び込みキック。3Dグラフィックス的には「ただ横にすれ違っている」ような見た目だが，2D格闘ゲームとしてはこのほうが攻撃部位は見やすい

一方で攻撃がヒットしたときなどに出てくるヒットエフェクトは3D的なグラフィックス効果として奥行きに配慮した描画となっている

3Dグラフィックスで2D格闘ゲームを成り立たせる工夫（4）魅力的な「構えポーズ」を実現するための「5度回す」レシピ

　2Dでも3Dでも，格闘ゲームは画面に対して2体のキャラクターが向かい合う画面構成なので，基本ビジュアルがいわゆるサイドビューになっている。

　現実世界で二人の人間が向かい合った場合，お互いに相手に正面を見るような感じで対峙するのが自然だろう。しかし，格闘ゲーム的なサイドビュースタイルでそれを再現しようとすると，向かい合った二人はカメラに対して完全な側面（＝横の姿）を見せることになってしまう。極端に言えば，左右どちらかの半身をカメラに見せているだけになってしまうのだ。
　半身横姿のキャラクターは画面に対して面積的にも狭く細身になり，プレイヤーに見せるべき「身体のアクション」のダイナミックさを表現しづらくなる。


亀井敏征氏：
　カプコンの2D格闘ゲームでは，迫力ある身体のシルエットを見せ，同時にダイナミックな身体のアクションを表現するために，各キャラクターはカメラ（視点）に向けて微妙に身体を傾けてあります。
　つまり，各キャラクターの身体の正面側がいくらかカメラ側に見えるような姿勢になっていると言うことです。これが「格闘ゲームのキャラはカメラ側に5度回す」テクです（笑）。


　下に示したのはベガの「ゲーム中における見え方」解説スライドだが，ベガの顔は対峙する相手を見ているので，画面上でほぼ完全な横顔なのに対し，身体だけはゲーム中のカメラ側に傾けてあるのが分かる。

左はバトルステージを直上から見下ろした図。ゲーム中のカメラの位置とキャラクターの姿勢の相関がよく分かる。右はこのカメラから捉えたゲーム中のベガの見え方となる

左は同じくバトルステージ直上から見下ろした図だが，ゲーム中とは異なり，あえてキャラクターの正面（≒相手キャラの位置）にカメラを配置している。右はこの状態でカメラから見たベガの姿。身体を回転させているのがよく分かる

　また，技がどんなアクションなのかをプレイヤーに理解しやすく見せるために，キャラクターの「技を出している身体全体」をゲーム中のカメラ側に傾けているのも興味深い。
　下のスライドは，ザンギエフが「サイクロンラリアット」という技を繰り出しているときの画面ショットだが，これを真上のカメラから見ると，下半身側が画面奥側，上半身側が画面手前側に来るよう，身体を傾けているのが見てとれる。「5度回す」テクを活用することで，ザンギエフが回す両腕をダイナミックに見せ，かつ衝突判定が2D画面上で楕円状に展開するようにしてあるのだ。

左はバトルステージ直上から見下ろした図。カメラ位置はゲーム中と等しい

カメラの位置をキャラクターの正面に持ってきた例。こうしてみると不自然なまでに回転軸がズレているが，2D格闘ゲームの都合上はこれで正しいのだ

　もう1つ，下に示したのはレインボー・ミカのドロップキックだが，ゲーム中では真横に蹴り出して見えたこの技も，実は5度回すテクの適用を受けていて，上半身は画面奥側，そして蹴り技としての主要部位となる下半身は画面手前側を向いているのが見て取れる。
　こうすることで足の裏がよく見えて蹴り技の迫力が伝わるし，なによりもゲーム中はサイドビューとなっているにもかかわらず，相手に向かって脚部がグインと伸びてヒットする描写が理解しやすい。

ここでも左はバトルステージの直上から見下ろした図だ。横っ飛びキックにみえたレインボー・ミカのドロップキックは，むしろ画面奥から画面手前に蹴り出すようなアクションだったことを確認できる。5度回すテクの妙といったところか

カメラをキャラクターの正面に設置した状態がこちら

亀井敏征氏：
　この5度回すテクはモーション（＝アニメーション）のデザインにおいても配慮しています。ストVでは，各キャラクターが画面上を左右に縦横無尽に移動するわけですが，そのアニメーションの設計においても，ゲーム中のカメラに最適化した動きに調整してあるわけですね。

全キャラクターの動きはモーションキャプチャベース＋「格闘ゲームらしい味付け」

　前段でアニメーションの話題が出てきたので，ストVにおけるアニメーションをもう少し深く見ていくことにしよう。
　ストIVでは，歩行モーションから技を繰り出すモーションに至るまでほぼすべてが手付けのアニメーションだったが，今作はどうなのか。亀井氏は次のように述べていた。


亀井敏征氏：
　「空中の挙動」以外はすべてモーションキャプチャ技術を使って実際に人間のアクターの動きを取得し，これをベースにして「格闘ゲームのモーション文法」に従うようなアレンジを加えて使用しています。
　モーションの収録にあたっては活劇座さんに協力いただきました。


　亀井氏の言う「格闘ゲームのモーション文法」とは，やや意図的な緩急を付けたり，大げさな技軌道にしたりすることだ。ある種，モーションキャプチャによるモーションデータを下地にして，手付けアニメーションの風味を加えるアレンジを施すといったイメージだろうか。
　ダルシムのように特異な手足の動きをするものについては，当然，そのアレンジの割合が大きくなってくる。

亀井敏征氏

亀井敏征氏：
　私個人としては，格闘ゲームだと手付けアニメーションによる動きのほうが好きなんです。ゼロからアーティストが考えて，すべての過程を手付けしていくことで，ゲームらしい，迫力ある，特徴的な味わいが盛り込めるからですね。
　私もストリートファイターIVでは，ダルシムやザンギエフのバトルモーションや，「滅・昇龍拳」「ヨガシャングリラ」といった一部ウルコンを手付けで制作していました。

　ただ，手付けアニメーションは，個々のアーティストによって品質にバラつきが出やすい手法でもあります。大量のキャラクターを制作する場合にはその影響も大きくなります。
　その点，モーションキャプチャをベースにしたアニメーション制作では，言うなれば100点満点中の70点あたりから作業をスタートできます。そこから90点，あるいは100点を目指すのも手付けアニメーションと比べて短時間でできますし，キャプチャしたデータを“アタリ”として使うことで，人間らしい仕草だけ抽出できるというメリットもありますね。

「実際のモーションキャプチャにあたってモーションアクターが行うアクション」の絵コンテは，これらラフスケッチを基にして制作することになったそうだ。実際のモーションキャプチャ時にはアニメーション制作チームとゲームメカニクス制作チームの両方が同席し，アートとゲーム両面から，細かなディレクションを行ったという

　格闘ゲームの場合，手足の動きだけでなく上半身と下半身の総合的な姿勢の推移までを作り込む必要がある。これはある種のフルボディIK制御を手作業で行うようなものだ。
　モーションキャプチャで取得したモーションデータを下地にしてアニメーションを作り込むということは，いわばアニメーション品質を底上げし，均一化することにもつながっていくというわけである。

　歩行モーションを例に取ると，モーションキャプチャで取得したデータでは，当然ながら人間らしい綺麗な動きでキャラクターを駆動できるのだが，格闘ゲームのキャラクターの動きとしては綺麗すぎる印象になることがあるという。リュウやケンといった主役クラスのスマートな定番キャラクターはほぼそのままでもいけるが，ネカリやザンギエフ，バーディ，ファンといった個性の強いキャラクター達はそのままだと「物足りない」ということになるらしい。
　漫画やテレビアニメに登場するキャラクター達の動きは，少しくらい現実離れしていたほうが説得力が増すなどとよく言われるが，格闘ゲームでも同じなのだろう。

　ところで，ストVにはモーションキャプチャベースでもなく，手付けでもない，プログラム的に制御しているアニメーションもある。その1つが，頭と眼球が対戦相手を見る制御だ。
　一方のキャラクターがジャンプしながら攻撃を繰り出してくれば，飛び込まれたほうのキャラクターはそのキャラクターを見上げる動作をする。相手キャラクターがしゃがめば見下ろす動作が入る。

　速いので分かりにくいかもしれないが，眼球の黒目も動いて相手を目線で追っている。黒目の動きにはちゃんと上限が設けられているため，相手キャラクターが頭上を飛び越えた場合でも白眼になってしまうことはない。


　もう1つが衣類や小物の挙動だ。
　衣服やマントのような比較的面積の広い布の挙動はNVIDIAの「PhysX」，アクセサリーや帯，はちまき，弁髪などといった小物はUE4の「Physics Asset Tool」（PhAT）による制御となっている。

生き生きとした表情で戦うストリートファイター達，その顔面に隠された秘密

　前編で解説したように，ストVは各キャラクターのポリゴン数がとても多く，バトル中もキャラクターはかなり豊かな表情を伴っている。

　攻撃を喰らったときにキャラクターはそれぞれ痛そうな表情をするのだが，このバリエーションもまた豊かである。片目を閉じて歯を食いしばって痛みを堪えているような表情もあれば，口を尖らせて唾を吐く出ような，ややコミカルな表現もある。
　超必殺技を放つとき，技を仕掛けた側のキャラクターが大写しになるのだが，そのとき，顔面の演技を伴って短い「決めぜりふ」を言ったりすることもある。一方で超必殺技をくらった側のキャラクターは，ゲーム画面を捉えている「架空のカメラ」に衝突して，片頬が潰れるような表情で気絶する描写でフィニッシュすることもある。
　ストVのキャラクター達は，とにかく「マネキン感」がなく，各キャラクター達がバトル中も生き生きとしているのだ。


　この表情システムはどのようになっているのだろうか。亀井氏は次のように語っている。


亀井敏征氏：
　基本的に表情は顔面に仕込まれたボーンを駆動させて作っています。顔面の動きにモーションキャプチャは使っていませんから，すべて手付けですね。


　実装にあたっては，大別して2つの「場合分け」を行っています。
　1つは登場シーンやクリティカルアーツなどの「イベントシーン」における各キャラクターのアニメーションです。こうしたシーンに対しては，顔面とボディのアニメーションとして「それ専用」のものを同時に制作して実装しています。それこそ，ガイルが登場するシーンの「御託はいい。始めよう」だと，その台詞のクチパクと，素振りをしてから構えるアニメーションは専用に制作しています。

　もう1つはバトル中の各種モーションです。こちらは，ボディの姿勢アニメーションと顔面アニメーションを別々に作っています。正確には，ボディのアニメーションを制作して，あらかじめ作り込んでおいた顔面アニメーションをそこにはめ込んでいく感じです。
　たとえば，パンチを食らったときのアニメーションなら，その「やられ姿勢モーション」を制作しつつ，用意しておいた「片目を閉じて苦痛に耐えるような表情アニメーション」をはめ込むという感じです。


　ストVでは，特定の技を食らうと，全キャラで似たような「やられ」表情をする。「この技を食らったときはこの表情」というようなプリセットの表情が前もって全キャラ分作り込んであり，それを，ボディ側の「やられアニメーション」に組み合わせて設定しているのである。

こちらは基本顔シリーズ。上段左が標準で，中央が「あ」，右が「い」だ。下段は左から順に「う」「え」「お」である

こちらが感情表現シリーズ。左から順に，怒り，笑い，驚き顔を表現するアニメーションの1コマとなる

そしてこちらがやられ表現シリーズだ。左から，ボディ攻撃，顔面攻撃，アッパー攻撃を受けたときの顔を表現するアニメーションの1コマである

亀井敏征氏：
　ストVでは，「『2D格闘の当たり判定設定ツール』を用いて，あらかじめ作り込んでおいた表情アニメーション」を各キャラクターのアニメーションの1コマ単位で設定できる制作スタイルを採用していました。たとえば波動拳を撃つときには，波動拳を撃つアニメーションの一コマ単位で，これに見合う「A・O・U・E・N」のクチパクを当てはめています。
　こうした顔面の動きのバリエーションはストIVと比較しても倍くらいのバリエーションに増えているので，制作が大変でした。次回作を作るときは，顔面の動きにもモーションキャプチャを取り入れるなどして作業効率を上げてもいいかなとは思っています。

「3Dグラフィックスを2Dの文法で見せる」ために

　ストVは，3Dグラフィックスを採用しつつも，「カプコン伝統の2D格闘ゲームらしいプレイ感」を損なわないよう，「3Dグラフィックスを2Dの文法で見せるための工夫」をさまざまに盛り込んでいることを理解してもらえたと思う。
　カプコン側としては「2D格闘ゲームのプレイ感」を維持するためだった工夫の数々も，今回明らかになった情報を踏まえ，あらためて確認してみると，むしろそうした工夫がストVグラフィックス特有の味わいになっているような気もする。

　動きの面でも，モーションキャプチャを採用するなどして，3Dグラフィックスならではの技術的恩恵を享受しながら，「2D格闘ゲームらしい動き」とするために，アクターのモーションデータをそのまま活用せずにアレンジを加えているという話も，ストVグラフィックスを動きの面での「独特なアートスタイル」の実現に貢献していると言ってよさそうだ。

　さて，間もなく掲載できる後編では，この「ストVグラフィックスのアートスタイル」を，より深く見ていくことにしたい。

カプコンのストVAE製品情報ページ