立体感の出し方の違い
フラット・マテリアル・スキューモーフィズム・フルーエント
画面の部品を、どれくらい立体的に見せるかの違いです。
表で比べる
| フラットデザイン | マテリアルデザイン | スキューモーフィズム | フルーエントデザイン | |
|---|---|---|---|---|
| 立体感 | なし（平ら） | 薄い影で少し | とても強い（本物そっくり） | 半透明と薄い影で少し |
| 作った会社・時代 | 2010年代に広まった | 昔の iPhone | Microsoft | |
| 向いているもの | 図解・アプリ | Android・業務アプリ | 楽器・ゲーム | パソコン向けアプリ |
| 色の組み合わせ |
こんなときは、これ
- とにかく見やすく軽くしたいフラットデザイン →
- ルールに沿って整えたいマテリアルデザイン →
- 本物の道具の手ざわりを出したいスキューモーフィズム →
- Windows らしい、すっきりした画面フルーエントデザイン →
迷ったら迷ったらフラットかマテリアル。本物らしさを出したいときだけスキューモーフィズムです。