「三国ブレイズ」チャット機能のボタン配置が自由に変えられる件

こんにちは、ちょこです。

「三国ブレイズ」にはチャット機能があるのですが、チャットボタンの位置が自由にカスタムできるようになっていたのが特徴的だと思いました。

該当の画面は以下です。

チャット機能のボタンはこちらです。

ホーム画面の例ですが、このようにチャットボタンが自由に動かせます。

このチャット機能は個人的には非常に扱いづらい存在です。

チャット機能をどこからでもアクセスできるようにしたい！という気持ちは分かるのですが、本当にその通りにすると情報の扱いとして最上位に設置せざるをえなくなります…。

その結果、画面でやらせたいことや、見せたい情報に干渉してしまいます。

例えばホーム画面以外だと、以下のような見た目になります。

常に最前面…。

ガチャ画面でも…

バトル中でも…

ガチャ演出中でも…

このように、常にチャット機能へのアクセスが可能であることを最重要にされるとシステム寄りにならざるを得なくなります。

これにより、以下のデメリットが考えられます。

• 没入感の低下
• 情報の優先度の合理性に疑問

「没入感の低下」についてですが、

ゲームUIの場合は没入感も重要な評価軸になります。そこのバランスを取るのが困難になります。

次に「情報の優先度の合理性に疑問」が生じる点ですが、例えば

ガチャ演出中にチャットにアクセスしたいか？

といった点です。

通常通りにゲームをプレイしていてどの程度その要望があるのか疑問に感じます。

一律にチャットボタンを画面に表示させるデザイン案を選択した場合、個々の画面や場面において適切なデザインか、疑問に感じる場面があります。

可能であれば、チャット機能にアクセスできる画面を限定した方が良いと考えます。

例えば、ゲームのスキーム的にバトルを周回することが多いゲームデザインであれば、クエスト選択時やバトル中の画面を中心にボタンを配置する、といった考え方です。

 。

▲バトル中は放置時間が長く続くのであればアクセスしても良さそう

以上です。

整理すると、チャット機能を実装する際は

• どこに表示させるのかの精査
• どのように表示するのか検討

をした上でデザインを検討するのが良いのかなと思います。
画面端に固定表示する方法が一般的ですが「三国ブレイズ」のようにボタンの位置を変えることが出来るデザインもあります。

最近、ゲーム内にチャット機能を実装するゲームが増えてきてます。
チャットボタンの位置が変えられることによる良し悪しは別にして、デザインの参考までに。

「三国ブレイズ」チェックボックスの見た目なのにラジオボタンの挙動をするUIパーツ

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

「三国ブレイズ」で見た目はチェックボックスで、挙動がラジオボタンになっている箇所がありました。

アンチパターンの事例として紹介します。

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

４つのアイテムの中から任意のアイテムを１つ選ぶ場面です。

UIパーツはチェックボックスを採用しているため、一見すると複数選択できるように見えます。

しかし、実際は１つしか選べません。

挙動としてはこのようになります。

複数項目の中の一箇所しか選択できないならラジオボタンを使用するのが適切です。

この辺りのルールは基本的なところなので、しっかり守って実装したいところです。

ちなみに他の場面ではチェックボックスのUIパーツが適切に運用されていました。 
こちらの方が自然な使い方に見えます。

特にこだわりがなければ、ユーザーの学習コストを増やす必要は無いと考えます。

開発側にとっても、間違ったデザインをコストをかけて実装して、デバッグすることは無駄です。そこにコストをかけるのであれば、他の実装にコストをかけた方が建設的だと考えます。

また、このような実績が世間に公表されていくと、それを見た開発者が間違った使われ方のUIを元に実装を指示をする可能性があります。

そういったことも避けたいので、アンチパターンは可能な限り周知して開発者側のリテラシーを高めていきたいです。

「三国ブレイズ」エンプティステートのデザイン紹介

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

「三国ブレイズ」からエンプティステートのデザインの紹介をさせていただきます。

個人的にはエンプティステートの知名度を上げたいと考えているので、積極的に紹介しています。

エンプティステートでは以下の場面で使われていました。

1：フレンドがいない時

フレンドがいない時の画面でキャラグラフィックが表示されていました。

吹き出しのデザインや文字の扱いなど、全体的に雑さが感じられます。

しかし、ここで参考にすべき点は「問題解決のための導線があること」です。

フレンドがいない事はユーザーの期待結果ではありません。

「三国ブレイズ」のフレンド一覧画面では、ユーザーの期待結果になるために、どうしたら良いのか解決するための導線が設置されています。

この導線があるおかげでユーザーの手数の省略や問題解決のための認知コスト、学習コストが下げられていると考えられます。

2：表示するアイテムが無い時

表示するアイテムが無い時にもフレンド画面と同様に、キャラグラフィックが使われていました。

この画面でも、アイテムはどこで入手することができるのか、という導線が設置されています。

ただ、気になるのは導線が２つ設置されていることです。

ゲームを始めたばかりのユーザーにはどちらの選択肢が適切なのか判断ができません。

もし「アイテム」という括りで複数の入手先があるのであれば、どのアイテムがどこで入手することができるのか、というデザインの方が実用的ではあるのかなと思います。

以上が「三国ブレイズ」のエンプティステートのデザインの話です。

以下は余談です。
エンプティステートの話です。

-------------------------------------------------------

エンプティステートの役割

エンプティステートの役割は基本的には以下です。

• 情報が空であることを示す

エンプティステートを使うメリット

ゲーム中にエンプティステートに画像を使うことのメリットとしては…

• ユーザーのストレス緩和
• 文字だけの表示よりユーザーフレンドリーさが増す
• 画像があるとゲームの世界観を伝えることができる
• 画面が賑やかになり、ゲームプレイ中の没入感が削がれない
• キャラクターの表情を利用して、キャラクターとユーザーの感情を一致させることにより、ユーザーの気持ちに寄り添うことが出来る

などが考えられます。

エンプティステートが使われる場面

過去のタイトルの事例を参考にすると、エンプティステートは以下の場面で使われていました。

• メールがない時
• フレンドがいない時
• 受け取れるプレゼントが無い時

この辺が上位ですね。採用頻度が高い画面です。

以下はタイトルによって文脈は異なりますが、アイテムがない時にも使われます。

• 表示するアイテムがない時
• ショップの商品が売り切れている時

どういった時にデザインを採用すれば良いか？

では、どういった時にエンプティステートに画像を用いれば良いのか、についてですが

• 他タイトルで使われている場面
• ユーザーがストレスを感じる場面（ストレスを感じる程度が大きいほど優先度は高い）

などが無難です。
ストレスに感じる場面については、ユーザーの主観、表示頻度、エラーの重要度にもよるので一律には決めづらいところです。

ですので、開発側の匙加減で良いかなと思います。

ゲームであれば「ここにあったら面白いかな」とかでも良いかもしれません。

エンプティステートをデザインする際に注意したいこと

エンプティステートをデザインする際に注意したいこととしては

• 問題を解決するための導線を配置すること
• キャラクターにしゃべらせる場合はキャラクターの人格を意識すること

などでしょうか。

エンプティステートが表示されるのはユーザーの期待結果ではありません。

なので期待結果が表示されるように、問題解決のための導線を配置すると利便性は高まります。

「キャラクターの人格を意識」とは、ユーザーが「このキャラクターはこのセリフを言わない」と思われないようにするための配慮です。

IPであれば原作中のセリフを使うのが無難ですが、必ずしもそうはいきません。
ゲーム独自でメッセージを用意する場合は、使用するキャラクターの人格にも配慮する必要があります。

以下は過去のデザイン事例です。興味がありましたらご参照ください。

appgameui.hatenablog.com

「ハムスターコレクション」スライドバーがありえないくらい可愛い

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

 「ハムスターコレクション」のスライダーバーがありえないくらい

かわいい…！！

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

こちらが「スライドバー」です。「スライダー」とも言ったりしますね。

動くともっとかわいいです！

ほんと、なんでここだけこんな熱量なんだろう…

以上です。

UIパーツとして見たら明らかに不要な情報が付与されているのですが、ゲームのUIとしてはハムスターの可愛さが表現されていて素晴らしいデザインになっています。

UIとしての最適解を突き詰めていくと、ついシステムに寄ってしまい世界観が無くなりがちです。
こういった遊び心も忘れずにデザインしていきたいな、と思いました。