こんにちは、ちょこです。
「ドールズフロントライン」のカルーセルの下にある小さいボタンのデザインが、スクロールバーのような見た目になっていました。
初めて見るデザインでしたので、デザインのバリエーションを検討する際の参考までに紹介します。
該当の画面はこちらです。
UIコンポーネントとしてはホーム画面左下にあるこのパーツですね。
スクロールバーのようなデザイン
なんだかスクロールバーにも見えるデザインです。
カルーセルの下にあるUIパーツといえば、一般的には俵型のパーツを想像するかと思います。
例えば「サクラ革命」ではこのようなデザインでした。
「◆◇◇◇◇◇」
このように、カルーセルに登録されている画像の数だけマークが並んでいるデザインが一般的なのかなと思います。
しかし「ドールズフロントライン」の場合はマークは並んでおらず、ゲージのようなデザインになっています。
いくつのバナーがあるのか直感的に分からない
このデザインの特徴として、目新しさは感じるものの、既存のデザインと比較すると全体の画像量が分からない、という点があげられます。
この辺りは異論がありそうなところで、最近ではカルーセル周りの情報量は少なくするデザインも多く見かけます。
例えば「ドラゴンクエストタクト」では「サクラ革命」であったマークはありません。
このようにバナーだけが表示されています。
このように、どれほど画像が登録されているのか分からなくても良いのではないか、という考え方も最近では珍しくありません。
徐々に役割が変化している
元々は画像の量が分かるようなマークを付けるデザインが一般的でした。
カルーセルのデザインがスマホゲーに登場した当時はwebのデザインルールに則り、実装されていました。
今はあまり見かけないのですが、丁度「ドラゴンエッグ」のようなデザインが主流だったように感じます。
バナーの左右に矢印があり、下には画像の数を示すマークが並んでいます。
時を経て徐々に情報量が抑えられるデザインが増え、ついには「ドラゴンクエストタクト」のようにバナーだけのデザインも見られるようになりました。
▲「ドラゴンクエストタクト」では情報量が減り、シンプルなデザインになっている
このデザインに至った理由についてはハッキリとは分かりませんが、
- 訴求を中心とするデザインの終わり
- ホーム画面の情報量の増加
などが考えられます。
訴求を中心とするデザインの終わり
「訴求を中心とするデザインの終わり」について補足します。
開発者としては画像をすべて見てもらいたい、という気持ちがあります。
なので、画像の総量を表示し、ユーザーに情報の続きがあることを示しています。
しかし、画像をすべて見たい、という思考のユーザーは限られています。
徐々に開発目線ではなく、ユーザーの望む形のデザインになってきているのではないかと考えています。
ホーム画面の情報量の増加
「ホーム画面の情報量の増加」について補足します。
ゲームは徐々に多機能になり、ルールも複雑になってきています。
この理由の背景のひとつに、後発のゲームは先発のゲームよりも多機能であることが暗に求められている結果だと考えています。
ソシャゲに関わらず、コンシューマゲームでも家電でも、後発の製品の方が先発の製品と比較して、優れている部分がないと見劣りしてしまいます。
コンシューマや家電の場合は先発の製品が進化することはないのですが、ソシャゲの場合は運用を続けていく内に機能が増えたり利便性が高まります。
後発のゲームに求められる水準が高まっていった結果、ホーム画面での情報量が増えていき、難しいゲームに見えてしまいがちです。
なので、情報量を抑えても差し支えなさそうな情報はなるべく削ぎ、ゲームが複雑に見えないようにしているのかな、と考えています。
UIコンポーネントも時代と共に変化する
以上です。
今回はカルーセルを取り上げてみましたが、このようにUIコンポーネントのデザインも変化していきます。
既存のドキュメントには「カルーセルとはこういうものだ」という定義付けがされていることが多く、ルールを逸脱すると良くない、という思想があります。
それも事実ではありますが、ゲームUIの場合、あまりそれに縛られてしまうと利便性は担保されるものの、新しいデザインも生まれにくくなってしまったり、情報量のコントロールが出来ず、自縄自縛に陥ります。
基本は知った上でゲームに合わせてデザインに調整を加えることは必要なのかなと思いました。
「ドールズフロントライン」のカルーセルデザインが今後どのように発展していくのかは分かりませんが、新しいデザインの提案をする際のヒントになれば幸いです。
