meycoのUX&UIデザイン技術メモ

@meycoがUIデザイナー&アーティストとして仕事する上で、役にたった事をひたすらまとめます。ゲームUI強めです。My portfolio site.: http://meycou.com/ noteで小説や漫画を書いています:https://note.mu/meyco

VOXCHRONICLEを作って思ったUIの反省点

前回書いたゲーム【VOXCHRONICLE】で気をつけたUIの話。リリースの続き。反省点をまとめました。

今後、ゲームを作る人の参考になればと思います。

 

 

反省点1:ボタンが小さくてタップしづらい

男の人は特にタップしづらいと思う。

今回のUIデザインは両手持ちなのですが、右側は基本の大きなボタン配置はいいとしても、左側の親指が細かい切り替えがやりにくかったかなと思います。もっとボタンを大きく、話して配置してもよかったですね。

解決策:実は、人間がタップする場所は若干上にずれている(参考資料)
なので、ボタンUIも上気味を意識して設置しなければならなかった。

 

反省点2:敵のレベルが色弱の人だと解らない


色で的キャラクターのレベル差異を出しているが、色弱の人に「敵のレベルがわからない」と注意が来たので。これは本当に申し訳ないと思っています。

解決策:もっとメリハリの有る明度、もしくは、柄を入れるなどして対応すればいい。

あとは色弱チェックを必ず行うようにする事。

 

反省点3:色使いすぎ。統一性が無い

ゲームは比較的カラフルにできてると思うのですが、今回はいろんな人がいろんな部分をバラバラに作っていたので、数字とか画面遷移の部分とかデザインがバラバラなのが苦しかったです。

WEBのデザインでは、色は3〜4色に抑えるべきですが、ゲームもあまり変わらないようです。

解決策:アートディレクターを入れる。

 

反省点4:音の反応が遅い

私の友人が「なんか音の反応が遅い気がする」と言っていたので、確認してみた。

確かに、言われてみたらちょっと遅いかも?と思いました。

Flasherならわかると思いますが、タイムラインで設定するときでも、音はちょっと早めに出すんですよね。この技術を次は応用しようと思います。人間は、思ってるよりも反応が遅いのです。

解決策:一拍分早く音がなるようにすれば、もっとスマートに曲が繋がり、UXも向上すると思う

 

反省点5:画面遷移アニメーションにイージング付けたかった

これは好みの問題だと思います。今回は細かなアニメーション指定まで出来なかったので、次回作る時に参考にしようと思います。

 

反省点6:ゲージの数が多すぎる

不必要なゲージや表示が多すぎる気がする。iphone自体の画面が狭いので、もっと画面に余裕をもった配置じゃないと辛い。ゲージのUIなどは、そぎ落とすデザインを行わなければいけない。

解決策:そぎ落とすデザインを行う。また、いいゲームUIを参考にする

 

反省点7:ボタン配色に気をつける

ポーズボタンを押した時に出る文章が、全て同じ色でした。辞めるのは赤、継続は緑とか、変えるともっと直感的かなと思いました。

また、appleが定めるヒューマンインターフェースデザインでは、押しやすいボタン幅は88px以上になっているので、もっと大きめでもよかったかなと思っています。

 

反省点8:プロモーションサイトは同時進行で作ったほうがいい

最近はTumblrがあるので、すぐにプロモーションサイトは作れるのですが、

同時進行でキャッチコピーや原稿を作っておいたほうがいいと思います。

実績として紹介する時に、プロモーションサイトは合ったほうがいいです。 

 

UIデザイナーは必ずダウンロードしておきましょう。

apple公式のヒューマン・インターフェースガイドライン。

https://developer.apple.com/jp/devcenter/ios/library/documentation/MobileHIG.pdf

 

参考までに書いてみました。次にゲームを作る時は、この辺りに気をつけて作ろうと思います。一度経験したから、次はちゃんとできる!