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

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

「ヘブンバーンズレッド」部隊編成画面のキャラサムネイルの上にレベルアップのボタンを配置してるのすごい

こんにちは!ちょこです! このブログでは「ゲームUIを見てみよう!」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです! 今回は「ヘブンバーンズレッド」、(以下、ヘブバン)から部隊画面のデザイン…

「ヘブンバーンズレッド」数字を無くしたサウンド設定画面、数字は何のためにあるのか?

こんにちは!ちょこです! このブログでは「ゲームUIを見てみよう!」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです! 今回は「ヘブンバーンズレッド」、(以下、ヘブバン)からサウンド設定画面の…

「ヘブンバーンズレッド」ホーム画面でキャラを目立つ配置にしてるけど、キャラの目を閉じさせることで過度にユーザーの視線を集めずボタンにも視線を向けやすいデザイン

こんにちは!ちょこです! このブログでは「ゲームUIを見てみよう!」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです! 今回は「ヘブンバーンズレッド」、(以下、ヘブバン)からホーム画面に配置す…

「ヘブンバーンズレッド」こだわりのマイクロインタラクション事例紹介15選

こんにちは!ちょこです! このブログでは「ゲームUIを見てみよう!」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです! 今回は「ヘブンバーンズレッド」、(以下、ヘブバン)からマイクロインタラク…

「ヘブンバーンズレッド」シンプルなアイコンだけど、工夫がたくさん詰まったデザインの紹介

こんにちは!ちょこです! このブログでは「ゲームUIを見てみよう!」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです! 今回は「ヘブンバーンズレッド」、(以下、ヘブバン)からフィールドマップの…

欧文書体の擬人化4コマ漫画「となりのヘルベチカ」

こんにちは、ちょこです! 今回、私が購入した書籍の中からゲームUIデザイナーさん向けに紹介する書籍はこちらです! 「となりのヘルベチカ」 欧文書体に興味を持つきっかけを作る新しいアプローチ? 「となりのヘルベチカ」は欧文書体を擬人化させた4コマ…

カリグラフィーに使われる代表的な欧文書体の解説「カリグラフィー・ブック 増補改訂版:デザイン・アート・クラフトに生かす手書き文字」

こんにちは、ちょこです! 今回、私が購入した書籍の中からゲームUIデザイナーさん向けに紹介する書籍はこちらです! 「カリグラフィー・ブック 増補改訂版:デザイン・アート・クラフトに生かす手書き文字」 感想としてはざっくり以下です。 読み物として読…

見栄えの良い文字の配置やデザインを考えた時の解決の糸口になりそう「レタースペーシング タイポグラフィにおける文字間調整の考え方」

こんにちは、ちょこです! 今回、私が購入した書籍の中からゲームUIデザイナーさん向けに紹介する書籍はこちらです! 「レタースペーシング タイポグラフィにおける文字間調整の考え方」 図も豊富な190ページ レタースペーシング≠カーニング カーニングの視…

フォント選びのお手伝い「[デザイン技法図鑑]ひと目でわかるフォントが活きるデザインの基本。」

こんにちは、ちょこです! 今回、私が購入した書籍の中からゲームUIデザイナーさん向けに紹介する書籍はこちらです! 「[デザイン技法図鑑]ひと目でわかるフォントが活きるデザインの基本。」 フォント選びが一目でわかるタイプの書籍 内容的には初心者向…

ほんとに基礎的な要素の概要が紹介されている「タイポグラフィの基本ルール」

こんにちは、ちょこです! 今回、私が購入した書籍の中からゲームUIデザイナーさん向けに紹介する書籍はこちらです! 「タイポグラフィの基本ルール」 発行は2010年です。2023年現在だと内容的にやや古いかもしれません。 また、この書籍に限りませんが、電…

「ヘブンバーンズレッド」色とアニメーションを利用して、画面内でとても目立つ時限式のボタンデザイン

こんにちは!ちょこです! このブログでは「ゲームUIを見てみよう!」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです! 今回は「ヘブンバーンズレッド」、(以下、ヘブバン)から一定時間選択しない…

「ヘブンバーンズレッド」ADV中の選択肢を選ぶ画面のデザインが視線と操作性を意識した直感的なデザインになっている

こんにちは!ちょこです! このブログでは「ゲームUIを見てみよう!」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです! 今回は「ヘブンバーンズレッド」、(以下、ヘブバン)からADVパートの選択肢の…

「ヘブンバーンズレッド」自動周回機能で寝てる間にレベルアップだ!

こんにちは!ちょこです! このブログでは「ゲームUIを見てみよう!」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです! 今回は「ヘブンバーンズレッド」、(以下、ヘブバン)から自動周回機能を紹介…

chromeで全画面スクショを撮影する方法【拡張機能不要】

こんにちは、ちょこです。 ここではGoogle Chromeで開いているページのスクリーンショットを撮影する方法を記載します。 ネットで検索すると、紹介されている情報が古くなってしまったため同じ手段が取れない状況になっていたり、拡張機能を別途用いる方法だ…

「咲うアルスノトリア」無料アイテムをショップ画面に設置するときの工夫

こんにちは!ちょこです! このブログでは「ゲームUIを見てみよう!」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです! 今回は「咲うアルスノトリア」、(以下、アルスノ)からショップ画面でアイテ…

「咲うアルスノトリア」アイテム詳細のダイアログから、そのアイテムを入手するための導線が設置されて便利

こんにちは!ちょこです! このブログでは「ゲームUIを見てみよう!」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです! 今回は「咲うアルスノトリア」、(以下、アルスノ)からアイテムの入手先を示…

「咲うアルスノトリア」ホーム画面でボイスが流れる時にテキストも一緒に表示されているので、UDの観点で見た時により分かりやすくなっているデザイン

こんにちは!ちょこです! このブログでは「ゲームUIを見てみよう!」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです! 今回は「咲うアルスノトリア」、(以下、アルスノ)からホーム画面でキャラボ…

「咲うアルスノトリア」押せるボタンの色が大体統一されてて分かりやすい

こんにちは!ちょこです! このブログでは「ゲームUIを見てみよう!」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです! 今回は「咲うアルスノトリア」、(以下、アルスノ)から押せるボタンの色の一…

「咲うアルスノトリア」左右スワイプでタブ切り替えできて便利!

こんにちは!ちょこです! このブログでは「ゲームUIを見てみよう!」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです! 今回は「咲うアルスノトリア」、(以下、アルスノ)から左右スワイプでタブ切…

「咲うアルスノトリア」キャラ一覧画面のモーダレスなフィルタ機能

こんにちは!ちょこです! このブログでは「ゲームUIを見てみよう!」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです! 今回は「咲うアルスノトリア」、(以下、アルスノ)からモーダレスな挙動にな…

「咲うアルスノトリア」時間差分があるタイトル画面は珍しい

こんにちは!ちょこです! このブログでは「ゲームUIを見てみよう!」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです! 今回は「咲うアルスノトリア」、(以下、アルスノ)から条件によってデザイン…

「咲うアルスノトリア」UIを透かすことで、奥行き感・賑やかさ・圧迫感の無さなどに繋がってるリザルト画面のデザイン

こんにちは!ちょこです! このブログでは「ゲームUIを見てみよう!」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです! 今回は「咲うアルスノトリア」、(以下、アルスノ)から圧迫感を抑えたクエス…

「咲うアルスノトリア」ルビない時は行間狭め、ルビある時は行間広めでデザインの出し分けがされてた

こんにちは!ちょこです! このブログでは「ゲームUIを見てみよう!」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです! 今回は「咲うアルスノトリア」、(以下、アルスノ)からADVパートの文章の行間…

座学中心で横断的にタイプグラフィが学べる書籍「デザインを学ぶ3 文字とタイポグラフィ」

こんにちは、ちょこです! 今回、私が購入した書籍の中からゲームUIデザイナーさん向けに紹介する書籍はこちらです! 「デザインを学ぶ3 文字とタイポグラフィ」 大まかな構成としては座学が中心で教科書のような書籍です。書籍の目次としては以下の通りです…

人物に焦点を当てつつインフォグラフィック周りの歴史が知れる「インフォグラフィックスの潮流:情報と図解の近代史」

こんにちは、ちょこです! 今回、私が購入した書籍の中からゲームUIデザイナーさん向けに紹介する書籍はこちらです! 「インフォグラフィックスの潮流:情報と図解の近代史」 全体の感想 基本的には読み物系です。 デザインだけではなく、人物に焦点を当て、…

「鋼の錬金術師 MOBILE」非戦闘員のキャラをホーム画面に登場させることで自然に原作の魅力を伝えている

こんにちは!ちょこです! このブログでは「ゲームUIを見てみよう!」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです! 今回は「鋼の錬金術師 MOBILE」、(以下、ハガモバ)からストーリーの進行に合…

かわいいロゴデザインの制作過程が知れる「萌えロゴデザインぱーふぇくとまにゅある」

こんにちは、ちょこです! 今回、私が購入した書籍の中からゲームUIデザイナーさん向けに紹介する書籍はこちらです! 「萌えロゴデザインぱーふぇくとまにゅある」 2015年に出版され、主に可愛い女の子が登場、活躍するアニメやラノベなどのロゴを紹介した書…

事例が豊富でVtuberさんのロゴも紹介されてる「アニメ・ゲームのロゴデザイン」

こんにちは、ちょこです! 今回、私が購入した書籍の中からゲームUIデザイナーさん向けに紹介する書籍はこちらです! 「アニメ・ゲームのロゴデザイン」 エンタメ業界のロゴをデザインする時のヒントになりそう! 大まかには見本帳 見ごたえのあるコラム 事…

「鋼の錬金術師 MOBILE」キャラ強化に必要なアイテムが入手できるクエストへの導線と必要個数の表示は初心者から上級者まで役立つ

こんにちは!ちょこです! このブログでは「ゲームUIを見てみよう!」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです! 今回は「鋼の錬金術師 MOBILE」、(以下、ハガモバ)からキャラ強化画面からク…

「鋼の錬金術師 MOBILE」選択肢だけを見て判断できる確認ダイアログは便利

こんにちは!ちょこです! このブログでは「ゲームUIを見てみよう!」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです! 今回は「鋼の錬金術師 MOBILE」、(以下、ハガモバ)から確認ダイアログのボタ…