こんにちは！ちょこです！ このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！ 今回は「アイドルマスター シャイニーカラーズ Song for Prism」（以下「シャニソン」）からガシャ結果をシェアする機能をご紹介します。シェアする情報を選べるのが珍しいデザインでした。 以下、概要です。 シェアする情報を選択できる シェアする文言が変わる シェア可能なアイドルの上限数も変わる シェアする画像にはタイトルロゴとコピーライトが追加 シェアする情報を選択できる 「シャニソン」のガシャ結果画面ではガシャ結果をシェアできます。 結果をシェアできるゲームはしばしば見かけますが、シェアする情報が選択できるのは珍しいと感じました。 シェアする情報は以下の３つから選択できます。 アイドルのみをシェア アイドルとガ

こんにちは！ちょこです！ このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！ 今回は「アイドルマスター シャイニーカラーズ Song for Prism」（以下「シャニソン」）からレビュー誘導のダイアログのデザインをご紹介します。レビューの数や評価を高めたい開発者が多いのか、しばしば見かけるデザインです。 以下、概要です。 イラストには新ユニットが描かれている イラストにアイドルからのメッセージが書かれている イラストはボタンが埋もれないような配色 ダイアログを表示するタイミングはガチャを引いた直後 イラストには新ユニットが描かれている こちらが「シャニソン」のレビュー誘導ダイアログです。 アイドルが描かれた魅力的なイラストが目を引きます。 描かれているユニットがナビキャラではないのが意外でした

こんにちは！ちょこです！ このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！ 今回は「アイドルマスター シャイニーカラーズ Song for Prism」（以下「シャニソン」）からアイドルの情報をフィルタする画面のデザインをご紹介します。 名前だけではなく、顔アイコンがあるとより直感的に分かりやすくなるのかも、と感じました。 何度か同じようなデザインを紹介しているので、興味があったら他のタイトルのデザインも見ていただければと思います。 以下、概要です。 顔アイコンが表示され直感的に分かりやすい アイドルたちの名前を覚える前のユーザーにとって分かりやすい キャラのイメージカラーは取り入れられていない アイドルの顔アイコンの優先度を上げたかった可能性 顔アイコンが表示され直感的に分かりやすい 「シャ

こんにちは！ちょこです！ このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！ 今回は「アイドルマスター シャイニーカラーズ Song for Prism」（以下「シャニソン」）からYouTubeを利用したアイドルたちの実在感を高める取り組みをご紹介します。 UIというよりUX寄りの視点です。「シャニソン」の世界観に対する没入感を高めるデザインの中に、アイドルの実在感を高めるアプローチがある、と解釈しています。 以下、概要です。 YouTubeに動画を残して実在感を高めている YouTubeでアーカイブが観れる アーカイブは6分程度 リアルタイム視聴すると限定シーンが観れる 配信前後の流れ １：事前にお知らせで予告 ２：配信中は専用バナーを表示して訴求 ３：リアルタイムで配信前のアイドルの様子が見

こんにちは！ちょこです！ このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！ 今回は「アイドルマスター シャイニーカラーズ Song for Prism」（以下「シャニソン」）からホーム画面にデザインのバリエーションを持たせている例をご紹介します。 ホーム画面は頻繁に訪れる画面なので、何かしら画面に変化を持たせたいと考える開発者やユーザーからの需要があったりするのかな…。 以下、概要です。 ホーム画面のデザインにバリエーションがある アイドルの専用ボイスも用意 稀にユニットのやりとりが見れる デザイン事例一部 ホーム画面のデザインにバリエーションがある 「シャニソン」ではホーム画面のいくつかの要素を変化させ、デザインにバリエーションを持たせていました。 今のところ以下の５つの要素の変化を確認しま

こんにちは！ちょこです！ このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！ 今回は「アイドルマスター シャイニーカラーズ（シャニマス）」（以下「シャニマス」）からアプリのデータサイズが少ない件に触れたいと思います。 アプリのデータサイズが大きいと端末の空き容量を圧迫してアンインストール候補になりがちです。データサイズが少ないとアンインストールの可能性が少し減る気がしているので気になりました。 以下、概要です。 データサイズは40MB以下 ダウンロードデータは…ある！ もしかするとブラウザのキャッシュ？ データサイズは40MB以下 こちらはiOSの設定画面から確認した「シャニマス」のデータサイズです。ものすごく少ないです。 iOS版の場合、アプリのデータサイズは以下の通りです。 Appのサイズ　

こんにちは！ちょこです！ このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！ 今回は「アイドルマスター シャイニーカラーズ」（以下「シャニマス」）からＰ（プロデューサー）デスク画面のアイドルタブの画面をご紹介します。 一見して情報量が多く余白の少ない画面ですが、実は見やすくするための工夫がいくつも施された画面でした。 以下、概要です。 表示されている情報量は多い 色とレイアウトでグルーピングされている マスキングテープの柄を利用し色弱対策も アイドルの名前の可読性を担保 表示されている情報量は多い この画面で表示されているアイドルは全員で26名です。使われている色数も多く、サムネイルも傾き、整列もされていないレイアウトです。 このような特徴から、賑やかで情報量の多い画面である印象を受けます。 で

こんにちは、ちょこです。 普段はUIデザインについて記事を書いています。 ここでは見た映画とそのきっかけを記載します。 おすすめがあったらコメント欄で教えていただければ、物理的に観れる作品は観ます。 M3GAN/ミーガン ブルーレイ+DVD [Blu-ray] ドラゴンボール超 スーパーヒーロー ザ・スーパーマリオブラザーズ・ムービー シティーハンター THE MOVIE 史上最香のミッション タイトル 観たきっかけ（観た日） M3GAN/ミーガン ブルーレイ+DVD [Blu-ray] Amazon Primeで観ました。おすすめに表示されたので。もしもドラえもんがメンヘラでガチ目にのび太君を教育しようとしたらこうなった、みたいな印象。 （観た日：2024/2/4） ドラゴンボール超 スーパーヒーロー Amazon Primeで観ました。おすすめに表示されたので。ブロリーが気になりました

こんにちは！ちょこです！ このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！ 今回は「アイドルマスター シャイニーカラーズ（シャニマス）」（以下「シャニマス」）からＰ（プロデューサー）デスク画面の中にあるホワイトボード画面をご紹介します。 機能としてはチュートリアル、各種ミッションをサポートするような画面で、ゲームに対する没入感を高めつつ、分かりやすさが両立している画面に感じました。 以下、概要です。 何から進めたら良いのか分かりやすいデザイン 余白に小物やアイドルの手書きコメントなどが描かれている グレーの矢印が両立のポイント 何から進めたら良いのか分かりやすいデザイン Ｐデスク画面のホワイトボードはこんな感じです。 白地の上にいくつかアイコンが並んでいますね。 ぱっと見て視線が向くのはホワイ

こんにちは、ちょこです。 今回は、目の不自由な方が困っていることをまとめました。 ゲームUIを取り扱うと目の不自由な方への対処も検討する必要があります。 そこで業界に限らず意見を列挙してみました。内容は随時更新します。 新しい発見やデザインでの解決につながることを期待します。 （更新：2024/1/16） 鉄道 目的の自由席の車両にたどり着きにくい 時間に制限がある中での乗り換え 目的地の最短ルートを目指したいが、どの出口から出るのが最適か分からない 買い物 商品陳列棚のレイアウトが変わる セルフレジが使えない 役所 書類の記入がしにくい 料理 IHが操作しにくい IHの現在の火力（弱火か強火かなど）の調整ができない IHを操作中、鍋が真ん中にないと言われてしまう 冷蔵庫の中に何がどのように入っているのか分からない 沸騰したお湯にうどんを入れられない 台所の調味料棚を開けてみたものの、どれ

こんにちは！ちょこです！ このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！ 今回は「アイドルマスター シャイニーカラーズ（シャニマス）」（以下「シャニマス」）からオプション画面のデザインをご紹介します。 オプション画面は多くのゲームで採用されている機能のため、参考になる機会も多いのかなと思います。 以下、概要です。 サムネイルがあって分かりやすい 確認ダイアログの表示、非表示が細かく設定できる 初期設定は初心者向け サムネイルがあって分かりやすい 「シャニマス」では各オプション項目にサムネイルが用意されているため、どういったオプションか直感的に伝わりやすいと感じました。 オプションを細かく用意するのは利便性にもつながるのですが、あまりに細かいオプションだとユーザーに端的に伝えにくくなります。結

こんにちは！ちょこです！ このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！ 今回は「アイドルマスター シャイニーカラーズ（シャニマス）」（以下「シャニマス」）から攻略動画を用意して、新規ユーザーをサポートする事例をご紹介します。 チュートリアルのデザインの参考になれば幸いです。 以下、概要です。 リリースから約3年8か月経った後に動画を公開 お知らせ画面から遷移できる プロデュース選択画面からも遷移できる リリースから約3年8か月経った後に動画を公開 「シャニマス」はYouTubeで攻略動画を公開しています。 お知らせを見る限り対象ユーザーについては以下のように書かれています。 プロデュースをはじめたばかりのプロデューサーさん必見！ ゲームをどう進めたらいいかお悩みの初心者プロデューサーさんに

こんにちは！ちょこです！ このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！ はてなブログに投稿しました #はてなブログ 今回は「アイドルマスター シャイニーカラーズ（シャニマス）」（以下「シャニマス」）からオーディションを受ける前に注意喚起のTIPSを表示するデザインをご紹介します。チュートリアルをデザインする際の参考になるかなと思います。 以下、概要です。 オーディション前に注意喚起をポップアップ オーディションの成功率を高めるためのTIPSも表示 TIPSにはナビキャラを使う オーディション前に注意喚起をポップアップ ゲームを進めていると、進行をフォローしてくれるTIPSがポップアップすることがあります。「シャニマス」のゲームの流れと合わせて説明すると以下の流れでTIPSが表示されました。