ゲームUI考えた
前回からだいぶ更新が開いてしまいました。ごめんなさい！
地道な実装とシナリオ作業が続き、絵的に見せられるものがなかった…とはいえもう少し投稿できるように頑張りたいです。
更新ない間にUIの制作をしました。
複雑なUIの仕上げはデザイナーさんに依頼することもありますが、見やすさや操作性など、ゲームとしての設計は予め考えておきます。
今回はいつもどんなことを考えながらUIをブラッシュアップしているかまとめてみようと思います。
ただし作者はデザインのド素人です。
「独学」と言えるほど勉強したこともない。
（だから大事な部分はデザイナーさんに頼んでます！）
ただの話したがりということで、対戦よろしくお願いします。
必要な要素を出す
今回は「PERK設定画面」を例にします。
この画面では主人公に「素直」「友好的」「慎重」などのPERK（プレイヤーが取りたいロールプレイのスタイル）を装備させることができます。
装備したPERKによって主人公のパラメーターが変動し、性格タイプが変わるというシステムです。
まずはこの画面に必要そうな要素を詰めてみました。
書き出すとこんなかんじ
とりあえず載せただけなので見づらいですね。
問題点を出す
次に改善できそうな所を書き込みながら考えてみます。
1)立ち絵に動きがないので単調に見えている。
2)今どのPERKがセットされているかが大事。ここを一番目立たせたい。
3)所持PERK一覧を見やすいように括りたい。
4)パラメーターが２種あると、どちらが性格タイプに影響しているかわかりにくい。片方は内部で処理するのが正解かも。
5)パラメーターがどんなふうに変動したかわかりやすくしたい。
だいたいこんな感じ。
あと、要素が多い画面では見せたい物の「優先度」をはっきりさせることが重要かなと思っています。（絵の場合はそうなので多分そうです）
優先度を決定できれば見せ方に差を付けられますし、視線の動きに合わせて配置を決めることもできます。
今回は要素出しの段階からある程度視線の動きを考えていました。
この画面の場合、最初に目に入る場所にはアイキャッチになる立ち絵。
次に最優先の要素である「現在設定されているPERK」。
残りは上から下へ、影響を与えていく順番に並べます。（PERKを選ぶ→パラメーターが変動→タイプが変化→決定して次へ進む の順）
そこから更にコントラストやエフェクトを使った肉付けをしていきます。
完成
だいぶ良い感じになりました！
目立たせたい部分の背景と文字色のコントラストを強く、他よりやや彩度高く、発光エフェクトも付けました。
逆にそれほど目立たなくていいパラメーターはコントラストを抑えています。（静止画では結構地味ですが、メーターが伸び縮みするアニメーションが付くとちょうどよい情報量になるはず）
あとは数値を横に書いたり、変動幅がわかりやすいように色を分けたり。
立ち絵も動きがある感じに差し替えました。かわいい！
素人なりにいろいろ考えてやってみるのが楽しいです。
PERKは特に要素が多くて苦労したのでご紹介してみました。
読んでくださってありがとう！
余談
『泥舟と罪人』は日本のノベルゲームではなく、海外の3DCGゲームのUIを参考にしている部分が多くます。
具体的にはStarfield、Detroit: Become Human、APEXなどを見ることが多いです。
apple製品やwindousなどゲーム以外のUIから着想を得ている部分もあります。
みなさんはUIが好きなゲーム参考にしてるゲームありますか？
よければ教えてください！
引き続き制作がんばります！