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

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

「ブレイブリーデフォルト ブリリアントライツ」用語の説明にリンクテキストを採用した事例紹介

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

 

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

 

今回は「ブレイブリーデフォルト ブリリアントライツ」、通称「BDBL」から、ゲーム内用語のヘルプ機能についてご紹介します。

ほとんどのゲームにはマニュアルが用意されています。
用語集もそのひとつかなと思います。

 

該当の画面はこちらです。ヘルプ画面ですね。

f:id:appgameui:20220507110806p:image

 

画面左側が見出しで右側が本文という構成になっています。

本文内にある下線が引いてある青文字をタップすると関連するヘルプページにジャンプします。

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

見た目がリンクっぽくなっているので、直感的にタップすることができると伝わります。メンタルモデルが活用されていますね。

 

アニメーションで見ると以下の挙動になっています。

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

 

アプリの場合、テキストリンクが使われている箇所は限られているためwebっぽいデザインだと感じました。
スマホだけではなくPCでもプレイできるゲームであれば積極的に採用されることもあるのかな、という印象です。

 

 

また、テキストリンクはヘルプ画面だけではなくキャラ詳細で採用されていました。
こちらはちょっと挙動が異なっています。

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

 

アニメーションで見るとこんな感じです。

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

下線が引いてある「シールド」の文字をタップするとダイアログが表示されます。

 

同じテキストリンクではありますが、片方はページ内のジャンプ、もう片方はダイアログの表示という挙動です。
このように場所によって表示方法を使い分けをしています。
一貫性が損なわれると感じるかもしれませんが、ユーザーに与える学習コストには大きく影響は無いかと思います。

結果的には「分からない用語をすぐに調べることが出来る」という利便性は担保されており、すぐに調べられることで手数の省略にも繋がっている。

 

ゲームである以上、分からないことを少なくする努力も必要ですが、マニュアルを用意しないのも現実的ではありません。そのため出来るだけ調べやすくするための努力も必要かと思います。

 

ブレイブリーデフォルト ブリリアントライツ」のヘルプのデザインで感じたことは以下の3点です。

  1. リンクであることが分かる(メンタルモデルの活用)
  2. 不明な用語をすぐに調べることができる(手数の省略)
  3. PC版をリリースする際にも利用できるデザイン

 

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

 

 

以上です。

ゲーム内用語を説明したい時のデザインの参考になれば幸いです。

 

 

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

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

 

 

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

 


権利者さまへ

 

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

ブレイブリーデフォルト ブリリアントライツ」のガイドラインを確認したところ、公式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.
    記載されている会社名・製品名・システム名などは、各社の商標、または登録商標です。

 

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

 

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

 

お問い合わせ