Главная Браузеры Material Design: новый стиль интерфейса от Google и его применение в экспериментальных настройках браузера Chrome

Material Design: новый стиль интерфейса от Google и его применение в экспериментальных настройках браузера Chrome

Google Chrome Material Design Icon

Грандиозные планы по внедрению нового корпоративного стиля компании Google – Material Design – предусматривают в будущем смену оболочки популярнейшего браузера в мире Chrome. Пока что Material Design в актуальной версии браузера можно наблюдать только в разделе загрузок. Но при желании любой пользователь может включить отдельные экспериментальные функции Chrome, чтобы уже приступить к работе с любимым веб-обозревателем в его новом обличии. Как включить отдельные экспериментальные функции Material Design в браузере Google Chrome, и что из этого получится в итоге – об этом всем будем говорить в этой статье. Но прежде – несколько слов, собственно, о самом стиле Material Design.

Содержание:

  1. Новый стиль Google – Material Design;
  2. Экспериментальные настройки Chrome;
  3. Material Design в шапке Chrome;
  4. Раздел загрузок в стиле Material Design;
  5. Material Design для истории браузера;
  6. Раздел расширений и приложений в стиле Material Design.

1. Новый стиль Google – Material Design

Материальный дизайн – как видим из перевода на русский язык названия нового стиля Google, призван придать реалистичность интерфейсу продуктов компании. На первый взгляд плоский и лишенный трехмерных эффектов Material Design, если присмотреться ближе, на самом деле непрост и многослоен. Он сформирован утонченной, ненавязчивой игрой теней, отбрасываемых элементами. При их выборе кликом компьютерной мыши или касанием на сенсорных устройствах элементы Material Design будут отдавать более насыщенную тень, но, в то же время, без каких-либо резких контрастных эффектов. У элементов Material Design насыщенные однотонные цвета, отчетливо очерченные края, но без острых углов. Переключение между элементами интерфейса осуществляется плавно, без резких акцентов. В основе Material design лежит принцип типографской печати с читабельными (сглаженными) шрифтами, нераздражающими глаз фоновыми расцветками, правильными отступами между элементами, фокусировкой внимания в нужных местах, интуитивной навигацией.

Создание нового стиля было обусловлено необходимостью придания единства всем веб-сервисам и программным продуктам Google. Единый стиль интерфейса позволит пользовательской аудитории идентифицировать компанию как создателя ее продуктов и отличать их от веб- и программных продуктов других разработчиков.

Material Design – еще довольно молодой проект. Официально он был представлен на конференции Google летом 2014 года, но уже сегодня внедрен во многие продукты компании Google. Так, в стиле Material Design выполнен интерфейс мобильной платформы Android, начиная с версии 5.0. На этот стиль переведены многие веб-интерфейсы сервисов Google: облачное хранилище Google Drive (а вместе с ним и офисные веб-приложения «Документы», «Таблицы», «Презентации»), заметки Google Keep, конструктор веб-форм Google Forms, анализатор трендов поисковых запросов Google Trends, магазин Android-контента Google Play, соцсеть Google+ и прочие.

1

Для сравнения: на дату написания этой статьи не перешли на Material Design и остались со старым интерфейсом такие веб-сервисы компании, как видеохостинг YouTube, персональный календарь Google Calendar, сайт новостей Google News, сервис поиска по библиотеке оцифрованных книг Google Books и прочие.

2. Экспериментальные настройки Chrome

Отдельные элементы Material Design в Google Chrome включаются в экспериментальных настройках браузера. Доступ к ним можно получить при вводе в адресную строку значения:

chrome://flags

Внося изменения в экспериментальные настройки – хоть касаемо Material Design, хоть касаемо любых иных функций, необходимо помнить о возможности вернуть исходные настройки Chrome.

2

Забегая наперед, отметим, что после применения всех возможных элементов Material Design в экспериментальных настройках Google Chrome не будет выглядеть как доработанный продукт с измененным дизайном. На сегодняшний день, кроме упомянутого выше раздела загрузок в стиле Material Design, что предустановлен в актуальных версиях Chrome, преображению в новый интерфейс поддаются немногие составляющие браузера.

3. Material Design в шапке Chrome

Шапка актуальной на дату написания версии Chrome выглядит так:

3

В разделе экспериментальных настроек находим опцию «Оформление Material Design» и в выпадающем списке выставляем позицию «Material Design». Внизу окна появится кнопка перезапуска браузера для применения новых настроек. Жмем ее.

4

Однако после перезапуска кардинальных изменений в шапке Chrome не увидим. Обнаружим лишь новый вид кнопки меню, знакомый многим по интерфейсу Android, а также смену цвета папок с закладками. Ранее желтого цвета папки станут серыми. И все.

5

4. Раздел загрузок в стиле Material Design

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

6

а также кнопку доступных для раздела загрузок опций, опять же, в стиле Android.

7

В экспериментальных настройках ценители старого дизайна раздела загрузок Chrome могут вернуть назад привычный интерфейс. Для этого нужно отыскать опцию «Включить Material Design на странице «Загрузки», в выпадающем списке выставить положение «Отключено» и перезапустить браузер.

8

5. Material Design для истории браузера

Как выглядит раздел истории Google Chrome в новом стиле Material Design, пока что, увы, мы не узнаем. Наверняка это будет небывалое ранее удобство, ведь, по идее, искать нужный сайт в хаосе всего посещенного за несколько дней будем по аккуратно выстроенным в ряд карточкам. Переход раздела истории Chrome на Material Design экспериментальными настройками предусматривается, но на деле никакого эффекта не получим. История браузера просто не будет отображаться. Возможно, в скором будущем опция экспериментальных настроек «Включить историю Material Design» станет рабочей.

9

6. Раздел расширений и приложений в стиле Material Design

Последняя доступная на сегодняшний день опция перехода на Material Design (благо, рабочая) – это преображение в новый стиль раздела расширений и приложений Chrome. Напомним для начала традиционный вид этого раздела, который в рамках существующего интерфейса отображается переключающейся вкладкой в настройках браузера.

10

Чтобы увидеть раздел расширений в стиле Material Design, в экспериментальных настройках ищем опцию «Включить расширения Material Design» и жмем надпись «Включить». Перезапускаем браузер.

11

После перезапуска Chrome облаченный в Material Design раздел расширений больше не будет доступен отдельной вкладкой в разделе настроек. Доступ к перечню установленных расширений и приложений можно получить альтернативным путем через пункт «Дополнительные инструменты» в меню Chrome.

12

Или по-другому – вызвав на любой из кнопок расширений на панели инструментов браузера контекстное меню и выбрав пункт «Управление расширениями».

13

А вот и сам Material Design в разделе расширений и приложений:

14

Увидим ту же приятную фоновую расцветку, что и в разделе загрузок. Установленный контент Chrome в виде карточек будет аккуратно рассортирован отдельно по расширениям, отдельно по приложениям и отдельно по ярлыкам сайтов.