2022年04月のアプリゲームUIデザイン新着記事

「モンスターハンターライダーズ」無料販売とデイリーミッションのコンボ技

こんにちは！ちょこです！このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！今回は「モンスターハンターライダーズ」、通称「モンハンライダーズ」から、期間限定ショップで無料アイテムを販売している施策についてご紹介します。結構見かけますねー。一定の効果があるのか流行りなのか。いちユーザーの感想としては費用対効果が大きく、このデザインが取り入れられているゲームの場合、得られるものが何であったとしてもほぼ確実にショップに遷移してしまいます。単純接触効果（ザイオンス効果）がはたらき、ショップに遷移し…

2022/04/30 21:59

「モンスターハンターライダーズ」新機能ダイアログを見て気付いたことを6つあげてみた

こんにちは！ちょこです！このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！今回は「モンスターハンターライダーズ」、通称「モンハンライダーズ」から、新しい機能開放の案内と導線の設置についてご紹介します。今回はビジュアルデザインの話ではなく、情報設計に注目してみます。見た目を整える前に、どういった情報を表示しているのかも重要だと思っています。該当の画面はこちらです。「モンスターハンターライダーズ」ではある程度プレイしていくと様々な機能が開放されていく設計になっています。こちらはデイリー…

2022/04/29 16:49

「モンスターハンターライダーズ」ヘルプの導線が画面内にあるので参照しやすい

こんにちは！ちょこです！このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！今回は「モンスターハンターライダーズ」、通称「モンハンライダーズ」から、ヘルプはどのように見ることができるかについてご紹介します。遊んでいて分からないことがあったら、なるべく分かりやすい場所に説明文があると助かりますよね。該当の画面はこちらです。この画面は「信頼度」に関する説明が書かれたダイアログです。信頼度画面の中に「？」ボタンがありますが、そこをタップすると信頼度の説明のダイアログが表示されます。こちらですね…

2022/04/28 01:11

「モンスターハンターライダーズ」トラッキングの許可のダイアログの前に可愛い画像を表示することで要求に対してポジティブに受け止められるデザイン

こんにちは！ちょこです！このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！今回は「モンスターハンターライダーズ」、通称「モンハンライダーズ」から、トラッキングの許可をユーザーに推奨するをご紹介します。ユーザーの行動を誘導するデザインの事例として興味深いと感じました。該当の画面はこちらです。 iOSでゲームをプレイしている場合、トラッキングを許可するかどうかのダイアログが表示されます。そのダイアログを表示する前にトラッキングを許可して欲しい理由をユーザーに説明することができます。以下はA…

2022/04/27 00:20

「モンスターハンターライダーズ」下タブの事例とタブの数を4つまでにする情報の取捨選択

こんにちは！ちょこです！このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！今回は「モンスターハンターライダーズ」、通称「モンハンライダーズ」から、縦画面のゲームにおけるタブのレイアウトの事例をご紹介します。端末が大型化になるにつれ、タブが画面上部にあることで操作性が低下していました。画面下部にタブを配置することで操作性が向上するデザインになっています。該当の画面はこちらです。運営からのお知らせ画面です。お知らせの見出しが縦に7項目ほど並んでいます。画面下部には戻るボタン、閉じるボタン、ペ…

2022/04/26 00:56

「モンスターハンターライダーズ」アニメーションを使うことでユーザーの視線を誘導するデザイン

こんにちは！ちょこです！このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！今回は「モンスターハンターライダーズ」、通称「モンハンライダーズ」から、ホーム画面における初心者ミッションの導線を例に、情報の優劣の付け方の事例をご紹介します。情報の優劣の付け方には色々な要素がありますが、ここではアニメーションが使われていました。該当の画面はこちらです。画面右上にあるのが初心者ミッションの導線ですね。アニメーションで見るとこんな感じです。キャラクターや背景、画面下部にあるクエストボタンなどもアニメ…

2022/04/24 16:54

「モンスターハンターライダーズ」ボタンの中のテキストが具体的で分かりやすい

こんにちは！ちょこです！このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！今回は「モンスターハンターライダーズ」、通称「モンハンライダーズ」から、ダイアログのボタンの中にあるテキストが分かりやすい、というデザインをご紹介します。「はい」「いいえ」という汎用的なテキストではなく、より具体的なテキストの方が端的に伝えることができます。該当の画面はこちらです。シナリオスキップのダイアログです。ダイアログに表示されているテキストは以下の通りです。スキップ確認画面シナリオをスキップしますか？ …

2022/04/23 00:47

「モンスターハンターライダーズ」訴求控えめでシンプルなショップ画面

こんにちは！ちょこです！このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！今回は「モンスターハンターライダーズ」、通称「モンハンライダーズ」から、ショップ画面のデザイン事例をご紹介します。ソシャゲのUIとしてはちょっと懐かしさを感じる見た目ですが、このデザインの良いところなどを取り上げてみたいと思います。該当の画面はこちらです。上から順にカテゴリごとにボタンが並んでいます。「ショップ」のカテゴリには以下の3点のボタンが並んでいます。オーブ購入豪華パック期間限定ショップ一番上にある…

2022/04/21 23:30

「COUNTER: SIDE（カウンターサイド）」キャラクターに機能の説明をさせるタイプのチュートリアル

こんにちは！ちょこです！このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！今回は「COUNTER: SIDE（カウンターサイド）」から、キャラクター同士の掛け合いをしながらチュートリアルを進行するデザインをご紹介します。ゲームの特性を活かしたチュートリアルのデザインだと感じました。該当の画面はこちらです。画面右上にキャラクターのメッセージが表示されています。そういえば、さっき合流した社員たちはどこに行った？これは採用（ガチャ）で獲得したキャラクターたちがどこで確認できるか？という旨のメ…

2022/04/20 01:08

「COUNTER: SIDE（カウンターサイド）」ソシャゲのショップ画面でよく見る手法、アンカリング効果の紹介

こんにちは！ちょこです！このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！今回は「COUNTER: SIDE（カウンターサイド）」から、ショップ画面にあったアンカリング効果を利用したデザインをご紹介します。最近プレイしているソシャゲには比較的よく見かける気がしたけど、中国系に偏ってプレイしてたので、気のせいかも知れない。さて、アンカリング効果とは… アンカリング効果とは、先に与えられた数字や情報(アンカー)によって、その後の判断や行動に影響が及ぼされるという現象を表す心理学用語です。具体的に…

2022/04/19 00:09

「COUNTER: SIDE（カウンターサイド）」アンケート機能の紹介。40問は多い！

こんにちは！ちょこです！このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！今回は「COUNTER: SIDE（カウンターサイド）」から、アンケート機能をご紹介します。ユーザーの意見を調査することで、UI改修や機能改修を行う際の参考になるかと思います。該当の画面はこちらですアンケート機能のことを「カウンターサイド」第二回社長総会と呼んでいるのが特徴的ですね。世界観を表現していると感じました。アンケートに回答すると後日報酬が獲得できます。今回は「クオーツ150個」が報酬でした。アニメーション…

2022/04/17 22:29

「COUNTER: SIDE（カウンターサイド）」エンプティステートの紹介 Vol.25：好感度の高いキャラクターを採用し、ユーザーのストレスを軽減させたい意図を感じる

こんにちは！ちょこです！このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！今回は「COUNTER: SIDE（カウンターサイド）」から、エンプティステートのデザイン事例をご紹介します。色んなゲームのエンプティステートを紹介して今回で第25回目です。まず、「エンプティステート」とはどういうものか簡単にお伝えいたします。エンプティステートとは、表示する情報がない時にユーザーが見る画面のことだ。見落とされがちな「エンプティステート」のUXデザインが、実際は一番重要なのかもしれない TechC…

2022/04/14 23:37

「COUNTER: SIDE（カウンターサイド）」サムネイルを長押しすると表示されるリングゲージの端が光っている理由など

こんにちは！ちょこです！このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！今回は「COUNTER: SIDE（カウンターサイド）」から、サムネイルを長押しした時に表示されるリングゲージをご紹介します。該当の画面はこちらです。画面左側に現在編成中のパーティ、画面右側は控えにいるキャラクターたちです。編成中のパーティのサムネイルを長押ししてもリングゲージは表示されませんし、遷移もしません。控えにいるキャラクターのサムネイルを長押しするとリングゲージが表示され遷移します。アニメーションで見ると…

2022/04/14 00:50

「COUNTER: SIDE（カウンターサイド）」ユーザーの行動を促したり、世界観を支えるマイクロコピーの事例紹介

こんにちは！ちょこです！このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！今回は「COUNTER: SIDE（カウンターサイド）」から、世界観に寄り添ったマイクロコピーの事例をご紹介します。全部で4つあります。社訓入力欄メッセージ入力欄画面読み込み時ユーザーID まずは「社訓入力欄」です。こちらはプロフィール画面などから確認できます。こちらですね。いわゆる自己紹介文を「社訓」と表現しています。社訓が未入力の場合「社訓を入力してください」と、社訓の入力を促すメッセージが表示されていま…

2022/04/12 23:47

「COUNTER: SIDE（カウンターサイド）」チャットスタンプに文字情報がないのが気になったけど、エモート表現と何が違うのか考えてみた

こんにちは！ちょこです！このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！今回は「COUNTER: SIDE（カウンターサイド）」から、チャットスタンプに文字情報がないのが気になったけど、エモート表現と何が違うのか考えてみました。結論から述べると、言語コミュニケーションの場面に非言語コミュニケーションが混在することで、情報の欠落があると感じ、ストレスに繋がるのかなと考えました。ちょっと分かんないですよね…。自分でも上手くまとめられてないです。まず、チャット画面はこちらです。 2キャラで4種…

2022/04/12 02:58

「COUNTER: SIDE（カウンターサイド）」キャラクターにタグを付けて評価する仕組みの紹介

こんにちは！ちょこです！このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！今回は「COUNTER: SIDE（カウンターサイド）」から、キャラクターにレビューを付ける機能をご紹介します。該当の画面はこちらです。ユニット情報画面の下位階層からアクセスできます。画面右側にプレイヤータグを設定する領域があります。タグリストの中から任意の7つまで設定することができます。設定できるタグは以下の48項目です。高い攻撃高いクリティカル高い命中高いHP 高い防御高い回避速い攻撃遅い攻撃使い…

2022/04/11 00:11

「COUNTER: SIDE（カウンターサイド）」ミッションのカテゴリが14以上あるけど、特定の導線を強化してユーザーにやらせたいことの優先度付けをしている

こんにちは！ちょこです！このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！今回は「COUNTER: SIDE（カウンターサイド）」から、ユーザーが何をしたら良いのか迷わないためのショートカット機能をご紹介します。該当の画面はこちらです。メニューを開くと、次に何をするのが良いのか、オススメの導線が表示されます。表示されている内容としては概ね以下の通りです。ミッション名進行度ミッションをクリアするための導線クリア報酬次になにをするのが良いのか、オススメの導線が設置されているゲームはM…

2022/04/09 23:41

「COUNTER: SIDE（カウンターサイド）」配信を念頭に置いたゲーム設定があるよ

こんにちは！ちょこです！このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！今回は「COUNTER: SIDE（カウンターサイド）」から、配信を考慮したゲーム設定をご紹介します。該当の画面はこちらです。ゲーム設定画面の下部に「ストリーミング設定」という項目があります。設定の説明文は以下です。ストリーミング設定：UID、ニックネーム、コンソーシアム情報のブラインド有無を設定します。設定は以下の3つが選択できます。すべて表示相手の情報を非表示すべて非表示デフォルトでは「すべて表示」が選…

2022/04/09 01:31

「COUNTER: SIDE（カウンターサイド）」ついにRPG系のソシャゲにもスタミナ一括消費機能が登場

こんにちは！ちょこです！このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！今回は「COUNTER: SIDE（カウンターサイド）」から、スタミナの一括消費機能をご紹介します。スタミナ一括消費は音ゲーではしばしば見かけていましたが、RPG系だと初めて見たかもしれません。該当の画面はこちらです。クエストに行く前のパーティ編成画面ですね。画面下部にある「重複作戦」のボタンを押すとスタミナを一括で消費し、クエストの周回の時短に繋がっています。アニメーションで見るとこんな感じです。消費するスタミナ…

2022/04/08 00:16

「COUNTER: SIDE（カウンターサイド）」スワイプするメニューの見せ方って難しいな

こんにちは！ちょこです！このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！今回は「COUNTER: SIDE（カウンターサイド）」から、ホーム画面のメニューデザインをご紹介します。該当の画面はこちらです。よくある画面デザインですね。画面中央にキャラクター。画面右にメニューボタンが並んでいます。このホーム画面ですが、メニューボタン群をスワイプするとくるくると切り替えることができます。アニメーションで見るとこんな感じです。メニュー部分を大きくしました。「ホーム」と「管理」というカテゴリで分けら…

2022/04/07 01:52

「COUNTER: SIDE（カウンターサイド）」適度にフィクションを織り込んだ素敵なグリッチ表現

こんにちは！ちょこです！このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！今回は「COUNTER: SIDE（カウンターサイド）」から、会話パートのグリッチフィルタをご紹介します。このブログで紹介するの何回目だろう…。流行表現における試行錯誤している様子と、幅広いデザインが見れて好きなんですよね。該当の画面はこちらです。アニメーションで見るとこんな感じです。全体的に青色でキャラクターが描かれており、下から上にかけて走査線が流れています。分かりやすくするためにキャラクターの部分を大きくして…

2022/04/06 00:20

「COUNTER: SIDE（カウンターサイド）」画面によってサムネイルのデザインを変える事例の紹介

こんにちは！ちょこです！このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！今回は「COUNTER: SIDE（カウンターサイド）」から、サムネイルのデザインをご紹介します。該当の画面はこちらです。こちらは所持しているキャラクターの一覧画面です。グラフィックは比較的大きめで、画像に含まれている情報も多いです。特にキャラクターの名前までサムネイルに含まれているデザインは今まではあまり見たことは無かったです。情報が多くある、というのがこの画面のサムネイルのデザインの大きな特徴かなと感じました。…

2022/04/05 01:39

「COUNTER: SIDE（カウンターサイド）」BGMやSEの大きさのバランスを維持したままサウンドの音量調節ができる

こんにちは！ちょこです！このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！今回は「COUNTER: SIDE（カウンターサイド）」から、サウンドのオプション設定の中に全体の音量調整ができる項目をご紹介します。全体のサウンドを該当の画面はこちらです。サウンドの項目は以下の4項目です全体 BGM 効果音音声その中でも今回は「全体」の項目に注目します。多くのゲームは「BGM」「効果音(SE)」「音声(ボイス)」の項目で分かれるのみで、「全体」の項目は無いことが多いのかなと思います。「B…

2022/04/04 00:43

「COUNTER: SIDE（カウンターサイド）」育成中のキャラクターを抽出するのに便利なフィルタ機能

こんにちは！ちょこです！このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！今回は「COUNTER: SIDE（カウンターサイド）」から、育成中のキャラクターを抽出するフィルタ項目をご紹介します。育成中のキャラクターを抽出できることで効率的に育成パーティを組むことが出来ると考えられます。該当の画面はこちらです。画面左側にパーティが表示され、画面右側にはフィルタ項目が並んでいます。上から順に以下の項目になっています。レア度（SSR、SR、R、N）コスト（1～10）レベル（レベル1、育成中…

2022/04/02 02:29

「COUNTER: SIDE（カウンターサイド）」キャラ台詞の字幕表示の切り替え設定があることで、ユーザーのニーズに柔軟に応えられると感じました

こんにちは！ちょこです！このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！今回は「COUNTER: SIDE（カウンターサイド）」から、音声を再生する際に字幕を表示するかどうか切り替えられる設定をご紹介します。該当の画面はこちらです。ゲーム設定の中に字幕の表示を切りかえる設定があります。会話字幕：ロビーおよび台詞ウィンドウにユニット台詞字幕が表示されます。デフォルトはオンですね。オンの状態だといくつかの画面で、キャラクターの台詞に字幕が表示されます。例えばロビー画面の場合は以下の見た目…

2022/04/01 00:50