こんにちは!ちょこです!
UIのパーツの中に「ドロワー」というパーツがあるのですが、ちょっと変わったドロワーがあったので、事例として紹介させてください。
- 「言葉は知ってるけど使いどころが分からない」
- 「どこで使っているのか知りたい」
など、悩んでいる方の参考になれば幸いです。
まず「ドロワーって何?」という方に簡単に説明すると…
- ドロワー(drawer)とは「引き出し」という単語に由来する
- 画面外にパーツを格納する機能
- ボタンをタップするとパーツを引き出す挙動をする
という感じです。
【Android】NavigationView(ドロワーメニュー)UI改善|bonheur7|note
早速、実際に「キャラバンストーリーズ」で使用されている場面を紹介します。
パーツとしては左上の部分です。
▲こちらのパーツがドロワー
これをタップするたびにパーツが縮みます。
▲3段階でサイズが可変します
一番大きいサイズがデフォルト時のサイズです。
「AUTO」のボタンと左側のアイコンに十分なマージンがあります。
これにより、誤タップの予防に繋がります。
また、文字列を長く表示することにより、情報の概要が伝わりやすくなっています。
少し縮めるとこんな感じです。
バナーの横幅と揃えている感じですね。
こちらが最小サイズです。文字列の表示はなくなりました。
情報よりも画面をスッキリしさせたいユーザーであったり、比較的ゲームに慣れているか、上級者向けの設定です。
以上です。
ドロワーでメニューの開閉をするUIはあるのですが、情報量をコントロールしている事例は限られるのかな、と感じました。
デザインを考える際の発想の参考になれば幸いです。
▼参考資料