Если вы следите за Google, то наверняка слышали о «Material Design 2», которое ходит с февраля. Тогда это было не более чем число, но как я упоминал, у нас были начальные доказательства, что за этим что-то есть. Короче говоря, еще в начале прошлого года ходили слухи, что Google работает над духовным преемником Material Design, но у нас не было никаких весомых доказательств.
Теперь доказательств много, настолько много, что мы можем начать разбираться, что именно делает Google. Как бы вы это ни называли, Google переосмысливает свой подход к дизайну, так что давайте разберем это…
Краткий экскурс в прошлое
Знаменитый Матиас Дуарте представил первую итерацию Material Design от Google четыре года назад на Google I/O 2014, и это был замечательный шаг вперед для компании. Подход к дизайну продуктов Google был разрозненным и хаотичным, Android долго считался непривлекательным, и многие считали, что он начал выглядеть устаревшим, а Google просто нуждался в свежей философии, которая объединила бы его продукты и добавила бы эстетической красоты.
С тех пор Android и практически все приложения и платформы Google приняли новый подход к дизайну. Хотя Android и его приложения первыми присоединились, было интересно наблюдать, как ключевые веб-приложения постепенно переходили к Material Design. Менее популярные сервисы, такие как Google+, быстро перешли на Material, некоторым потребовалось пару лет, а некоторые отстающие (например, Календарь) получили обновление только в конце прошлого года.
Как раз к I/O 2018 почти все самые важные сервисы Google сделали этот шаг. Одним из последних устоявших был Gmail для веба, и он получил новое оформление на этой неделе. Но интересно, что в новом дизайне Gmail — это не просто Material. Он демонстрирует новую, развитую форму Material, которую многие называют «Material Design 2». Теперь, когда Google наконец догнал, действительно ли пришло время для очередных изменений? Вроде того.
Что такое «Material Design 2»?
Это не радикальное отступление от самых современных и последних подходов Google к дизайну (например, Календарь в вебе). Но благодаря последним визуальным обновлениям Google, которые мы смогли обнаружить за последние месяцы, люди, вероятно, начнут действительно различать, что «старое», а что «новое» — потому что есть несколько ключевых отличий. Это то, что мы называем «Material Design 2».
Еще одна причина, по которой этот последний набор доработок Material Design 2 выделяется для многих, заключается в том, что эти плоские полностью белые фоны, скругленные углы и обновленные шрифты действительно сильно отличаются от видения, которое Матиас Дуарте представил 4 года назад. Некоторые могут утверждать, что это больше не Material Design вообще, но прежде чем говорить об этом, давайте быстро углубимся в некоторые концепции дизайна, которые до сих пор определяют этот обновленный дизайн.
Пространство и прозрачность
Одним из наиболее заметных изменений в новом Material Design является обилие свободного пространства, и это, безусловно, спорное изменение. Во многих примерах приложений, которые, как мы полагаем, следуют последним внутренним рекомендациям Google Material, таких как некоторые версии ленты Google, Google Задачи, приложение I/O 2018 и других, много свободного пространства, призванного придать чистый, минималистичный вид.
Конкретных примеров этого на самом деле нет, но это скорее общая тенденция во всех изменениях дизайна, которые Google вносил в свои приложения за последние месяцы.
Местами также появляются признаки увеличения использования прозрачности, причем одним из ярких примеров является Pixel Launcher, который Google поставлял с Pixel 2. Лента Google и ящик приложений до сих пор остаются полупрозрачными, и пока мы не видели много других примеров — за исключением быстрых настроек и ящика приложений в Android 8.1.
Красочные иконки
Хотя это пока не совсем тенденция, которую мы видели где-либо еще в приложениях Google, я считаю, что красочные значки, которые Google включил в Developer Preview 1 Android P, заслуживают внимания как уникально новые. На самом деле, многие элементы нового приложения «Настройки», на мой взгляд, являются репрезентативными для нового Material Design Google в целом. По всему приложению можно найти скругленные углы, есть элементы Google Sans, и Google в целом использует более яркие цвета.
«Google Sans»
Еще один аспект, который становится все более очевидным, по крайней мере, в приложениях Google первого выпуска, которые мы видели до сих пор, — это использование «Google Sans» в качестве шрифта для заголовков — но, что примечательно, не в качестве полной замены давно любимого Roboto. По сути, Google Sans — это версия Product Sans ( проприетарный шрифт Google для его одноименного логотипа и других продуктовых логотипов), который он использует в некоторых веб-приложениях и страницах, а в последнее время и в своих приложениях для Android.
Google использует новый шрифт на своем недавно обновленном сайте Wear OS, для заголовков электронной почты в новом Gmail, во многих приложениях, таких как Google Задачи и новом Google I/O 2018, а также во множестве других мест, о которых я, вероятно, еще не знаю.
Скругленные углы
Далее — обилие скругленных углов, или, по крайней мере, гораздо более плавный радиус скругления для углов, которые технически уже были круглыми. Это еще одна тенденция, которая, кажется, распространяется по приложениям Google и нашла свое отражение в последних дизайнах. Одним из самых очевидных мест, где это можно увидеть, является лента Google, но это также легко заметно в приложении Google Задачи, Google Pay в вебе, других страницах в приложении Google и в других местах.
-
- Старый
-
- Новый
Еще один отличный пример этих новых скругленных карточек — в приложении Wear OS, где мы видим очень плоский дизайн для всех этих карточек с циферблатами и лишь легкую тень, показывающую, какую вы выбрали.
Новые скругленные индикаторы вкладок
Традиционно вкладки в Android имели подсветку, которая простиралась по всей вкладке, и во многих случаях вы могли пролистывать их, чтобы перейти к другим вкладкам. В недавних приложениях, соответствующих «Material Design 2», мы видим совершенно новый дизайн вкладок со скругленными углами, который не охватывает всю вкладку.
На данный момент мы видели A/B-тестирование этого на некоторых страницах со списком местоположений в Google Картах для Android (у меня это есть на моем Pixel 2 XL, но Абер не видит этого в последней версии приложения), новой странице настроек аккаунта Google, которую мы недавно включили, и в двух разных местах в недавно выпущенном дизайне Gmail для веба.
Здесь есть два интересных момента. Во-первых, ни один из найденных нами примеров этого дизайна не поддерживает ту же функцию пролистывания, что и старый дизайн. Во-вторых, недавно выпущенное приложение Google I/O 2018 имеет дизайн для своих вкладок, который находится где-то между старым и новым — и они перелистываются. Так что не волнуйтесь раньше времени!
Скругленные выделения в меню
Еще одна распространенная тема, которую мы видим в приложениях, предположительно созданных с учетом новых рекомендаций, — это новые скругленные выделения в меню. Например, на самом левом скриншоте ниже показано меню, открываемое кнопкой-гамбургером на новом BottomAppBar (подробнее ниже), и внутри этого меню выбранный вариант выделен синим цветом. Мы также видим это в Google Pay в вебе и выбор фона в Chrome OS.
BottomAppBar будет большим
Телефоны стали больше, а с большими телефонами и не такими уж большими большими пальцами добраться до верхней части экрана, чтобы перемещаться по приложениям, стало сложнее. Источник сообщил мне, что BottomAppBar, добавленный в руководства Material вместе с Android P, станет критически важной частью этого нового обновленного Material.
Есть два приложения непосредственно от самой Google, которые уже демонстрируют ранний взгляд на то, как это будет выглядеть. Одно из них — Tasks, у которого есть большая плавающая кнопка действия, которая, кажется, располагается поверх BottomAppBar, а другое — новое приложение Google I/O 2018, которое имеет версию, идентичную той, что показана в руководствах.
Мне сообщили, что эти BottomAppBar будут добавлены в большинство приложений Google первого выпуска, где это применимо.
Заключение: Название? Запуск?
Чтобы подвести итог, я думаю, было бы лучше прояснить, как именно мы должны это назвать и когда нам следует ожидать его «запуска».
Во-первых, относительно его названия, источник, близкий к ситуации, сообщил мне, что Google на самом деле не собирается называть это «Material Design 2», и, более того, вероятно, вообще не будет менять название. Хотя, да, это определенно резкий контраст с внешним видом первого «материального» вида первого поколения, с его бумажной текстурой и тяжелыми тенями, большинство фундаментальных основ здесь не меняются. Даже в приложении Google I/O говорится, что приложение было создано с использованием «Material Components». Я не думаю, что это изменится.
Что касается «запуска» нового дизайна, я не знаю, увидим ли мы его вообще. Google может показать какой-нибудь демонстрационный ролик или промо-видео на Google I/O в следующем месяце, но вы должны помнить, что Google Design — это живой, дышащий организм, который постоянно развивается. Так что для меня это ощущается как просто последняя эволюция, и хотя Google может продвигать это как таковое, я думаю, что «запуск» будет просто его продолжающимся развертыванием в приложениях и сервисах Google в ближайшие месяцы.