2019-11-29はじめに現代では多くの人々がスマートフォンやタブレットを所持し、ゲームを楽しんでいることと思います。向けの商用ゲームを作っています。モバイルゲームの開発には、多くの開発者を悩ませるちょっと困った事情があります。専有する領域があったりと様々です。物理的な大きさもバラバラですね。これまでに何度も頭を抱えてきたことでしょう。ゲーム開発者の方々が設計・実装するのを手助けする資料をまとめます。デザイナーやゲームデザイナー、ディレクターの人にとっても役に立つものがあるかと思います。ベースに話を進めますが、考え方は他のゲームエンジンを用いている場合でも有用でしょう。配置やカメラを調整するよう対応した際の動作画面です:現代のディスプレイ事情まとめ問題は起きてから対処するよりも、事前に認識して回避する方が対応が楽です。いうアスペクト比が世の中で最も多く見かけるディスプレイのサイズだったかと思います。登場したあたりから、世の中に「長い」端末が多く現れるようになってきました。以下に、主な端末のアスペクト比と発売時期を一覧します。越えるサイズになっています実機イメージ。忙しい我々開発者は気が付かなかったことにしましょう。デザイナーに衝撃を与えました。モバイルゲームの開発者であった僕も腰を抜かしたものです。端末にもノッチが流行りました。方式なども出てきました。いう新しい概念も持ち込みました。いう存在にも注目です。することもできるようですが、デフォルトでは画面中央下にバーが常駐しています。このため、横画面の場合でも画面の下側がセーフエリア外になることには注意が必要です。影響を受けやすいでしょう)固定アスペクト比や帯表示で楽はできないのか?エンジニアは一般化を好み、例外を嫌います。いうことは考えるでしょう。基準とすることが多いかと思います。画面領域を各端末に当てはめたイメージは、以下のようになります。収まらない範囲です):実際、上記のような固定アスペクト(範囲外は帯で隠す)で良いという指針を貫くのであれば、考えることは非常に少なくなります。考えるのは自然なことです。筆者としても、ユーザ目線でゲームを遊ぶ時は「帯表示が無い方がリッチで嬉しい」と感じます。商用ゲームであれば、可能な限り画面全体を使ったデザインが推奨されるでしょう。いうことは避けられません。水平方向、または垂直方向のどちらかの視野を固定してしまうと、画面サイズが変わった時の視野に差が出やすくなります。いう問題が起こりやすくなります。いうことでもあります。ソロで楽しむゲームでは別にそれでよいかもしれませんが、マルチプレイの対戦ゲームなどでは考えものです。した場合の見え方の差です:縦画面の場合は以下のようになります:具体的な対応方法やスクリプトについては後述します。いうことを覚えておいていただければと思います。ここいらで実際の世のゲームを異なるアスペクト比で見比べてみることにしましょう。世の開発者の皆さんがどのような苦労をしているかが分かるかと思います。つのサイズで比較します。スクリーンショットを撮って比較していきます。多めの縦画面ゲームから見ていきましょう。場合は無難に横を広げて対応、という方針です対応のコスパが良く、理にかなったやり方だと思いますちなみにこれは完全な余談ですが、筆者のお気に入りキャラは「蒼炎の軌跡」「暁の女神」に登場するワユです。描写のある縦画面のゲームを見ていきます。下側に黒帯が入っています。リリースされた、比較的新しいゲームを見てみましょう。実装されてそうな気がするタイトルです。リストのサイズが倍くらい変わるんですね...ホームスケイプ続いて横画面のゲームを見てみます。カジュアルなスリーマッチパズルから。シアターデイズ)ビジュアルが重要な商材となっている、アイドルゲームを見てみましょう。なっていますそのため、長い端末でプレイすると単純に横方向の見える範囲が広くなりますちなみにこれは完全な余談ですが、筆者の担当アイドルは永吉昴です。MOBILEさて、ゲームの視野はゲームプレイの優位性に影響します。ここで競技性の高いマルチプレイの対戦ゲームを見てみましょう。ことに注目です横長端末でも、横が広くは見えないように調整されています。そこを統一して公平性を保つようにしている、ということだと思いますクラロワ(クラッシュ・ロワイヤル)こちらは固定画面のゲームにはなりますが、縦持ちの対戦ゲームを見てみましょう。思ったより受ける印象に差が無いように感じました。カメラの対応イメージが掴めてきたかと思います。開発する際にどういった対応をすべきかを紹介していきます。「筆者ならこのように実装するかな」といった例ですが、同じような境遇にある開発者さんの足がかりになればと思います。セーフエリアのサイズが取得できるようになりました。対応した端末からもセーフエリアが取得できるようになっているようです。レイアウトする際の論理的な解像度です。描画領域がセーフエリア内に収まるようになります。