こんにちは！ちょこです！
このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！
今回は「グランサガ」から、提供割合の画面デザインをご紹介します。
よくあるソシャゲのガチャの提供割合と異なりグラフィックが目立つデザインでした。
該当の画面はこちらです。
アニメーションでページ全体をスクロールするとこんな感じです。
グランウェポンのサムネイルが並び、壮観に感じます。
この画面で何を見せたいか、というのを考えてみると、提供確率を見やすく表示するというよりはグラフィックを強く見せていると感じました。特にピックアップのグランウェポンは他よりも大きいグラフィックで表示されています。
画面上部に配置し真っ先に見せてる点、「登場確率UP」の文字をまぶしく光らせている点など、視線を誘導している工夫も見て取れます。
レイアウトやアニメーションを除いた情報にも注目してみます。
サムネイル部分だけを見てみると、グランウェポンの名前や確率も小さく表示していますが真っ先に視線が向くのはグランウェポンのグラフィックです。
文字情報にも注目してみます。
レアリティは枠のデザインから伝わるので「SSR」という可読性は少し低いデザインになっています。
実際「UP」「0.7525％」と比較すると文字のサイズが大きい割に視線は向かいません。
文字部分だけで比較するなら、UP⇒0.7525％⇒SSR⇒キャラ名の順番で目に留まるかと思います。
文字情報が一塊になっているので視線が無闇に散らないのも、認知コストを下げている工夫のひとつかなと感じます。
提供割合画面ではありますが、グラフィックがあることで確率よりも何が獲得できるか、というのを強く訴求している画面だと感じました。
そういった意味ではキャラクター図鑑画面の見た目に近く、提供割合は入手方法として捉えられるかもしれません。
運用が始まってしばらくすると排出されるキャラやアイテムが多くなります。
魅力的なキャラが埋もれてしまうことも考えられるため、提供割合画面でまとめて見せることでガチャを回す動機に繋がる可能性が考えられます。
ただ、排出される画像が多いとページが重たくなってしまう恐れもあります。
どの程度まで許容するかの判断は必要かもしれません。
以上です。
提供割合画面をデザインする際の参考になれば幸いです。
このブログではこのようにゲームUIついて簡単にまとめて紹介しています。
他のゲームUIも紹介しているので、もし良かったら他の記事も見て行っていただけると嬉しいです。
権利者さまへ
以下はコンテンツ利用に関する認識の説明です。
「グランサガ」のガイドラインを確認したところ、二次創作物の制作、SNSや共有サイトの投稿に関しては許諾されている旨の記載がありました。
主な参照箇所を抜粋します。
第3条 許諾および遵守事項
以下は確認したガイドラインページのキャプチャです。
画像利用、記事の内容について問題がありましたら、お手数ですがご連絡ください。
速やかに対応いたします。
