Material Design — система визуального дизайна, разработанная Google. Она включает в себя стандарты для типографики, сетки, цвета, интерактивных элементов, использования пространства и движения.
Основные принципы:
- Материал — метафора. Использует реальные физические свойства для имитации поведения объектов (подъем, тень).
- Смелая, графическая, преднамеренная — акцент на типографике, цветовой палитре и изображениях для создания иерархии и смысла.
- Движение — осмысленное. Переходы и анимация помогают пользователю ориентироваться и понять, что произошло.
Ключевые компоненты и правила:
- Цвет: Использование основной палитры (primary, secondary colors) и вспомогательных (surface, background, error, status bar). Консистентность цветовой схемы.
- Типографика: Определенные шрифты (например, Roboto, Open Sans), размеры и стили (headline, title, body, caption) для разных уровней иерархии текста.
- Иконки: Единый стиль, размер, форма и толщина линий. Векторные изображения.
- Структура и навигация: Использование стандартных элементов: App bar, Navigation drawer, Bottom navigation bar.
- Пространство: Соблюдение стандартных значений отступов, полей, размеров элементов (например, шаги в 4dp или 8dp).
- Тень и высота: Использование теней для создания глубины и выделения интерактивных элементов (например, кнопки). Большая высота = более яркая тень.
- Формы: Применение скругленных углов, форм для кнопок, карточек и других элементов.
- Состояния: Четкое визуальное отображение состояний элементов (enabled, disabled, focused, pressed).
- Ввод данных: Стандартизированные поля ввода (Text fields) с подсказками и индикаторами ошибок.
- Диалоги и сообщения: Использование стандартных диалоговых окон и Snackbar'ов для уведомлений.
Стандарты UI в Material Design направлены на создание интуитивно понятного, единообразного и приятного пользовательского опыта на разных устройствах и платформах.