ゲームアプリのUIデザイン

プレイしたゲームアプリのUIデザインに関して書き残します。毎日頑張って更新!

「アイドルマスター シャイニーカラーズ Song for Prism(シャニソン)」赤文字の使い方をまとめてみました

こんにちは!ちょこです!

このブログでは「ゲームUIを見てみよう!」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです!


今回は「アイドルマスター シャイニーカラーズ Song for Prism」(以下「シャニソン」)から赤文字の使い方をご紹介します。
赤文字を使っても強調されるかどうかは、下地の色や周囲の情報に埋もれないかなど、他の要素との兼ね合いもあります。ただ、一般的に赤は誘目性の高い色なので、強調色として使いやすいと感じるのかもしれませんね。

以下、概要です。

 

シャニソンでの赤文字の使われどころを分類してみた

「シャニソン」の画面を見ていると、主に以下の用途で赤文字が使われる頻度が高いと感じました。

  • 注意文言
  • ステータス
  • 減少する数字
  • 開発者が訴求したい情報(ピックアップ)
  • ユーザーの行動を誘導したいとき(ナッジ効果を期待?)

それではそれぞれの詳細を紹介します。

 

1:注意文言

f:id:appgameui:20240315100006p:image

よく使われている箇所として、まずは注意文言が挙げられます。
例えば「シャニソン」ではアイドルの移籍確認ダイアログで使われていました。

 

◆◆◆◆◆◆◆◆◆◆◆◆◆◆

移籍されたフェスアイドルのデータは削除されますが、フェスユニットのデータに影響ありません。

アイドルの移籍はやり直しができないリソースの削除で、やや慎重な操作が求められます。
操作を誤るとユーザーに不利益が生じる懸念もあり、ボタンの近くに注意文言を表示し、色とレイアウトを利用して目に留まりやすくしているのも特徴的です。

ただ、赤で書かれている文章を注意文言と解釈することはできますが、注意文言が必ずしも赤文字になっているわけではありません。

つまり、こういうことですね。

赤文字=注意文言
注意文言≠赤文字

ちょっと分かりにくいかもしれないので、具体例を挙げます。
例えば、通信環境が良い場所でダウンロードを勧める文言は赤文字ではありません。

f:id:appgameui:20240315101756p:image

◆◆◆◆◆◆◆◆◆◆◆◆◆◆
文頭に「※」を付けたり青文字で書いているため、注意を引こうとしている意図は感じますが、だからといって赤文字になるわけではありません

 

2:ステータス

f:id:appgameui:20240315100631p:image

特定のステータスを表示する場合、赤文字を使うこともあります。

「シャニソン」のプロデュース画面では「合宿参加不可」の文字列が赤文字で書かれていました。

◆◆◆◆◆◆◆◆◆◆◆◆◆◆

合宿参加不可

赤文字にすることで「夏合宿」や「シーズン1終了時」などの情報とは異なる性質を持つ情報だと分かります。
また、書かれている内容が「参加不可」であるため、何かしらの条件を達成すれば「参加可能」になることも推測可能です。
実際、ユニットのパラメーターが一定以上であれば合宿に参加可能になります。

このように特定のステータスを赤文字で表示することがあります。

 

3:減少する数字

f:id:appgameui:20240315100629p:image

リソースなど特定の数字が減る際、減った数字を赤文字で表示するケースもしばしば見かけます。
例えば「シャニソン」ではプロデュースを開始する際、消費するSTの数字と消費した後のSTの数字が赤文字で表示されていました。

◆◆◆◆◆◆◆◆◆◆◆◆◆◆

STを10消費してプロデュースを開始します。よろしいですか?

2 ▶ 0/100

ゲームはリソース管理が重要です。
HPを管理したり、残機を管理したり、手持ちの仲間を管理したり…

攻略が難しい場面は特にリソースにシビアになることが多いため、ユーザーが情報を見落とす確率を少しでも下げたいのかもしれません。

 

4:開発者が訴求したい情報

f:id:appgameui:20240207081000p:image

ここまでは強調されることでユーザーにメリットがある箇所を中心に紹介しました。
一方で、ユーザーにメリットは少ないものの、赤文字で書かれている箇所もあります。
これは運営側が特に訴求したい情報かと推測します。

例えば「シャニソン」では、ガシャに含まれる排出確率アップ中のアイドルの排出確率は赤文字で表示されています。

◆◆◆◆◆◆◆◆◆◆◆◆◆◆

情報を強調し他の情報と差別化することで、開発者とユーザー間で「このアイドルの排出確率がアップされているのだな」と認識を合わせやすくなると考えられます。

 

5:ユーザーの行動を誘導したいとき

f:id:appgameui:20240315100001p:image

やや特殊な使用例ですが、違和感を利用しユーザーの行動を誘導する際にも利用できそうです。
「シャニソン」ではアカウント連携が済んでいない場合、連携のステータスが赤文字で表示されていました。

◆◆◆◆◆◆◆◆◆◆◆◆◆◆

アカウント連携
未連携

ステータスが赤文字で表示されていることで、視線が向きやすい情報になっていると感じます。アイコンの横などに赤い丸を表示させる、いわゆる「ナッジ」のような使われ方に似ているかもしれません。

◆◆◆◆◆◆◆◆◆◆◆◆◆◆
▲赤い丸を表示しユーザーの注意を引くデザイン

 

実際、アカウント連携をすると文字色が赤から青に変わります。
文字色が青に変わると周囲の色と馴染みやすくなり、違和感がなくなります。

◆◆◆◆◆◆◆◆◆◆◆◆◆◆

アカウント連携
連携済

以上、「シャニソン」でどのような場面で赤文字が使われているかの事例を紹介しました。

 

頻繁に使わないから伝わる

赤文字に限りませんが、強調表現を行う際に注意したい点としては「使う場面を絞る」です。「シャニソン」は赤文字を使う場所を絞っており、基本的には画面内に1箇所程度です。

使う場所を絞っているからこそ、使われている場所に注目しやすくなっています。
あちこちに使われていると見慣れてしまい、目に入る刺激として弱くなります。

どういったときに強調表現を使うかだけではなく、どのように使うのかも気をつけたいと思いました。

 

以上です。
強調表現として赤文字を使いたい場合の参考になれば幸いです。

 

このブログではこのようにゲームUIついて簡単にまとめて紹介しています。
他のゲームUIも紹介しているので、もし良かったら他の記事も見て行っていただけると嬉しいです。

 


権利者さまへ

以下はコンテンツ利用に関する認識の説明です。
アイドルマスター シャイニーカラーズ Song for Prism」のガイドラインを確認したところ、以下の記載がありました。

当社では、ゲーム実況を、「ご自身がゲームを遊んだ動画や静止画をファンコミュニティ等とインターネット上でご共有いただくもの」と捉えています。 例えば、「ご自身によるゲームプレイ映像に、皆様の声や姿、アバターなどを重ねた動画又は配信をデジタルプラットフォーム(Youtube,Twitch,ニコニコ動画等。以下、単にプラットフォームといいます)上で共有すること」のみならず、「スクリーンショットやプレイ動画の切り抜きをインターネット上で共有すること」等も含みます。

【「アイドルマスター」シリーズ】「ゲーム実況ポリシー」の変更に関するお知らせ | 【公式】アイドルマスター ポータル(アイマス)

ゲーム実況ポリシー | バンダイナムコエンターテインメント公式サイト

 

これによりゲーム画面のスクリーンショットのブログの利用についてはガイドラインに従った前提で許可されている認識でおります。

バンダイナムコエンターテインメントゲーム実況ポリシーです。アイドルマスター シャイニーカラーズ Song for Prismにも適用されています。2022年1月26日制定版です

画像利用、記事の内容について問題がありましたら、お手数ですがご連絡ください。
速やかに対応いたします。

 

お問い合わせ