Поверхности

Материал дизайн трехмерен (элементы расположены по осям x, y и z) и это отражается в использовании поверхностей, глубины и теней. В этой части не путайся если встретишь разные формулировки (материал, поверхность, элемент — это все одно и то же)

Физический мир

В реальном мире объекты могут наслаиваться друг на друга или прикреплены друг к другу, но не могут проходить насквозь друг через друга. Также, в реальном мире объекты отбрасывают тени и отражают свет.

Материал дизайн опирается на наш реальный мир, то есть он демонстрирует как поверхность отображается и перемещается внутри интерфейса согласно правилам реального мира. Поэтому и способы для отображения и анимации в рамках дизайн-системы Material повторяют поведение реального мира. Этот принцип применен во всех приложениях.


Глубина

Все элементы находятся в трехмерном пространстве (3D), которое использует свет, поверхность и тени. Все элементы перемещаются горизонтально (X), вертикально (Y), а также могут иметь разную глубину, то есть перемещаться вдоль оси Z. Глубина описывается так: элементы размещаются на оси z, а точнее на разных уровнях (грубо говоря ближе, дальше).

В веб-пространстве трехмерность в интерфейсе можно воссоздать, манипулируя осью Y.

3D-пространство с осями x, y и z

3D-пространство с осями x, y и z


Свойства

Все поверхности в этой системе имеют консистентные, неизменные характеристики и поведение.

Измерение

Элементы могут иметь разные размеры по осям x, y (измеряется в dp) и равномерную толщину (1dp). Толщина не может быть равной 0.

Правильно: Элементы могут быть разной ширины и высоту, но одинаковой толщины (толщина элементов всегда 1dp)

Правильно: Элементы могут быть разной ширины и высоту, но одинаковой толщины (толщина элементов всегда 1dp)

Не правильно: Элементы разной толщины.

Не правильно: Элементы разной толщины.


Тени