Привет. Меня зовут Руслан. Я UX/UI дизайнер в Siemens. У меня есть ютуб-канал, на котором записано несколько плейлистов по основам UX/UI дизайна. В этой серии постов однако я просто делюсь вольным переводом Material Design на русский язык. Оригинальный источник: здесь.
Работа с пространством осуществляется за счет базовой сетки, направляющих, прогрессивной шкалы отступов, работы с соотношением сторон, контейнеров и областью нажатий.
8dp сетка
Все компоненты выравниваются по квадратной базовой сетке 8dp/8px для мобильных устройств, планшетов и настольных компьютеров.
4dp сетка = 4px сетка
Иконки, типографика и некоторые элементы внутри компонентов могут выравниваться по 4dp/4px сетке
4dp сетка = 4px — сетка базовой линии
Типографика выравнивается по базовой линии 4dp/4px
Типографика может смещаться за пределы 4dp сетки, если контент центрируется внутри компонента, например такого как кнопка или элемент списка. Но даже при размещении вне сетки, но по центру внутри компонента, текст все равно можно выравнивать по центру и базовой линии.
Методы
Работа с пространством более тонкая работа, чем работа над адаптивной сеткой. Методы работы с пространством — это набор правил по размещению элементов в компонентах и макете.