「ブレイブリーデフォルトブリリアントライツ」黒背景と赤文字の組み合わせは見づらいので避けたい

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

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

今回は「ブレイブリーデフォルトブリリアントライツ」、通称「BDBL」から、色覚多様性を考慮しておくと良さそうなデザインをご紹介します。

具体的には、黒背景に赤文字が採用されており、見づらいと感じた点です。
黒と赤の組み合わせは、C型であってもやや見づらい色の組み合わせですが、それ以外のP型、D型のユーザーを考慮すると避けておくのが良いとされる色の組み合わせです。

該当の画面はこちらです。

f:id:appgameui:20220522084729p:image

こちらはアイテム合成をする画面です。
画面右側に必要な素材数と現在の所持数が表示されています。

分かりやすくするために大きくしてみます。
分母が必要数、分子が所持数です。

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

所持数が必要数に満たない場合、数字は赤文字になっています。

これは恐らく特に注意を引いてほしい情報に対して赤文字を利用しているのだと推測します。ギフト画面でも注意文に赤文字が採用されています。

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

黒ではないですが、こちらも暗い色に対して赤文字なのでやや視認性は低い組み合わせですが、規則性はあるように感じます。

先ほどの分母分子の部分をPhotoshopのフィルタで確認するとこんな感じです。

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

どちらも見づらいですが、P型の方がやや見づらく感じます。
分母の数字に注目していれば見えなくもないのですが、コントラストが弱く、見落としやすいデザインだと感じます。

ゲームをプレイしていた時、特別この情報に注目することはないかと思います。
画面全体では多くの情報が表示されています。そもそも文字が書かれていることに気付かない恐れも考えられます。

例えばP型の見た目はこんな感じです。
◆◆◆◆◆◆◆◆◆◆◆◆◆◆

D型はこう。

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

白背景に黒文字が見やすく目に留まりやすいため、見づらい情報は一見すると見落としかねません。

ある程度ゲームに慣れていれば情報が見えなくても、存在することを推測できるかもしれませんが、ソシャゲはライトユーザーが多いので前提条件とするには厳しいと感じます。

対策として黒背景を止めるか、文字をオレンジに寄せるだけでも少し見やすくなります。

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

比較して見るとこんな感じです。Ｃ型のユーザーには赤と認識されつつ、Ｐ型とＤ型のユーザーには若干可読性が増すため、落としどころのひとつかなと思います。

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

まとめ

まとめると「ブレイブリーデフォルトブリリアントライツ」の必要アイテムが不足している時の数字の色の組み合わせについて感じたことは以下の１点です。

Ｐ型やＤ型のユーザーを考慮すると、可読性の低い色の組み合わせをするのは避けたい

他にも気付いた点があれば、コメント欄にて教えていただけると嬉しいです。

以上です。

文字色を指定する際の参考になれば幸いです。

このブログではこのようにゲームUIついて簡単にまとめて紹介しています。

他のゲームUIも紹介しているので、もし良かったら他の記事も見て行っていただけると嬉しいです。

権利者さまへ

以下はコンテンツ利用に関する認識の説明です。

「ブレイブリーデフォルトブリリアントライツ」のガイドラインを確認したところ、公式HPにて、SNSやwebサイトへのゲーム画像の投稿は許諾されている旨の記載がありました。

GUIDELINE |【公式】ブレイブリーデフォルトブリリアントライツ (BRAVELY DEFAULT BRILLIANT LIGHTS) | SQUARE ENIX

主な参照箇所を抜粋します。

【利用いただけるもの】
本ガイドラインに従い利用いただけるもの（以下「利用対象」といいます）は、以下のとおりです。

以下に記載の本ソフトの公式サイトおよび当社が運営する以下のサイト内に掲載されているテキスト・情報・画像・動画
https://www.jp.square-enix.com/bdbl_SP/

本ソフト内に表示されるテキスト、ゲーム中で撮影されたスクリーンショット、およびゲーム内で撮影された動画

【利用条件】

掲載・配信に際して、以下の権利表記を表示してください。

© SQUARE ENIX CO., LTD. All Rights Reserved.
記載されている会社名・製品名・システム名などは、各社の商標、または登録商標です。