Поговорим о том, как появилась дизайн-парадигма Google и чем полезна дизайнерам. Для всех достаточно привычно то, что интерфейсы Google выглядят и работают одинаково. Хотя, лет десять назад, версии Gmail в Android и в десктоп браузере выглядели как абсолютно разные продукты. В 2014 году эта проблема была решена. На конференции I/O Google, представили новую дизайн-систему Material Design, базирующуюся на тактильной реальности. Каждый её блок — это лист бумаги, а текст-объекты — чернила.  Об основных принципах системы Material Design и о пользе анимации, которая помогает разобраться в интерфейсе рассказываем ниже.  

Material Design и его основные принципы

Тактильные поверхности Каждый элемент интерфейса — слои цифровой бумаги. Они находятся на разной высоте, отбрасывая тени. Для пользователей это способ отличить главные элементы от второстепенных. Таким образом, интерфейс становится интуитивно понятным. Полиграфический дизайн Все изображения и письмена на слоях-элементах, пренадлежат законам печатного дизайна, их «печатают» чернилами. Тем самым, внимание пользователя акцентируется на нужном элементе и  можно  обозначается иерархия интерфейса. Осознанная анимация Невозможно, чтобы элементы, находящиеся на экране, могли бы просто так появляться и исчезать, в реальности так не бывает. Плавно переходящие в друг друга объекты, подсказывают пользователю, как работает интерфейс. Адаптивный дизайн Всё, что упомянуто выше, должно работать на любых устройствах.  

Анимация в Material Design

Главная из основ Material Design — это анимация, прописанная в гайдлайнах очень подробно. Ей руководствуются для того, чтобы сделать пользовательский интерфейс экспрессивным и легко используемым. Для этого она должна отвечать этим трём принципам.

1. Содержательность.

С помощью анимации можно увидеть пространственные и иерархические связи между элементами: какие действия может совершить пользователь и что случится, если он выполнит любое из них.

2. Нацеленность.

Анимация концентрируется только на важном, и не отвлекает от основного действия.

3. Экспрессия.

В анимации выявлен характер, индивидуальность и стиль каждого продукта.  С помощью этих принципов, анимация может позволить дизайнеру правильнее организовать обратную связь между человеком и интерфейсом. Рассмотрим примеры:

• Определить иерархию и показать пользователю, как элементы связаны друг с другом.
• Учить пользователя разбираться в интерфейсе
• Сделать продукт привлекательным, чтобы пользователь захотел с ним взаимодействовать.

К тому-же, по одному из правил анимаций в Material Design — все предметы, с экрана, должны ускоряться. По мнению разработчика Джона Шлеммера, неважно, где именно они остановятся. Остальные корпорации также сделали свои дизайн-системы.