見出し画像

#01 マテリアルデザインの『NG』と『OK』デザイン | Surfaces編


はじめに
この記事はマテリアルデザインガイドラインの『サーフェス』についてのNGデザインとOKデザインをまとめたものです。

なお、この記事は私が(翻訳機能を使って)ガイドラインを読む中で、難しいなと思った箇所を分かりやすい言葉に置き換えるなど、一部個人的な解釈が含まれます。

正しい情報は下記のガイドラインをご確認ください。
引用元 Google - Material Design
URL:https://material.io/
※動画・画像データ等はこちらから引用させていただいております。

Surfaces(サーフェス)とは?

マテリアルデザインにおけるSurfacesとは、『UIを構成するための概念』です。

Surfaceはx、y、z 軸を持つ 3D 空間であり、つまり『現実世界のモノ』と同様に、オブジェクトは縦、横、厚み(高さ)で構成されています。

そして、ここで言う『現実世界のモノ』とは、マテリアルデザインでは『紙』を指し、
紙の厚さは常に1dpとなっています。


特性

不透明度

まとめ

今回は、サーフェスのNGデザインとOKデザインをまとめてみました。
UIデザインの勉強の参考になればうれしいです。

※ガイドラインでは、動画等を使用してさらに詳しく解説がありますので、是非ご覧ください。

次回は『Elevation』のNG/OKデザインについてまとめていきます。


この記事が気に入ったらサポートをしてみませんか?