「永遠の7日-終わりなき始まり」ストーリー選択画面にて、いつもと違う雰囲気を醸し出すためにエフェクトが付いていた
こんにちは！ちょこです！ このブログでは「ゲームUIを見てみよう！」というテーマで毎日ゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです。 今回は「永遠の7日-終わりなき始まり」、通称「とわなな」にて、UIパーツを目立たせるためにアニメーションを用いたデザイン事例を紹介します。 該当のアニメーションはこちらです。 画面全体の動きを見るとこんな感じです。 画面中央にある帯にエフェクトが付いています。遠目で見ても、どこを目立たせたいのかがすぐに分かるかな、と思います。 どのようなアニメーションになっているのか、もう少し分かりやすくするために拡大してみます。 こ…
「永遠の7日-終わりなき始まり」グリッチフィルタの表現をUIパーツにも取り入れたデザイン
こんにちは！ちょこです！ このブログでは「ゲームのUIを見てみよう！」というテーマでゲームを紹介しています。少しでもゲームのUIに興味を持ってくれる方が増えると嬉しいです。 今回は「永遠の7日-終わりなき始まり」通称「とわなな」の会話パートのグリッチフィルタについて紹介します。 該当の画面はこちらです。 キャラクターのグリッチ表現以上に、UIのデザインも変えているのが大きな特徴と言えます。左右に並べて比較してみます。左側が通常時のUIです。右側がグリッチフィルタ適用時のUIです。 心情描写を表わす時や大声で叫ぶ時など、キャラクターの声色やトーンによってメッセージウィンドウのデザインを変えるゲー…
「三國志 覇道」デフォルト値を決めるだけでデザインはそのままで手数を少なくできる事例の紹介
こんにちは！ちょこです！ このブログでは「ゲームのUIを見てみよう！」というテーマでゲームを紹介しています。少しでもゲームのUIに興味を持ってくれる方が増えると嬉しいです。 今回は「三國志 覇道」のデフォルトの選択肢を設定することで利便性が高められる事例について紹介します。 該当の画面はこちらです！ まずは画面の内容を簡単に説明します。 この画面は資源と銭を一定のレートで交換することができる画面です。銭と交換可能な資源は以下の4種です。 兵糧 木材 石材 鉄鉱 ユーザーはこれらの資源の中から任意の資源を一種と、銭と交換する資源量を選択、決定します。 この画面において便利だと感じた点は、画面遷移…
「三國志 覇道」メンテナンス直前にゲーム画面に告知メッセージを表示して、確実にユーザーに届ける熱意のあるUI
こんにちは！ちょこです！ このブログでは「ゲームのUIを見てみよう！」というテーマでゲームを紹介しています。少しでもゲームのUIに興味を持ってくれる方が増えると嬉しいです。 今回は「三國志 覇道」のメンテナンス直前の告知UIについて紹介します。 該当の画面はこちらです。 このように画面の中央付近に、もうすぐメンテナンスに入る旨のメッセージが表示されています。 画面に表示されているメッセージは以下の通りです。 22:55頃にデータの更新を行います更新時に一度タイトル画面に戻されますが、改めてログインすることで引き続きご利用いただけます メッセージはタップすることで消すことができます。アニメーショ…
「三國志 覇道」戦闘と採取でアイコンのデザインを変えることで誤操作防止に繋がるかもしれない
こんにちは！ちょこです！ このブログでは「ゲームのUIを見てみよう！」というテーマでゲームを紹介しています。少しでもゲームのUIに興味を持ってくれる方が増えると嬉しいです。 今回は「三國志 覇道」のアイコンのデザインについて紹介します。 該当の画面はこちらです！ 注目してもらいたいのは画面中央のアイコンです。アニメーションで見ると、このように剣とクワのアイコンが表示されています。 状況を補足します。 「三國志 覇道」はスタミナを消費して部隊に対して実行するコマンドを選んでいくシステムです。 コマンドにはいくつか種類がありますが、主なコマンドとして以下の2つがあります。 ユニットを指定して戦闘す…
「ロマンシング サガ リ・ユニバース」過去の作品のクレジットがオリジナル表記で見ることができる
こんにちは！ちょこです！ このブログでは「ゲームのUIを見てみよう！」というテーマでゲームを紹介しています。少しでもゲームのUIに興味を持ってくれる方が増えると嬉しいです。 今回は「ロマンシング サガ リ・ユニバース」、通称「ロマサガRS」のクレジット画面について紹介します。 該当の画面はこちらです。 「ロマンシング サガ リ・ユニバース」のクレジット画面の大きな特徴として、過去作品のクレジットを見ることが出来る、ということが挙げられるかと思います。 確認することが出来るのは以下の13作品です。 ロマンシング サガ リ・ユニバース 魔界塔士サ・ガ サ・ガ2 秘宝伝説 サ・ガ3 時空の覇者 完結…
「ロマンシング サガ リ・ユニバース」チャットウィンドウを半透明にすると、ゲームの状況を把握しつつチャットも楽しめるデザイン
こんにちは！ちょこです！ このブログでは「ゲームのUIを見てみよう！」というテーマでゲームを紹介しています。少しでもゲームのUIに興味を持ってくれる方が増えると嬉しいです。 今回は「ロマンシング サガ リ・ユニバース」、通称「ロマサガRS」のチャット画面について紹介します。 該当の画面はこちらです。 画面上部にある吹き出しアイコンからチャットウィンドウを開く挙動になっています。こちらのアイコンですね。 このアイコンをタップしてチャットウィンドウを開くと、このような見た目になります。ウィンドウが透過し、背面のグラフィックが見えています。 チャットウィンドウを開いていてもゲームの進行状況が確認でき…
「ロマンシング サガ リ・ユニバース」ちょっと特殊なドロワーメニューのデザイン紹介
こんにちは！ちょこです！ このブログでは「ゲームのUIを見てみよう！」というテーマでゲームを紹介しています。少しでもゲームのUIに興味を持ってくれる方が増えると嬉しいです。 今回は「ロマンシング サガ リ・ユニバース」、通称「ロマサガRS」のUIパーツについて紹介します。 該当のUIパーツはこちらです。 アニメーションでみるとこのような動きをします。 このように画面の上部を除く、下と左右の3方向からメニュー群が表示されます。 分類するならドロワーメニューでしょうか…。 画面下部から登場するパーツはドロワーっぽい挙動なのですが… …画面左右から登場するメニュー群はちょっと唐突には感じます。 下部…
「ロマンシング サガ リ・ユニバース」商品購入を促進するために無料アイテムをショップに陳列する試み
こんにちは！ちょこです！ このブログでは「ゲームのUIを見てみよう！」というテーマでゲームを紹介しています。少しでもゲームのUIに興味を持ってくれる方が増えると嬉しいです。 今回は「ロマンシング サガ リ・ユニバース」、通称「ロマサガRS」の無料アイテムをショップに陳列する施策について紹介します。 該当の画面はこちらです。 このようにショップなのにも関わらず、無料アイテムがリストの一番上に並んでいます。 無料アイテムは実質的には配布と同じです。なので、ユーザー的にはショップに置かずに、ログインボーナスなどの直接配布をしてもらう方が、手数が省略できるため利便性が高まります。 このショップに無料ア…
「ロマンシング サガ リ・ユニバース」キャラモーションのプレビュー機能にダンスホールって付けるの賢い
こんにちは！ちょこです！ このブログでは「ゲームのUIを見てみよう！」というテーマでゲームを紹介しています。少しでもゲームのUIに興味を持ってくれる方が増えると嬉しいです。 今回は「ロマンシング サガ リ・ユニバース」、通称「ロマサガRS」のモーション確認画面の名前の付け方について紹介します。 該当の画面はこちらです。 この画面は「芸術の都ファーゴ」です。この画面の中には以下の2つの機能が内包されています。 ダンスホール コンサートホール 今回紹介するのは「ダンスホール」です。ヘルプによると「ダンスホール」は以下のように紹介されています。 キャラクターの様々なポーズを閲覧できる「ダンスホール」…
「ロマンシング サガ リ・ユニバース」サウンド項目のデフォルト値は中間値がおすすめ
こんにちは！ちょこです！ このブログでは「ゲームのUIを見てみよう！」というテーマでゲームを紹介しています。少しでもゲームのUIに興味を持ってくれる方が増えると嬉しいです。 今回は「ロマンシング サガ リ・ユニバース」、通称「ロマサガRS」のオプション画面のデフォルト値を紹介します。 該当の画面はこちらです。オプション画面ですね。 いくつかオプション項目が並んでいますが、ここではサウンド周りのオプション項目に注目します。 以下は初期状態です。デフォルト値がゲージの中間値になっているのが分かるかと思います。 しばしば最大値になっているゲームを見かけることがありますが、UIの観点から評価すると、中…
「ロマンシング サガ リ・ユニバース」ゲームボーイっぽいタイトル画面の作り込みがやばい
こんにちは！ちょこです！ このブログでは「ゲームのUIを見てみよう！」というテーマでゲームを紹介しています。少しでもゲームのUIに興味を持ってくれる方が増えると嬉しいです。 今回は「ロマンシング サガ リ・ユニバース」、通称「ロマサガRS」のタイトル画面のデザインを紹介します。 該当の画面はこちらです。 全体的にレトロ感が漂うデザインになっています。 ちなみにアニメーションで見るとこんな感じでした。 このノイズ！ SEが伝わらないのですが、スイッチ入れた時の音も再現しており、丁寧に作り込んでいます。 イベント期間中ということもあるのかもしれませんが、この表現は初めて見たかもしれません。 また、…
「僕のヒーローアカデミア ULTRA IMPACT」ロード中を示すアニメーションにデザインのバリエーションが用意されていた。単純接触効果に繋がるのかもしれない
こんにちは！ちょこです！ このブログでは「ゲームのUIを見てみよう！」というテーマでゲームを紹介しています。少しでもゲームのUIに興味を持ってくれる方が増えると嬉しいです。 今回は「僕のヒーローアカデミア ULTRA IMPACT」、通称「ヒロトラ」のロード中のアニメーションのバリエーションについて紹介します。 該当のアニメーションがある画面はこちらです。 画面右下に「now loading...」の文字が見えるかと思います。その傍らにキャラクターが表示されています。 このキャラクターのバリエーションが多く用意されていたので、事例として紹介します。 アニメーションで見るとこんな感じです。 それ…
「僕のヒーローアカデミア ULTRA IMPACT」特殊なUIパーツのアニメーションの実装事例
こんにちは！ちょこです！ このブログでは「ゲームのUIを見てみよう！」というテーマでゲームを紹介しています。少しでもゲームのUIに興味を持ってくれる方が増えると嬉しいです。 今回は「僕のヒーローアカデミア ULTRA IMPACT」、通称「ヒロトラ」の特徴的なUIパーツのアニメーションについて紹介します。 該当のUIアニメーションがある画面はこちらです。こちらはクエストクリア画面です。 画面下部に表示されている情報ウィンドウの表示アニメーションに注目します。 アニメーションで見るとこんな感じです。 該当箇所を拡大してみます。ちょっと特殊な動きをしているのが分かるかと思います。 通常、こういった…
「僕のヒーローアカデミア ULTRA IMPACT」小さな文字は輪郭線で囲うのではなく、シルエットを単純化させた下地を敷くことで可読性を高める工夫が隠れていた
こんにちは！ちょこです！ このブログでは「ゲームのUIを見てみよう！」というテーマでゲームを紹介しています。少しでもゲームのUIに興味を持ってくれる方が増えると嬉しいです。 今回は「僕のヒーローアカデミア ULTRA IMPACT」、通称「ヒロトラ」のUIパーツの中の文字加工について紹介します。 該当のUIパーツがある画面はこちらです。 こちらはキャラ画面のトップ画面です。「チーム編成」「強化」「プレイキャラ」「メモリー」といったボタンが並んでいます。 その中のひとつの「強化」の文字について注目します。 このように文字の周囲に輪郭線があることが分かるかと思います。 続いて別の画面を見てみます。…
こんにちは！ちょこです！ このブログでは「ゲームのUIを見てみよう！」というテーマでゲームを紹介しています。少しでもゲームのUIに興味を持ってくれる方が増えると嬉しいです。 今回は「僕のヒーローアカデミア ULTRA IMPACT」、通称「ヒロトラ」のUIパーツの色設計について紹介します。 象徴的な例として、ホーム画面のUIパーツを紹介します。 画面下部を見てみると、メインメニュー類のアイコンの色が白黒でデザインされていることが分かります。 メインメニュー以外のアイコンも白黒のデザインです。 メニュー画面にある各種アイコンも同様のデザインです。 こんな感じですね。 ゲームUIの場合、画面を賑や…
「三國志 覇道」メンテナンス中でもユーザーの期待感を煽るテキストを表示するデザイン事例
こんにちは！ちょこです！ このブログでは「ゲームのUIを見てみよう！」というテーマでゲームを紹介しています。少しでもゲームのUIに興味を持ってくれる方が増えると嬉しいです。 今回は「三國志 覇道」のメンテナンス中に表示されるメッセージについて紹介します。 該当の画面はこちらです！ このように、ゲームがメンテナンス中であれば、メンテナンスであることを告知するダイアログが表示されています。 表示されているメッセージは以下の通りです。 1周年記念の大型アップデートのため メンテナンスを実施中です お楽しみにお待ちください メンテナンス予定時間： 09:00〜18:00 ここで注目したいのは以下の3つ…
「僕のヒーローアカデミア ULTRA IMPACT」アドベンチャーパートがコミック風のデザインだった
こんにちは！ちょこです！ このブログでは「ゲームのUIを見てみよう！」というテーマでゲームを紹介しています。少しでもゲームのUIに興味を持ってくれる方が増えると嬉しいです。 今回は「僕のヒーローアカデミア ULTRA IMPACT」、通称「ヒロトラ」のアドベンチャーパートのデザインについて紹介します。 該当の画面はこちらです！ 全体的にコミックをモチーフとして取り入れているのが特徴のデザインです。 具体的な特徴としては、キャラクターを枠で囲ったり… メッセージウィンドウを吹き出しっぽいデザインにするなどです。 他にも、コマの背景に集中線を付け、よりコミックらしく表現する工夫も見逃せません。 状…
「聖闘士星矢 ゾディアック ブレイブ」タイトル画面にサイン色紙を表示する柔軟な発想に驚きました
こんにちは！ちょこです！ このブログでは「ゲームのUIを見てみよう！」というテーマでゲームを紹介しています。少しでもゲームのUIに興味を持ってくれる方が増えると嬉しいです。 今回は「聖闘士星矢 ゾディアック ブレイブ」のタイトル画面について紹介します。 該当の画面はこちらです！ はい、タイトル画面にサイン色紙が表示されるんです…。 より正確に表現するなら、タイトル画面の一連の流れの中にサイン色紙が表示されるシーンがある、といった感じでしょうか。 流れで見るとこんな感じです。 ゲーム内にこのような画像を入れるデザインは初めて見ました。 う～ん…デザインの意図を推測してみるに… 聖闘士星矢はオリジ…
「三國志 覇道」タスクが完了してから送る通知と、完了する少し前に送る通知
こんにちは！ちょこです！ このブログでは「ゲームのUIを見てみよう！」というテーマでゲームを紹介しています。少しでもゲームのUIに興味を持ってくれる方が増えると嬉しいです。 今回は「三國志 覇道」のスタミナが回復した時の通知メッセージについて紹介します。 該当の画面はこちらです！ 「三國志 覇道」では施設の強化完了時や部隊の帰還時など、様々なシーンで通知メッセージを受け取ることができます。 添付した上記の画像はスタミナが回復した際のメッセ―ジです。 軍令書がまもなく全快！ [S20]状況を確認し、部隊に命令を出しましょう このように書いていますね。 興味深いのは「全快完了した」のではなく、「ま…
「三國志 覇道」優先度の低いUIを非表示にする設定があると、結果的に重要な情報を目立たせることに繋がるのかも
こんにちは！ちょこです！ このブログでは「ゲームのUIを見てみよう！」というテーマでゲームを紹介しています。少しでもゲームのUIに興味を持ってくれる方が増えると嬉しいです。 今回は「三國志 覇道」のUIパーツの表示、非表示の切り替えオプションについて紹介します。 該当の画面はこちらです！ プレイヤー都市名 推奨ミッション 攻城戦ガイド 遠景時主要都市名 など、UIの表示に関するオプションが用意されています。 今回の記事で紹介するのは「プレイヤー都市名」の表示に関する項目です。 切り替えられる内容を見ると、以下の4パターンが用意されていました。 （プレイヤー都市名を…） 表示（する） 非表示（に…
「三國志 覇道」ミッション達成を通知するUIが、そのまま報酬受け取りに変化したり、ミッションに関係する画面に遷移するUIに変化してめちゃ便利
こんにちは！ちょこです！ このブログでは「ゲームのUIを見てみよう！」というテーマでゲームを紹介しています。少しでもゲームのUIに興味を持ってくれる方が増えると嬉しいです。 今回は「三國志 覇道」のミッションの報酬受け取りの方法のデザインと導線設計について紹介します。 該当の画面はこちらです！ 具体的には、画面右下にあるこちらのUIです。 このUIの特徴を整理して、以下の3点にまとめました。 ミッションが達成されたことをしっかりと通知している 報酬を受け取れる導線を設置している ミッション達成に関係する画面に遷移する です！ひとつずつ詳細を紹介します。 1：ミッションが達成されたことをしっかり…
「三國志 覇道」提供割合画面で登用済みかどうかを表示することでコレクション魂が刺激される！
こんにちは！ちょこです！ このブログでは「ゲームのUIを見てみよう！」というテーマでゲームを紹介しています。少しでもゲームのUIに興味を持ってくれる方が増えると嬉しいです。 今回は「三國志 覇道」の提供割合の画面のデザインについて紹介してみます。 該当の画面はこちらです！ 提供割合の画面デザインについて触れるのってあまりないのですが、ちょっと変わったデザインパターンだったので気になりました。 特徴としては以下の2点が大きいかと思います。 武将のサムネイルが表示されている 登用済みであることが分かる 提供割合の画面のデザインを考える前に、まず人材画面（ガチャ画面）の役割を考えてみます。 人材画面…
「三國志 覇道」ユーザーの購買行動を促すためにショップに無料アイテム置いてるんじゃないか説
こんにちは！ちょこです！ このブログでは「ゲームのUIを見てみよう！」というテーマでゲームを紹介しています。少しでもゲームのUIに興味を持ってくれる方が増えると嬉しいです。 今回は「三國志 覇道」の商店に並んでいる無料アイテムの役割について考えてみます。 該当の画面はこちらです！ 商店に置くことはユーザーにとっては最適では無い こちらが無料の商品です。毎日1セットだけ、銭と無償の石が獲得できます。 ユーザーから見ると、毎日配布するアイテムであればログインボーナスと同じ役割に見えます。 ただ、ログインボーナスと違うのは、受け取るためには商店に遷移しなければならないため、手数や時間がかかってしまう…
「三國志 覇道」フィルタリングした際に表示していないアイテムがあることを伝えていた。正確な情報を伝えて誤解を防止していると感じました！
こんにちは！ちょこです！ このブログでは「ゲームのUIを見てみよう！」というテーマでゲームを紹介しています。少しでもゲームのUIに興味を持ってくれる方が増えると嬉しいです。 今回は「三國志 覇道」のフィルタリングの結果、隠れているアイテムがある場合の表示方法について紹介します！ 文字で書くと分かりづらいかもしれないので、さっそく該当の画面を紹介します！該当の画面はこちらです！ こちらは武将が並ぶ画面です。注目していただきたいのはこちらです！ フィルタリングした結果、表示されてない対象がある、ということが示されています！ 武将リスト以外でもフィルタが実装されている場面では同様の実装になっているこ…
「三國志 覇道」出陣時や戦闘開始時などのボイスはサウンドUIの実例だと思った話
こんにちは！ちょこです！ このブログでは「ゲームのUIを見てみよう！」というテーマでゲームを紹介しています。少しでもゲームのUIに興味を持ってくれる方が増えると嬉しいです。 今回は「三國志 覇道」のボイスを利用してユーザーに情報を伝えるデザインについて紹介します！ 普段あまり意識することはないかもしれませんが、画面から目を離している時や目の不自由なユーザーに有効だと考えています。 今回紹介する主にボイスが使われている場面は以下の通りです。 出陣開始 戦闘終了 帰還開始 人材画面にて、求人の種別を切り替える 武将獲得 武将強化 商店に入店 兵士募集 負傷兵士の治療 いろんな場所で使われていますね…
「三國志 覇道」目的の敵や土地を見つけるためのサーチ機能が便利！
こんにちは！ちょこです！ このブログでは「ゲームのUIを見てみよう！」というテーマでゲームを紹介しています。少しでもゲームのUIに興味を持ってくれる方が増えると嬉しいです。 今回は「三國志 覇道」のサーチ機能について紹介します！ 該当の画面はこちらです！ これ、どういった機能かと言うと…周辺の敵、プレイヤー、資源が獲得できる土地などを抽出し、リストにしてくれる機能です！ 例えば、索敵して出陣する際はこんな感じで相手を選択することができます。 資源を獲得できる土地も探せます！ とても便利…！ このジャンルのゲームをPCで遊んでいた時は、広大な土地の中から手作業で探していた記憶があります。 自分で…
「三國志 覇道」親階層に戻らずに情報が切り替えられて便利に感じました！
こんにちは！ちょこです！ このブログでは「ゲームのUIを見てみよう！」というテーマでゲームを紹介しています。少しでもゲームのUIに興味を持ってくれる方が増えると嬉しいです。 今回は「三國志 覇道」の施設強化画面にて、親階層に戻らなくても施設情報に切り替えられる導線設計について紹介します！ 該当の画面はこちらです！この画面では資源を利用して、施設のレベルを上げることができる、といった操作を行う画面です。 この画面において便利な導線は、このように施設を切り替えることができる点です。 画面の左右に表示されている矢印ボタンをタップすることで、このように次々と施設を切り替えることができます。 親階層に戻…
「三國志 覇道」背景に時間差分があることで、よりゲームが楽しくなる
こんにちは！ちょこです！ このブログでは「ゲームのUIを見てみよう！」というテーマでゲームを紹介しています。少しでもゲームのUIに興味を持ってくれる方が増えると嬉しいです。 今回は「三國志 覇道」の内政画面の時間変化の表現について紹介します！ 該当の画面はこちらです！日中はこんな感じの見た目になっています。 日中のビジュアルは風の表現に注目 雲が薄く伸びていることから、上空では風が強く吹いている様子が伺えます。 同時に、建物からの煙は垂直に立ち昇っている様子から、地上近くでは風は吹いていない様子が伺えます。 このような風の表現から、穏やかさを含めつつ、戦乱の時代の躍動感が感じられるビジュアルの…
「三國志 覇道」サーバー選択画面をデザインする際はサーバーをどのように運用するのかも意識してデザインすると良さそう
こんにちは！ちょこです！ このブログでは「ゲームのUIを見てみよう！」というテーマでゲームを紹介しています。少しでもゲームのUIに興味を持ってくれる方が増えると嬉しいです。 今回は「三國志 覇道」のサーバー選択画面のデザインについて紹介します！ 該当の画面はこちらです！ 特に注目するのはこちらです。S11+S12という表記になっています。 これは「サーバー11とサーバー12が統合され、新サーバー6になった」という意味を示しています。 過去にこのブログで紹介したゲームではサーバーを統合するようなデザインではありませんでした。ですので、世界観を取り込んだデザインと言う評価軸で考えていましたが、「三…
「ブログリーダー」を活用して、appgameuiさんをフォローしませんか？
こんにちは！ちょこです！ このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！ 今回は「ファイナルファンタジーIX」（以下「FF9」）のゲーム起動直後に表示される、プレイ上の注意喚起のメッセージを紹介します。基本的には定型文なのですが、高速モードに触れている点が丁寧に作られている印象を受けます。以下、目次です。 特に「高速モード」に注意を促している 特に「高速モード」に注意を促している 「FF9」では多くのゲーム同様に、起動直後にプレイ上の注意について伝えるメッセージが表示されます。 健康のため、ゲー…
こんにちは！ちょこです！ このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！ 今回は「トライブナイン」のタイトル画面のデザインを紹介します。バリエーションが多く、没入感を高める効果があるようにも感じました。丁寧に作られている印象を受けます。以下、目次です。 再開するエリアに合わせて変化し、没入感が高い 現在のパーティを表示する 再開するエリアに合わせて変化し、没入感が高い 「トライブナイン」のタイトル画面は、ゲームを再開するエリアに合わせた背景が表示されます。 以下はタイトル画面とゲーム画面を比較し…
こんにちは！ちょこです！ このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！ 今回は「トライブナイン」の与ダメのアニメーションをご紹介します。取り上げられることは少ないし、いざ作ろうと思うと悩みそうな部分かな、という印象です。 以下、目次です。 与ダメのアニメーションが気持ち良い！ 通常の与ダメは「上下に揺れる」 クリティカルな与ダメは「ズーム」 連携時の与ダメは「右からスライドイン」 与ダメのアニメーションが気持ち良い！ 「トライブナイン」のバトルを見ていて気づいたのですが、与ダメの表示アニメーシ…
#container { width: 100%; } #box2 { float: right } こんにちは！ちょこです！ このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！ 今回は「トライブナイン」の会話パートのデザインをご紹介します。 丁寧なライディングで見た目が綺麗！ 以下、目次です。 丁寧なライティング設定 場面とキャラの立ち絵の両立 見え方のパターン紹介 赤系統 紫系統 青から緑系統 緑～黄色系統 その他 丁寧なライティング設定 「トライブナイン」の会話パートの特徴のひとつに丁寧なライ…
こんにちは！ちょこです！ このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！ 今回は「トライブナイン」のマップ機能をご紹介します。グラフィティという探索要素をサポートしてくれる機能が実装されています。 探索が楽になるデザイン！やったー！ 以下、目次です。 グラフィティは探索要素 グラフィティの情報が表示されるのが便利 どこにいても確認できるのが便利 段階的開示が利用されてて見やすい 情報の優先度にしたがった配色 グラフィティは探索要素 「トライブナイン」のグラフィティは探索要素のひとつです。発見した…
こんにちは！ちょこです！ このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！ 今回は「トライブナイン」のバトルスキップの機能をご紹介します。雑魚敵のバトルをスキップできる便利な機能です！結果的にユーザー体験のデザインに寄ったので、ゲームUIとは少し外れるかも？ 以下、目次です。 時短になる ストレスの軽減にもなる バトルスキップ時に世界観を含めたメッセージが表示される ユーザーがバトルシステムを理解しづらくなるかも？ 時短になる TAKE DAWN機能はキャラクターと敵との戦力差があるとフィールド上…
こんにちは、ちょこです！ 今回は「バイブコーディング」という単語を知ったので、試しにやってみました。 そろそろ夏休みに入りますし、自由研究にいかがでしょうか？ 以下、ざっくりしたステップと所要時間です。慣れてる方なら1分かからないかもしれません。 1時間目：バイブコーディングって何？（0:01） 2時間目：まったくの初学者に向けたバイブコーディングの適切な進め方を教えて？（0:02） 3時間目：最初の指示出し（0:03） 4時間目：仕様の追加（0:05） 5時間目：修正指示（0:06） 6時間目：一旦完了（0:07） 1時間目：バイブコーディングって何？（0:01） まず、言葉の意味を知らない…
こんにちは！ちょこです！ このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！ 今回は「トライブナイン」のエレベーターの操作パネルのUIをご紹介します。現実のデザインを丁寧に取り入れ没入感を高めつつ、不必要な情報を省いたデザインです。 ひとつひとつ丁寧に作られててすごい！ 以下、目次です。 没入感を高めるデザイン 1：ボタン配置が自然 2：読まれない文字も丁寧に扱う 3：階数がドットフォント フィクションのデザイン 没入感を高めるデザイン 「トライブナイン」ではエレベーターを操作する際、操作盤を模した…
#container { width: 100%; } #box2 { float: right } こんにちは！ちょこです！ このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！ 今回は「トライブナイン」のバトル敗北時に難易度を下げる救済措置をご紹介します。以下、目次です。 1：より多くのユーザーが楽しめる設計 2：敗北が無駄ではないと感じる 3：わかりやすいメッセージ 4：モチベーションを維持するラベリングとメッセージ 4-1：キャラクターからの応援メッセージ 4-2：キャラクターを「強化」と表現…
#container { width: 100%; } #box2 { float: right } こんにちは！ちょこです！ このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！ 今回は「トライブナイン」のSteam版とiOS版の画面を比較したのでご紹介します。以下、目次です。 プラットフォーム 1：Steam版はゲーム開始直後にキーコンフィグ設定がある 2：データ連携時に使用する外部サービスが違う デバイス 1：カーソルが用意されている 2：探索のレイアウトが違う 2-1：キャラクターのHPの位置…
#container { width: 100%; } #box2 { float: right } こんにちは！ちょこです！ このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！ 今回は「アストラルパーティー」のSteam版とiOS版の画面を比較したのでご紹介します。 Steam版とiOS版とで運営が異なっており、今のところサーバーも分かれています。コントローラーは非対応。対応デバイスはマウスのみです。 以下、目次です。 運営違いのため除外する要素 1：企業ロゴが違う 2：問い合わせ先のメールアドレ…
こんにちは、ちょこです。 ここではゲームUIデザイナー向けに、ソシャゲのガチャ画面などで見かける「特定商取引法に基づく表示」と「資金決済法に基づく表示」について記載します。 「法律で決まっているので表示する」という認識でも実務上は恐らく困らないと思うのですが、表示漏れの防止や表示の必要性を質問された際に回答できるように、もう少し詳しく知っておきたいな、と思ったため疑問に感じていることをGeminiを使って出力しました。 厳密な正確性まで担保できませんが、概ね納得できる内容かと感じました。もし疑問に感じたことがあれば各々調べてみてください。 以下、目次とGeminiの回答です。存在しないリンク先…
#container { width: 100%; } #box2 { float: right } こんにちは！ちょこです！ このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！ 今回は「アストラルパーティー」（以下「アスパ」）からキャラクターの露出の程度を変更できるナイーブエンジェルモードをご紹介します。 キャラクターの露出はUIデザイナーが直接コントロールできる部分ではないかもしれませんが、根底には「より多くの人に楽しんでもらいたい」という意思が含まれています。この意思は良いUIを作る際にも重要…
こんにちは、ちょこです！今回、私が購入した書籍の中からUIのアニメーションに興味がある方向けに紹介します。書籍でUIアニメーションが紹介されているのは結構珍しいかも…？ 「ゲームUI 作り方講座 Photoshop＆After Effectsで学ぶ、UIデザインとアニメーションの基本」 本書によると、想定読者は「就職して間もない新卒から入社3年目ほどの方」を想定している、とのこと。購入するとPhotoshopやAfter Effectsのファイルもダウンロードできるので、割と現場寄りの構成。 これらのことから、おそらく学生や非デザイナーに対しては書かれていないかもしれません。 また、モバイル端…
#container { width: 100%; } #box2 { float: right } こんにちは！ちょこです！ このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！ 今回は「クロノトリガー」のSteam版とiOS版の画面を比較したのでご紹介します。結論から述べると、今までのマルチプラットフォームとは違っていたり、移植を繰り返してきたタイトルであるため、ある程度前提情報が必要になると感じました。まずはマルチプラットフォーム対応の影響以外の要素を紹介します。 以下、目次です。 前提の話 除…
#container { width: 100%; } #box2 { float: right } こんにちは！ちょこです！ このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！ 今回は「星の翼」のSteam版とiOS版の画面を比較したのでご紹介します。結論から述べると、主にバトル画面とオプション項目に違いが見られました。なんとなくの印象ですが、バトル周りはSteam版準拠で作りつつ、バトル以外のメニューなどのUIはスマホを少し意識しているのかな、という印象を受けました。 以下、目次です。 1：バト…
「inZOI」の主な画面 タイトル名 inZOI タイトル画面 〇 〇 アバター作成 〇 アバター_年齢層 〇 アバター_気質 〇 アバター_人生 〇 アバター_プリセット 〇 アバター_表情変更 〇 アバター_ポーズ変更 〇 アバター_背景変更 〇 アバター_顔プリセット 〇 アバター_髪型 〇 アバター_肌 〇 アバター_顔の特徴 〇 アバター_目元 〇 アバター_化粧 〇 アバター_身体 〇 アバター_衣装 〇 〇 アバター_アクセサリー 〇 家族作成 〇 〇 ADV 〇 都市選択 〇 都市編集 〇 〇 〇 〇 〇 〇 〇 都市編集_にゃんストア 〇 都市の状態を調整 〇 魂の管理レポー…
「魔法少女まどか☆マギカ Magia Exedra（まどドラ）」の主な画面 タイトル名 魔法少女まどか☆マギカ Magia Exedra タイトル画面 〇 OPアニメ 〇 お知らせ画面 〇 ホーム画面 〇 〇 〇 ガチャ画面 〇 〇 ガチャ演出 〇 ガチャ結果 〇 交換所 〇 〇 プレゼント画面 〇 〇 パーティ画面 〇 パーティ編成_編成コピー 〇 ロード画面 〇 キャラ獲得 〇 限界突破 〇 キャラ編成 〇 〇 キャラ強化 〇 〇 キャラ一覧 〇 〇 キャラ詳細 〇 〇 キャラ_スキル 〇 〇 クエスト 〇 メインクエスト_トップ 〇 〇 メインクエスト_リスト 〇 メインクエスト_道中 …
こんにちは！ちょこです！ このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！ 今回は「レスレリアーナのアトリエ ～忘れられた錬金術と極夜の解放者～」（以下「レスレリ」）からメニューのデザインをご紹介します。 ビジュアルに特徴のあるメニューだったので、見せ方を模索したいときのアイディアの参考になれば幸いです。 以下、目次です。 放射状に配置したボタン 強調された調合ボタン フィッツの法則と視線誘導を考慮したレイアウト 放射状に配置したボタン 「レスレリ」のメニューの特徴として、各メニューアイコンが放射…
こんにちは！ちょこです！ このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！ 今回は「レスレリアーナのアトリエ ～忘れられた錬金術と極夜の解放者～」（以下「レスレリ」）からクエストのスキップ機能をご紹介します。 このブログでも何度か紹介していますが、クエストのスキップ機能はスタミナ制を採用しているソシャゲにはほぼ確実に実装されている印象です。 以下、目次です。 クエストの周回に便利なスキップ機能 最大値のボタンも便利 クエストの周回に便利なスキップ機能 「レスレリ」にはクエストスキップ機能があります…
こんにちは、ちょこです。 このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！ 今回はゲーム起動直後のロード画面で表示される、世界観が含まれたローディングメッセージの事例を紹介します。 「本コンテンツは、『星になれ ヴェーダの騎士たち』のために公式に作成されたものではなく、使用された情報又はデータの一部は開発会社の商標又は著作物です」 以下、目次です。 1：ゲーム内用語を用いる 2：時系列に沿って文章を順番に表示する 3：読めるだけの時間確保も必要 1：ゲーム内用語を用いる ロード中に表示されるメッセ…
こんにちは！ちょこです！ このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！ 今回は「星になれ ヴェーダの騎士たち」（以下「星になれ」）からゲーム起動時に表示される、ローディング中を表すメッセージを紹介します。久々の紹介。海外で開発されるタイトルに多く見られる印象です。 ▲「星になれ」のロード画面です 以下、目次です。 1：メッセージは2種類用意されている 2：メッセージには世界観を含めた言葉が使われている 3：時系列に沿った順番でメッセージが表示されている 1：メッセージは2種類用意されている 表…
こんにちは、ちょこです。 このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！ ここでは過去プレイしたゲームをもとに、レビューに誘導するダイアログをデザインする際に参考になりそうな要素をまとめました。レビューに誘導するダイアログをデザインする際の参考になれば幸いです。 以下、目次です。 1：キャラグラフィックを表示 専用グラフィックを表示 汎用的な立ち絵を表示 2：レビューボタンを目立たせる 3：ボタンには分かりやすいテキストを入れる 4：レビューを促すメッセージを表示 5：手書き風メッセージで世界観…
こんにちは！ちょこです！ このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！ 今回は「星になれ ヴェーダの騎士たち」（以下「星になれ」）から。レビューを促すダイアログのデザインを紹介します。▲「星になれ ヴェーダの騎士たち」評価ダイアログ 以下、目次です。 1：専用のダイアログを用意 2：ナビキャラを表示 3：星を5つ並べて高評価を訴求 4：特に訴求したい要素は文字色を変えて訴求 5：ダイアログの枠の外にボタンを配置し目立たせている 1：専用のダイアログを用意 他のアプリにも見られる傾向ですが、レビ…
こんにちは、ちょこです。 このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！ ここでは過去プレイしたゲームをもとに、サーバー選択画面のUIについてまとめました。サーバー選択画面をデザインする際の参考になれば幸いです。 以下、目次です。 設計 1：おすすめサーバーを表示する 2：デフォルトでおすすめサーバーを選択しておく 3：おすすめサーバーで始めるとインセンティブが獲得できる 4：サーバーの状態を表示する 5：サーバーの応答速度を表示する 6：サーバーが統合された場合の見せ方 7：サーバー内のキャラ…
こんにちは！ちょこです！ このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！ 今回は「ブレイクマイケース」（以下「ブレマイ」）からアカウント削除をする際の手順や見せ方のデザインをご紹介します。誤操作を防ぐために複雑な操作になっていると感じました。 以下、目次です。 アカウントを削除するためには文字列を入力する必要がある 強めの警告文でアカウント削除の意思を確認 例文がキーボードのUI隠れない アカウントを削除するためには文字列を入力する必要がある 「ブレマイ」ではアカウント削除時の方法はやや複雑な手…
こんにちは、ちょこです。 このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！ ここでは過去プレイしたゲームをもとに、ユーザーIDの表示方法についてまとめました。「配信者が安心してゲームを配信できるようにするために、ユーザーIDはどう取り扱うのが良いのかな…」と悩んでいる方の参考になれば幸いです。 以下、概要です。 1：タイトル画面ではタップして表示する形式が増えてきた 2：ゲーム内でユーザーIDを取り扱う場合、事前に表示を仄めかす場合もある 3：フレンド申請にはユーザーIDを使わない 4：タイトル画…
こんにちは、ちょこです。今回は「ブレマイ」のホーム画面に表示されているキャラの変更方法を紹介します。ミッションクリアのために操作が必要な方の参考になれば幸いです。 ホーム画面のキャラ変更方法は以下の手順で行えます。 【キャラ変更方法】 1：ホーム画面に遷移 2：画面右上の人型のアイコンをタップ 3：変更元のキャラを指定 4：変更後のキャラを指定 流れをアニメーションで見るとこんな感じです。 ▲ホーム画面に表示するキャラを変更する際の流れ アニメーションだと速すぎて分かりにくいかもしれません。一手ずつ説明します。 1：ホーム画面に遷移 まずホーム画面に移動します。 ▲「ブレマイ」のホーム画面 2…
こんにちは！ちょこです！ このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！ 今回は「ブレイクマイケース」（以下「ブレマイ」）からホーム画面でバッテリーの残量やwifiの接続状況が表示されているデザインをご紹介します。ゲームシステムにもよりますが、たまに見かけるデザインです。 以下、目次です。 ホーム画面でバッテリー残量とwifiの接続が確認できる 充電中と平常時の差分がある バッテリー残量がわずかになっても特に警告は表示されない ホーム画面でバッテリー残量とwifiの接続が確認できる 「ブレマイ」…
こんにちは！ちょこです！ このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！ 今回は「ブレイクマイケース」（以下「ブレマイ」）からADVパートでのルビの使い方をご紹介します。ルビを採用する際の使いどころ、ルビの設計思想の参考になれば幸いです。 以下、目次です。 キャラの名前にだけルビを振っている 読みにくい場所にルビが振られていると助かる 配信時の誤読防止にもつながる キャラの名前にだけルビを振っている 「ブレマイ」のADVパートでは、見た限りキャラの名前のみルビが振られていました。また、メッセージ…
こんにちは、ちょこです。 ここではUE5を学習する中で得た知見を書き残しておきます。同じくUE5を学習したいUIデザイナーさんの参考になれば幸いです。 久々にUE起動したら見慣れないレイアウトでした…。以前のレイアウトに戻す方法あるかなー…、とメニューを見てみたらありました。良かった。 ▲UIたちはどこへ… 以下の手順で以前のレイアウトに戻せました。 上部メニューから「ウィンドウ」を選択 「レイアウトをロード」を選択 「UEクラシック レイアウト」を選択 UE4のレイアウトに変更されたらOK ▲メニューから簡単に変更できます ▲UEクラッシック レイアウトを選択 見慣れたレイアウトだ！ ▲UE…
こんにちは！ちょこです！ このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！ 今回は「ブレイクマイケース」（以下「ブレマイ」）からメインコマンドにアクセスしやすいメニューのデザインをご紹介します。メインコマンドに対するアクセシビリティが高いデザインだと感じました。 以下、目次です。 メインコマンドにアクセスしやすいメニュー レイアウトが同じだから分かりやすい ボタンの色や形状で情報の優劣をつける 右端に寄せているから片手で操作しやすい 背景をぼかしてメニューが際立っている メインコマンドにアクセスし…
こんにちは！ちょこです！ このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！ 今回は「ブレイクマイケース」（以下「ブレマイ」）からユーザーIDについてご紹介します。体感だと2020〜2021年頃から扱いが変わってきた印象です。ユーザーIDの性質や取り扱いについて考えるきっかけになれば幸いです。 以下、目次です。 タイトル画面ではユーザーIDの表示・非表示が切り替えられる ゲームの中に入ったら非表示切り替え機能はない フレンド申請時にはフレンドNo.を使う タイトル画面ではユーザーIDの表示・非表示が…
こんにちは！ちょこです！ このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！ 今回は「ブレイクマイケース」（以下「ブレマイ」）からリザルト画面の特徴を紹介します。各パーツのアニメーションを利用して、視線の誘導をしつつ、何が起きているのか分かりやすく見せる工夫などがされていると感じました。 以下、目次です。 左上から右下に視線誘導するデザイン 情報の優先度に沿った、文字の大きさと表示する順番 ゲームを進めるために必要なボタンは目立つ上に押しやすい配置 左上から右下に視線誘導するデザイン 「ブレマイ」の…
こんにちは！ちょこです！ このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！ 今回は「ブレイクマイケース」（以下「ブレマイ」）からパズル部分に視線が集中される仕組みを紹介します。視線の誘導って割と自然にデザインされているので、意識して見てみると要素分解が難しい部分だと感じました。 以下、目次です。 周囲と比較して彩度が高い パズル部分がよく動く 面積が広い 「引き算のデザイン」を利用 角丸と角の使い分け 周囲と比較して彩度が高い 人は一般的に無彩色より有彩色、低コントラストよりハイコントラストのもの…
こんにちは！ちょこです！ このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！ 今回は「ブレイクマイケース」（以下「ブレマイ」）からスタミナを効率的に消費できる便利機能を紹介します。 以下、目次です。 豊富な便利機能 1:スタミナ一括消費機能 2:オート周回機能 3:スキップチケット 豊富な便利機能 「ブレマイ」には効率的にスタミナを消費する便利機能がいくつか実装されていました。ここでは以下の3点をあげます。 スタミナ一括消費機能 オート周回機能 スキップチケット それぞれ詳細を紹介します。 1:スタ…
こんにちは！ちょこです！ このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！ 今回は「ブレイクマイケース」（以下「ブレマイ」）からパズル画面のピースのデザインを紹介します。パズルゲームは色々ありますが、ピースのデザインはゲームの差別化のためにも重要視されがちなのかな、と考えています。 以下、目次です。 世界観を取り入れたデザイン 色だけではなくシルエットでも差別化されたデザイン 世界観を取り入れたデザイン 「ブレマイ」のピースのデザインはキャラクターの顔をデフォルメさせたような見た目になっています。…
こんにちは！ちょこです！ このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！ 今回は「ブルーロック Project: World Champion」（以下「ブルーロックPWC」）からトグルボタンのデザインをご紹介します。トグルボタンは多くのゲームに採用されることが多いUIコンポーネントのひとつです。汎用性の高いUIだと思うので、デザインする上で参考にしやすいかと考えます。 以下、目次です。 色と文字を使ってオンオフが分かりやすいデザイン 色と文字を使ってオンオフが分かりやすいデザイン 「ブルーロック…
こんにちは！ちょこです！ このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！ 今回は「ブルーロック Project: World Champion」（以下「ブルーロックPWC」）から使用されているフォントを紹介します。「ブルーロックPWC」ではいくつかのフォントが使われていますが、今回は『数字』に注目してみました。 以下、目次です。 世界観を伝えるフォントを採用 事例1：ゴールスコアは原作やアニメと同じ7セグメントフォント 事例2：戦力の数字はユニフォームの数字と似たフォント 余談（ユニフォームに使…
こんにちは！ちょこです！ このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！ 今回は「ブルーロック Project: World Champion」（以下「ブルーロックPWC」）から動きのあるホーム画面のデザインをご紹介します。ゲームの世界観やジャンルにもよりますが、個人的にはゲーム画面は常に何かしら動いていて欲しいので、画面が動いているのは好きです。 以下、概要です。 動く背景に隠された工夫がいっぱい レアリティの低いキャラでも動きが出せる 動きのない推しをホーム画面に設定しても寂しくない 動く背…
