個人サービス開発者が Material Design ガイドラインを学ぶべき理由

サービスを一人で開発するにあたって大切なことは、なんとなくパット見がきれいに見えること、使いにくさを感じないこと。

100点を目指すのではなく、60点を下回らないこと。できれば70点以上をキープしたい。

【思ってた動作と異なる動作が発生する】【明らかにデザインが崩れている】というケースをなくす。これでおそらく60点。

なぜMaterial Designを使う必要があるか。

それは、70点のデザイン(結構いいじゃん)を感じてもらうため。

Mterial Designを構成する要素の整理

70点を達成するために、マテリアルデザインにおける以下の3つの要素に注目する。

Layout

この原則が守れていないと、Material Designらしさ、統一感が失われてしまう。ガイドラインを読み込んで、Layoutの原則に従っていないことがないか要チェック。

Android開発の際にはdpとspを使うべき。fontにはsp、それ以外にはdpを使うらしい。

1dp = (160dpiのディスプレイにおける) 1px

つまりwebサービスを開発するときにpxを使うと、高解像度の端末では見た目が小さくなるということ？

• List
• Detail View
• Navigation Drawer

などを採用するときはパーツごとの余白サイズが指定されている

比率が登場するときは

• 16:9
• 3:2
• 4:3
• 1:1
• 3:4
• 2:3

を採用するとキレイに見えるらしい

タッチ可能な領域は48dpを基準にするといいと思う

Patterns

機能やデザインを実装するときに、出来る限りこのPatternに沿って開発する。

というか、MVPの段階ではこれに従わないのはコストなので、必ず従う。

Components

Components に存在しない要素を使わざるを得ない場合は本当にそれ以外に方法がないかを強く検討する。おそらく、MVPの段階では過剰な機能である。

これより下は学習の優先度を下げる 

Growth & Communications

オンボーディング、機能の紹介、ジェスチャーの説明方法についてのガイドラインが書かれている。一通りの機能を実装した後にこれに従ってデザインを整える。

Motion

アニメーションなどについて書かれている。オープンソースのコンポーネントを使えばだいたいOK

Style

アニメーション、配色、タイポグラフィ、比喩表現(イラスト?)などについて書かれている。UIのブラッシュアップをしたいときに読む。

Usability

- Accesibility/Focus の内容は役に立ちそう

- Bidirectionality はアラビア語対応とかしないので関係なし？

Platforms

Webの段階では意識する必要はあまりない。

アプリ化するときにまた読む。

Resources

アイコンとか