Thread by @ohbashunsuke

本日はカービィデイ "カービィUIでおもてなし！「ゲームとプレイヤーを繋ぐUI」を目指して

#CEDEC2020

目指しているもの
3つ目むずそう
#CEDEC2020

大切にしていること。
全部マジ大事。同意。
#CEDEC2020

使いやすいUIとは
現状把握・ネクストアクション理解・何が起こるかの把握。

UIは邪魔しちゃいけないんだよね。

#CEDEC2020

使いやすいUI=>情報整理・分割が適切

- 表示優先度をつける => プランナーと相談
- カテゴリーに分ける
これらを整理することでレイアウトのアイデアを出し、まとめる

カテゴリ分けはなるほどって思った。

#CEDEC2020

- カテゴリーが近いものを近づける。
- 整列させる
- 反復=>(ヘッダ・フッタなど)
- コントラストを付けて重要度の伝達

自然とやってることに改めて言語化されてて、とてもわかり易い。明日から使えるｗ

#CEDEC2020

最後に視線誘導
#CEDEC2020

こういうポストモーテム凄く好き。
視線誘導の見やすさ、情報優先度の整理、そしてあえてキャラを消す(この画面では不要)。

#CEDEC2020

基礎基礎とキーワード出てくるけど、基礎大事だよね。
#CEDEC2020

あるある
静止画ベースで考えるとこうなるけど、全体の流れを考えれるか、、、？
相当スキル高いと思う。

#CEDEC2020

仕様書がマジでしっかりしてるんだろうなって思った。
#CEDEC2020

与えられた部分だけ見てては駄目で、全体を把握しないと駄目ってことだよね。

#CEDEC2020

使いやすさと遊び心のバランス超ムズい。こここそ静止画だけで見てては出来なくて、全体を通したデザインが必要なんだろうな。って思った。

#CEDEC2020

すごい。。メッチャ遊び心ある。
凄く豪華なサウンドプレーヤーだw

#CEDEC2020

遊び心のまとめ
#CEDEC2020

伝統といてカービィUIは「あたたかさ」を重要視しているらしい。
- 鋭利は避けて角R
- 少しグレーを入れてコントラストを和らげる
#CEDEC2020

対象ユーザーに合わせて、意思決定情報量をあえて分散させる。
なるほど。
#CEDEC2020

各タイトルの世界観に合わせた色味や情報量の調整。
#CEDEC2020

布などのテクスチャを入れちゃうと可愛くなりすぎるので注意した。あくまで「あたたかみ」で世界観の統一をしたい。
#CEDEC2020

近年のカービィUIの挑戦。
- スキュアモーフィックデザイン(イマイチ分からなかった)。
- クールで格好いい
※繰り返し可愛くなりすぎないように
多分油断するとすぐに可愛くなりすぎちゃうんだろうね。カービィがカワイイから仕方ない。

#CEDEC2020

まとめ

気づく人は少ないかもしれないけど、カービィUIは進化している。
注目しようと思った。

#CEDEC2020

エンジニアとしては気になるテーマ
#CEDEC2020

- 素材表(Web上で確認)
- グラフィックフォントリスト(Web上で確認)・・ローカライズで活躍
- GroupExporter(JSX)・・・ワンクリック複数テクスチャ書き出し
#CEDEC2020

- テキストのX幅自動調整機能(Unityならサクッと行けそう)
- ルビあるなしで行間をデザイナーがあるなし設定できるように外出ししている
- UIの表示機能・・これは便利かも
- テキスト領域可視化機能・・これは便利かも
#CEDEC2020

グラフィックフォントのローカライズもやっているだと。。

#CEDEC2020