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

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

「スタートリガー」今日は、黒背景に赤文字の組み合わせはNGということだけ覚えて帰って欲しい

こんにちは!ちょこです!

 

「スタートリガー」の色覚多様性対応が気になりました…!

f:id:appgameui:20200627152959p:image

お知らせ画面!文字が赤い…!!

PhotoshopのP型フィルタで見るとこんな感じです。

f:id:appgameui:20200627225938p:plain

文字は結構見づらい感じです…。
赤字が悪いわけではないのですが、背面が暗い時に赤い文字を扱う際は注意が必要です。見落としやすくなってしまうので、伝えたい情報が伝わらなかったり、ユーザーにストレスを与えてしまいかねません。

 

ふと思ったのですが、右上の閉じるボタンもちょっとだけ見づらくなっていました。

f:id:appgameui:20200627233709p:plain

▲閉じるボタン

 

他の画面でも確認してみます。

f:id:appgameui:20200627153206p:image

 

PhotoshopのP型フィルタで見るとこんな感じです!

f:id:appgameui:20200627230101p:plain

訴求したい情報ではないと思うのですが、一見して一番見づらくなってしまっています。

 

上の画面はガチャ画面です。

ガチャ画面では基本的にユーザーは「進む」か「戻る」しか選択肢が無いわけなのですが、戻る導線が見落としやすくなってしまうと、ユーザーに不要な誤解や混乱を生んでしまいます。

 

色覚多様性に関してはしばしばこのブログでも取り上げているのですが、もしかすると概念自体が知られていない…? 

f:id:appgameui:20200627225938p:plain

正直、細かい色の指定ではないので、デザイナー以外でも対応可能な範疇だと思います。

ざっくり言うと、黒背景に赤字は見づらい色の組み合わせになる、ということだけ覚えておいていただくと良いのかなと思います。

 

もちろん他にもありますが、黒背景と赤字の組み合わせは頻出するので、まずはこの組み合わせだけNGであることだけでも知っておけば、最低限の事故は防げるのかな、と思っています。

 

▼参考書籍「カラーユニバーサルデザインの手引き」

カラーユニバーサルデザインの手引き

新品価格
¥880から
(2020/6/27 23:52時点)

「ドラゴンクエストウォーク(ドラクエウォーク)」DQウォークマイレージのカードのデザインに隠された遊び心

こんにちは!ちょこです!

 

ドラゴンクエストウォーク(ドラクエウォーク)」のパスのグラフィックにこだわりが見て取れたので紹介します!

f:id:appgameui:20200625233404p:plain

 

QRコードの中にスライムが…! 

f:id:appgameui:20200625234732p:plain

 

カードの番号は初代ドラクエの発売日の1986年5月27日が由来です…!

f:id:appgameui:20200625234813p:plain

▲「527 1986」

 

IPモノなのでこういうファンサービスは嬉しい気持ちになりますね!

 

先日紹介した「UX原論」にあてて分析すると、主観的利用品質の中に含まれる要素が関係しそうです。

appgameui.hatenablog.com

 

ショップにQRコードを表示するケースはあります。

f:id:appgameui:20200626000137p:plain

▲「アズールレーン」のショップ画面

 

f:id:appgameui:20200626000303p:plain

▲「購入ボタン」にQRコードが意匠されています

アズールレーン」のようにリアルに寄せるのもアリですが、IPならではのデザインを施すのもファンサービスを作り上げるという視点で見ると良いデザインだと感じます。

f:id:appgameui:20200625233404p:plain

 

余談ですが、数字の左の文字列はなんだろう、と思って調べてみました。

f:id:appgameui:20200625234813p:plain

 

どうやらアストルティア文字で書かれており「はじまりのひ」と読めることが分かりました。
f:id:appgameui:20200626004839p:plain

アストルティア文字風フォント配布サイト|DQ10関連リーサ制作物

 

超良いですね!!


通常、ゲームをプレイしているユーザーでこんなところを読む人は多くありません。
しかし、読まれない、一見して読めないからといって、手を抜かず、IPやユーザーに敬意を払う開発者の姿勢が伺えます。

f:id:appgameui:20200626005252p:plain

▲画面単体でみても文字が占める情報量としては僅か。

こういった丁寧な作り込みのひとつひとつがゲームの完成度、クオリティにつながるのだな、と感じます。

 

時々、読めないからといって適当に文字を並べる開発者がおり、何年か前にも話題になりました。
同じコストを割くのであれば、適当ではなくユーザーが発見した時に嬉しい気持ちになるようなデザインにコストを割く方が生産的だと考えます。

 

独自の文字をデザインするのもコストがかかります。なので、独自の文字が用意されている作品はそう多くはありません。

もし、独自の文字がデザインされているコンテンツに携わる機会があったら、ぜひ今回の「DQウォーク」の作り込みを思い出して欲しいです。

ユーザーを楽しい気持ちにする遊び心のあるデザインを心掛けることはゲーム開発者としての姿勢の一つなのかな、と感じました。

 

 

 

 

動画・生放送・画像投稿に関するガイドライン | SQUARE ENIX

このページで利用している株式会社スクウェア・エニックスを代表とする共同著作者が権利を所有する画像の転載・配布は禁止いたします。
© ARMOR PROJECT/BIRD STUDIO/SQUARE ENIX All Rights Reserved.

 

「ぼくらはみんなしんでいる」文字を遊ばせるときは崩すところと崩さないところに規則性があると気持ち良い

こんにちは!ちょこです!

 

「ぼくらはみんなしんでいる」というクリッカーゲープレイしてました! 

その中でフッターの文字が崩れたデザインになっているのが世界観を表現しているUIパーツだな、と感じました!

f:id:appgameui:20200615083834p:image

 

フッターはこちら。

f:id:appgameui:20200622231351p:plain

「侵略」「図鑑」「道具」「情報」などが傾いています。

 

これ、よくよく見ると…

  • 片方の文字はほとんど傾けていない
  • 先頭の文字だけ動かしている
  • ベースラインは大きく変えていない

という特徴が見て取れます。

理由は分からないけど、

  • 両方ともバラバラに傾けたら文字ではなくグラフィックとして認識されやすい。
  • 並んで表示したときに可読性が非常に下がった。

という可能性はありそう。

可読性が下がると、脳が勝手になんとか読もうとしてしまうのでストレスになります。

 

文字を遊ばせる時は少し意識してみると良いかもです!
遊ばせ方に困っている方の参考になれば。

「マジカミ」ホーム画面でキャラクターの誕生日がお祝いされていた!キャラの訴求になりそう

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

 

「マジカミ」でキャラの誕生日にホーム画面がデコレーションされていました!

f:id:appgameui:20200617063827p:image

季節感を演出するタイトルはしばしば見かけてきましたが、誕生日で画面を変えるのは初めて見たかも…

 

以下、ホーム画面で季節感を演出するタイトル例

f:id:appgameui:20191229153533p:plain

▲「ガール・カフェ・ガン」の2019年末デザイン

「ガール・カフェ・ガン」年末にかけてホーム画面やガチャ演出のデザインが変わっていた - アプリゲームUIデザイン

 

f:id:appgameui:20191014164027p:plain

▲「御城プロジェクト:RE ~CASTLE DEFENSE~」2019秋のデザイン

「御城プロジェクト:RE ~CASTLE DEFENSE~」ホーム画面でキャラクターが巨大化する演出の紹介。世界観を活かしてて独創的。(今はハロウィン風になっています) - アプリゲームUIデザイン

 

f:id:appgameui:20190910233201p:plain

▲「リンクスリングス」2019夏のデザイン

「リンクスリングス」季節感を取り入れるのは何のためか考えてみました。 - アプリゲームUIデザイン

 

バースデーミッションもあるんですね。

f:id:appgameui:20200617063832p:image

 

キャラクターを訴求するという視点で見たときに、起動直後のホーム画面をデザインするのは良いアイディアに感じました。

多くのソシャゲはキャラクターは多くなりがちです。

キャラクターが多すぎるとほぼ毎日誰かの誕生日になってしまうので、ホーム画面をデコレーションするというアイディアはあったとしても実装する機会が少ないのかも…。あとは誕生日不明なキャラクターがいた場合、お祝いできない、という問題もあるのか。

一部女性向けのタイトルでは推しの誕生日をリアルでも祝う文化があるようなので、全員を均等にお祝いするのは難しいかもですが、推しの誕生日のみデコレーションするのはアリかも…?すでにやってるタイトルあるのかな、あるならちょっと見てみたいです。

 

キャラクターを訴求したいタイトルであれば、こういった仕様を検討してみても良いかもと思ったので紹介させていただきました。

参考になれば幸いです。