ANDROID UI & GUI DESIGN 輪読会 - 2
3-1。AndroidのUI48dp
Androidのガイドラインには、48dpリズムを持って設計するのがよい
このサイズは、指先でタッチスクリーンをタッチするとき接触する平均的なサイズ
## 48dpサイズを使用しているところはどこなのか
- アイコンである
アイコンは、指先ひとつで左右に移動
縦横48dpに設計すればよい
xxxhdpi192pxxxhdpi144pxxhdpi96opx
- ボタン : ボタンも48dpの高さ
- リスト
48dpの高さ
48dp以下の高さでリストを作成する場合👉クリックすることが難しい
解像度 | 48dp px値 |mdpi | 48px |xhdpi | 72px |Xhdpi | 96px |xxhdpi | 144px |xxxhdpi | 1920px |
ざっとあれこれ作成した場合実際の画面で見たとき押しにくい→再作業する場合がある。そのため、48dpに合わせるのが良い。
それか、指先が届く長さである8mm程度を覚えた方が良い。
3-2。タブ
https://material.io/design/components/tabs.html#usage
Androidのタブは、下部ではなく、上部に主に位置する
理由は、下にあるソフトウェアキーとの競合を回避したい意図である。
しかし、Androidデバイスが以前に比べて大きくなったため、上部にあるタブをクリックが難しい場合がある。
これを解決するためのものでスワイプ(swiping)である
タブを実装する方法1.固定タブ2.固定タブ+スワイプ3.スクロールタブ+スワイプ
固定タブは、スクロールタブとは異なり、実際に押すアクションが必要なので、タッチができる十分なスペースが必要である。
スクロールタブは4つ以上の項目を処理するのに適切である。
左右スワイプして、タブ間の移動も可能、タブ領域自体も左右にスクロールが可能のため、大量のアイテムを示すときいい。
3-3。ナビゲーションドロワー(navigation drawer)
https://material.io/develop/android/components/navigation-view/
[拡張性]
トップレベルのメニューが複数ある場合も設計することができる
[アクセシビリティ]
画面左から右にジェスチャーをとったらメニューが表示される
👉アクセシビリティが向上する
[ナビゲーションドロワーメニューをデザインする際に留意すべき点]
1.既存のコンテンツビューの上に表示されるように設計しなければならない。2.アクションアイテムはドロワーメニューが表示されたときに必要なものだけアクションバーの上に表示3.タイトル領域(ユーザーのアカウントやサービス名ひいき方がいい。)4.ドロワーメニューにアクションを入れない。
**3-4。リスト
モバイルUIで最も基本的情報表現形式**
3-5。グリッドリスト
縦方向にスクロールされたときと横方向にスクロールされたとき、図のように、固有の方向がある。