プレイしたゲーム一覧

ゲームアプリのUIを専門に考察してまとめています。
UIデザイナーをはじめ、ゲーム開発者の参考になればと思います。

現在114タイトル紹介済み (2020/7/27時点) 

「ウイニングイレブン クラブマネージャー」お知らせ画面のデザインとアニメーションがとても凝っていた！

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

「ウイニングイレブン クラブマネージャー」のお知らせ画面のデザインと、次のお知らせに遷移するときのアニメーションが手が込んでいました！紹介します！

どん！

見ての通り、封書っぽいデザインになっています。

次のお知らせに遷移するときなどは、にゅっと、封筒から手紙が出てくるアニメーションです。

▲にゅっと出てくる

どこに使われているかは様々ですが、こういったスキューモフィズムのデザインは時折見かけます。

ただ、スキューモフィズムデザインは個別のデザインになりがちです。

個別にデザインになるのであれば、ゲーム内でも特に訴求したい場所、没入感を高めたい場所に用いることが多く、お知らせ画面といった汎用的な画面ではこういったデザインになることは珍しいと感じました。

▲そういえば「Chess Rush」のお知らせの画面もデザイン入ってました

なぜ「ウイニングイレブン クラブマネージャー」のお知らせ画面がスキューモフィズムを用いて、この場所専用のデザインになっているのか考えてみました。

基本的にユーザーは文字を読みません。お知らせも読みません。

少なくとも、開発側は文字が読まれることに期待しない方が良いです。無意識に必要か不要かを判断して、必要であれば読まれるような仕組みになっていると認識した方が良いです。

それを踏まえた上での話になりますが、お知らせ画面は比較的よく見る画面です。

よく見る画面のため、システムっぽいデザインよりも丁寧なデザインをすることによってゲームへの没入感を高めようと考えたのかもしれません。

以上です。

スキューモフィズムのようなデザインをしたいと考えている際の参考になればと思います。

「スーパーロボット大戦X-Ω」フレンド画面にTwitter募集の導線があったので紹介

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

「スーパーロボット大戦X-Ω」にTwitterでフレンドを募集する機能が付いてて驚きました。

こちら。

確かにTwitterでフレンド募集している人多いですもんね。

導線を設置することにより、ユーザーのメリットですが…

• ユーザーの手数を減らす
• アプリ内ではマッチングしないユーザー同士もTwitterではマッチングする可能性がある

でしょうか…。

デメリットとしては

• テンプレートにユーザーが載せたい情報が含まれていない可能性
• または載せたくない情報が含まれている可能性

とかかな…。
比較的細かな拘りの無いライトユーザー向けの導線だと感じます。

導線を追加する際は慎重に行わなければなりません。
この画面に必要な導線なのか、常に表示させたいものなのか、少し階層が深くても許容されるものなのか、丁寧に考える必要があります。

そういったことを考慮する前提で「Twitterでフレンドを募集する」という導線も一つの選択肢なのかな、と感じたため紹介させていただきました。

フレンド画面をデザインする際の参考までに！

「ALTER EGO（オルターエゴ）」ゲームでは珍しく文字の扱い方が凝っていた

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

「ALTER EGO（オルターエゴ）」で凝った文字表現があったので紹介します！

どういった表現かというと…

こんな感じです。

フォントを個別に用意しているのではなく、画像として配置しているのかな、と思います。

このデザインによってどういった効果があるかは文脈などによって様々です。

漫画では狂気やホラーといった場面で使われることが多いです。ここでもそのような効果を狙っているように伺えます。

▲こわい

主なデザインの特徴として…

• 吹き出しの中に複数のフォントを配置
• フォントを変形する
• 文字間を不均一にする
• 先頭の文字は変形したりせず、可読性を担保する

などです。

可読性も低いですし、多用しすぎると刺激に慣れてしまったりもするので、
狂気じみた演出、ホラー的な表現をする際に限定的に使うのであれば良いのかな、と思います。

「ドラゴンクエストタクト」フィルタかけたらカテゴリによって見出しが表示されるデザインでした！分かりやすっ！

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

「ドラゴンクエストタクト」のソートで、ソートする項目によって小見出しが付く仕様になっていたのが良かったです！

いくつかソート項目があるのですが、以下の項目で小見出しが表示されていました。

• ランク
• 系統
• タイプ

▲ランクでソートした結果

▲系統でソートした結果

▲タイプでソートした結果

流れで見るとこんな感じです。

見出しがあることによって、目的のランク、系統、タイプなどが認識しやすくなります。

見出しが無い状態だと、カテゴリがどこで分かれているか分かりづらい。
(下図はHPが高い順でソートされています。カテゴリが分かれていなかった場合のイメージとして)

以上です。

このようにソートした結果もより分かりやすくできる工夫があるのだな、と感じました。画面をデザインする際の参考までに！