В чем отличия Material Design от Flat Design?

Основные отличия Material Design от Flat Design:

1. Flat Design — это концепция «плоского» дизайна, при котором все элементы управления (иконки, кнопки, меню) лишены тени и визуального объёма. media.contented.ru Объекты выглядят нереалистичными, зато ничто не отвлекает пользователя от решения его задачи. media.contented.ru
2. Material Design — это новый взгляд на упрощение интерфейсов. media.contented.ru С одной стороны, все объекты по-прежнему просты и визуально приятны, как и в плоском дизайне, с другой — чуть более реалистичны, но детали в их оформлении не притягивают к себе излишнее внимание. media.contented.ru

Некоторые особенности Material Design:

• Тактильные поверхности. media.contented.ru {8-host} Каждый элемент интерфейса представляет собой лист цифровой бумаги. media.contented.ru Они расположены на разной высоте и имеют тени. media.contented.ru
• Полиграфический дизайн. media.contented.ru {8-host} Цифровым листам — цифровую печать: все текстовые составляющие и элементы изображения словно напечатаны. media.contented.ru Это помогает обозначать иерархию элементов интерфейса. media.contented.ru
• Осмысленная анимация. media.contented.ru {8-host} Окна и кнопки не появляются просто так из любой части экрана. media.contented.ru Каждый элемент должен быть анимирован последовательно, чтобы подсказывать пользователю последовательность его действий. media.contented.ru
• Адаптивный дизайн. media.contented.ru {8-host} Интерфейс должен быть оптимизирован на всех устройствах и экранах вне зависимости от того, какой продукт взят в качестве примера. {8-host} При этом выглядеть, работать и реагировать всё должно везде одинаково. {8-host}

Некоторые особенности Flat Design:

• Отсутствие лишних эффектов. {7-host} Это значит, что все элементы и изображения находятся на одной плоскости, также не используются демонстрация объёма, текстур, теней и бликов. {7-host}
• Наличие у предметов простых и узнаваемых черт. {7-host} Здесь важно не передать реалистичность объекта, а понятным образом изобразить его схематически. {7-host}
• Присутствие цветовых контрастов. {7-host} Из-за отсутствия визуальных эффектов полагаться приходится только на контрастность. {7-host}
• Упор на типографику. {7-host} В этой концепции за счёт упрощения изображений больше внимания уделяется именно тексту. {7-host} Поэтому внимание здесь отдаётся шрифтам, кеглю, интервалам и так далее. {7-host}