Posted by ※文中の画像はStudio MGCMより提供されている『マジカミ』のものです。
この記事は GRIPHONE Advent Calendar 2019 23日目の記事です。
こんにちは、Unityエンジニアの米倉です。
今回は、アウトゲームで3Dキャラクター（以下、キャラと呼びます）を配置する上で比較的難易度が高かった、デッキ画面の事例を紹介いたします。
※アウトゲームとは、バトルなどメイン機能以外のゲーム機能画面のことです。
前提
デッキ画面で挙がった要望は以下でした。
・4体のキャラを1画面に並べたい
・キャラモデルが互いに刺さらないようにしてほしい
・キャラの衣装の横幅が1m~3mほどになる可能性がある
・キャラが並んだとき、身長差の関係がおかしくならないようにしてほしい
・なるべく動作を軽くしてほしい
以上の要望のもと、検証しながら仕様を決めていくことになりました。
検証
1.単純に4体並べてみる
図のように、単純に4体を画面に収まるように並べるとお互いのモデルがささってしまいました。
2.カメラを分けてみる
互いに刺さらなくするために、カメラを4台に分けて配置してみます。
無事、1.のキャラ配置のまま、互いに刺さらないようにすることができました。
しかしながら、4台のカメラそれぞれでグロー効果などのレンダリング処理が走るため、フレームレートが大きく低下してしまいました。
この段階で、あまりに重かったため「カメラは1台にする」という方針が決まりました。
3.カメラ1つで各キャラが刺さらないように離して並べてみる
カメラを1台にして、キャラが刺さらないように配置を変えてみます。
上記の図で見てみると、互いに刺さるのを避けた結果キャラ間の位置やカメラから遠くなり、迫力のない画面になってしまっていました。
また、左右のキャラがカメラから離れることでパースがかかってしまい、少し小さく、斜めから映ってしまっています。
4.キャラ同士を前後に離して並べてみる
横に離して並べるのは厳しいので、前後に離して並べてみました。
前後に配置することで刺さらなくはなっているものの、図のように奥のキャラはパースの影響で小さく見えてしまい、身長差が狂ってしまうことがわかりました。
これでは要件を満たせませんが、1カメラでお互いのモデルを刺さらず配置できる形に近くなってきました。
5.パースを調整する
4.で試したキャラ配置でほとんど問題ないことが分かり、あとは遠近のパースによる見え方の差を解消すればよさそうというところまで来ました。
そこで、カメラの設定を見直してみます。
今まで出てきた「パース」という概念は、Unityにおいては”Camera”コンポーネントの”Field of View”の項目で調整できる視野角のことを指します。
※”Field of View”は”FOV”と略されることが多いです。
ここを調節し、視野角を平行投影寄りにしてみます。
すごく平行投影に寄るため、以下のように超望遠のカメラ位置になります。
これで、互い違いに配置したまま身長差も狂わせることなく表示できました！
この結果をモデリング担当の方やUIデザイナーさんにも確認してもらい、関係者全員が納得する見た目に着地できました。
※今回紹介した配置は実際のゲームの配置とは異なります。
配置を工夫する上で大切なこと
FOVの値を変えたり、配置を極端にいじることはキャラの見た目の印象に関わります。
しっかりモデリングやデザインに関わる方と見た目を調整、確認しながら進めることが大切です。
まとめ
ここまでご覧いただきありがとうございました。
単純に「3Dキャラクターを表示する」という要件の中には、実は意外とたくさんの要件が潜んでいます。
他のタイトルでもこういった工夫がいろいろと取り入れられていると思うので、ぜひ一度そういった視点で見てみると面白いかもしれません。
