こんにちは！トイロジックでテクニカルアーティスト（以下、TA）をやっているトリと申します。5月に発売された『グリッチバスターズ：スタックオンユー』の開発に携わっておりました。
さて、この度はそんなグリッチバスターズの裏側をTA目線で紹介する記事を書かせていただくことになりました！ 「キャラ表現編」「エフェクト表現編」「背景表現編」と銘打って、全3回にわたりお届けする予定です。
この第1回では、「キャラ表現編」ということでプレイヤーキャラの表情に対して行ったちょっと特殊な表現を紹介したいと思います！
グリッチバスターズの表情
グリッチバスターズでは、キャラクターの表情について「イラストが動いている」ように見せたい、という目標がありました。見ていて楽しく、そしてゲームのビジュアルとして新鮮に感じてもらえるように、という狙いに基づくものです。
「イラストが動いている」ように見せるべく、ディレクターからオーダーされたのは、見ている方向に合わせて、顔の各パーツを変形、移動させるという機能でした。
これはアニメ映画などでは使用されることもある手法ですが、ゲームでは私の知る限りかなりレアな挑戦です。当然知見もなにもなく、実装にはかなり苦労しました…。
次節から、その機能をどのように形にしたのか、そしてどのような点をこだわったのかを深堀りしていきたいと思います。
なお、本作はUnreal Engine4で開発されていますので、Unreal Engineの用語や画面を交えての紹介とさせていただきます。
こんな仕組みになっています！
さて、具体的な表情の仕組みですが、以下のような形になっています。
- 顔パーツは、それぞれが頭の内部に浮かんでいるようなモデルとして作る。これにより、頭部全体の形状に破綻を起こすことなく顔パーツが自由に変形できるようにする。
- 内部の顔パーツが見えるように、プレイヤーキャラの頭部は空洞状の反転メッシュにしておく。
- 顔パーツに対する変形（オフセット、回転、スケール）処理はすべて頂点シェーダで行う。
- 「顔を見ている方向」に紐づけたパラメータを変形に利用することで、カメラを動かすことで変形が作動するようにする。
上記の1.2.のような構造にできたのは、キャラクターデザインが極めてシンプルだったからです。リアルな人間のキャラクターだったらこうはできない（顔の表面に貼り付いている各パーツを、破綻がないように変形させないといけない）ので、実現自体できなかったかもしれません。
3.にあるようにシェーダでの実装となったのは、マルチプレイの際、各プレイヤーの視界ごとに別々の変形を適用する必要があるためです。この条件だと、シェーダで取得できるカメラの情報を使うのが最適、という判断がなされたのですね。
4.で触れている「顔を見ている方向」は、「顔自体の向き」と「カメラと顔の基点位置を結んだベクトル」の内積で判断しています。この内積の結果の値を加工して変形パラメータにするような形で、パーツの変形を実現します。文章だけだとつくりが想像しづらいと思うので、わかりやすいようにサンプルを作ってみました。
パーツごとに異なる変形を与えたいので事前にマスクテクスチャでパーツを区別できるようにしておきます。（実際のデータではテクスチャではなくマテリアル自体を分けて区別するようにしました）
先述の方法で「顔を見ている方向」の情報が取れたら、変形用のマテリアル関数に接続します。画像中のMF_FaceTransformという関数です。内容は以下の通りです。
パラメータを調整し、目は左右同士の距離がいい感じに調整されるようにオフセットさせ、口も同様にイラストっぽく見える位置にオフセットさせつつ、手前を向くように回転も加えます。
なお、こういった変形のさせ方のルールは実際に作りながら試行錯誤して編み出しました。
横回転限定の簡易的なものですが、これで「見ている方向に合わせて、顔の各パーツを変形、移動させる」という機能は完成です！ どうでしょう、なかなかそれらしく動いているのではないでしょうか。（※このサンプルでは顔自体の回転などは考慮していません）
製品版でのつくりについて
製品版では、あらゆる視点・あらゆる表情パーツで破綻なく見えるように、サンプルの何倍もの機能とパラメータを用意して細かく調整を行っています。
変形の計算ももっと複雑なので、行列でオフセット・回転・スケールの各変形を構築し、汎用的に変形できるような仕組みになっています。
また、モーションとタイミングを合わせた変形なども行えるように専用の仕組みをプログラマーさんに用意してもらったりなど、かなり大掛かりな構造となりました。そうしてに複雑かつ繊細にセットアップされてできたものがこちらです。
苦労の甲斐あって、いいものができたのではないかと思っています！
ここ見て！ポイント
最後に、ここは見てほしい！こだわりのポイントを紹介します。
1.口のロール回転機能
横顔になったとき口パーツを傾ける機能です。この機能が入ったことでイラストらしさがより強調されたと思います！
2.後ろから見ると目が出ている！
一部の表情に入れているもので、キャラの背中側から見たとき、見えないはずの目が顔の輪郭から飛び出て見えるようになる機能です。後ろから見たシルエットにも楽しい感じが出るようにしたくて組み込みました。おもちゃみたいで可愛くないですか？
>
3.ダメージでこっちを向く！
被ダメージをわかりやすく、かつコミカルにしたいということでディレクターから要望された機能です。ちょっぴり情けない顔が何度も現れるさまが面白く、自分でもお気に入りです。ちなみに、アクセサリーも一緒に動きます。
最後に
表情の変形の具体的な仕組みと、こだわりポイントを紹介させていただきました。かなり特殊な事例の紹介かと思いますが、楽しんでいただけたでしょうか？
他のプロジェクトでの採用が難しい類の技術ではありますが、なにかの参考になりましたら幸いです。
トイロジックではこのような特殊な表現・技術開発にも積極的に取り組んでいます！ この記事を読んで興味を持たれた方は是非採用ページにごアクセスください！