company_banner

Material Design 2.0 и Android P

    Google показал обновлённую дизайн-систему Material Design 2.0 на конференции I/O. Это серьёзное изменение визуального стиля и расширение инструментария, первые звоночки которого появились ещё в марте.




    Визуально Android P продолжил сближение с iOS (различия между платформами стираются с обеих сторон):

    • Много скруглений, что сильно перекликается с iOS 10-11. Возможно, это сделано с прицелом на безрамочные телефоны, которых становится всё больше — это лучше сочетается с их скруглёнными краями экрана.




    • Цвет настроения — белый. Больше нет яркой шапки приложения и серых подложек, сплошное белое пространство с минимумом акцентов. В каких-то приложениях Google встречается цветная нижняя панель и сама идея акцентных цветов не уходит из гайдлайнов но тенденция явная (включая веб Gmail и Drive).


    • Навигация по операционке в духе iPhone X. Паттерн «рукоятки» вместо кнопки «домой» с почти аналогичной механикой, отказ от отдельной кнопки списка приложений (также вызывается свайпом снизу), ну и ставшая официальной в последние годы нижняя панель навигации. Всё это помогает управлять современными телефонами, которые стали не только больше, но ещё и выше за счёт безрамочности. Кстати, в некоторых новых приложениях Google инструменты навигации почти везде внизу. Осталось упростить кнопку «назад» (она уже пропала с домашнего экрана).



    Можно назвать это вкусовщиной, но первая версия Material Design имела своё лицо и можно было говорить о характере бренда, выраженном в интерфейсе. Кто-то жаловался, что гайдлайны слишком жёсткие и делают приложения однояйцевыми. Но для многих компаний это был сильный ориентир — как можно создать ощущение единства продуктов без использования логотипа. Хотя поддерживать две платформы станет проще.

    С другой стороны, теперь Material Design поддерживает более продвинутую тематизацию, чем просто замена цвета. Можно менять шрифтовую сетку, скругления элементов интерфейса (точнее, даже их форму — например, можно сделать диагональные скосы), иконки. К этому прилагается плагин для Sketch (можно быстро примерить стиль на свой макет) и библиотека иконок (в пяти стилях). Недавно обновлённые продукты Google также используют этот подход (хотя их стиль как раз выхолощенный).

    https://vk.com/video-157244248_456239017



    И самое главное — теперь это полноценная дизайн-система с компонентами в коде, а не просто масштабные гайдлайны и шаблоны к ним с какими-то разрозненными примерами. Эти компоненты также поддерживают тематизацию, так что система выглядит целостной (сами компоненты начали появляться год назад). Новый сайт Material Design сделал фокус на две составляющие — дизайн и разработка — более явным. Они также запустили давно обещанный инструмент Gallery, аналог Zeplin и Wake. Но это как-то вяло на фоне обещаний, данных после покупки Pixate (основатель ушёл в Figma) и Form (Гугл подтверждает репутацию сгнаивателя купленных компаний).

    Из других интересных деталей анонса:


    Бета-версию уже можно поставить на некоторые телефоны. Финальная версия появится осенью. Засучиваем рукава, работы будет много.

    Mail.Ru Group

    808,84

    Строим Интернет

    Поделиться публикацией

    Похожие публикации

    Комментарии 7
      +3
      Ну крч круто, но в MD2.0 все таки чего-то не хватает, что было в MD. Мне кажется все слишком круглое что-ли.
        0
        В 2.0 не хватает определённости, имха. Дали вольницу дизайнерам =(
        –3
        В ios есть неприятная особенность работы ui. Пример: открывая ссылку в новой вкладке ui становится недоступным на 500-700мс. Вроде в андроидах версии 4.0 тоже такое было, а как сейчас?
          +6
          Это скорее про реализацию, а не про дизайн
          0
          У кого нибудь есть идеи или опыт, чем же заменять теперь серую подложку под белые карточки с тенями? Все сплошь белое как-то угнетает. Впечатление, что надоевшая во времена веб 2.0 выбеленность снова возвращается. Так понравившаяся мне контрастность, вернувшаяся с win8 metro, похоже не устояла на ногах.
            0
            Где вы нашли правило на выбеленность?

            Из гайда
            image

            image
              0
              Я не прой гайд. Про тенденции в последние месяцы.
              Больше нет яркой шапки приложения и серых подложек, сплошное белое пространство с минимумом акцентов

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

              Я не разработчик нативных аппов под анроид. Моя специализация SPA/PWA/Electron Apps/PhoneGap. Поэтому гайдов я придерживаюсь отчасти.

          Только полноправные пользователи могут оставлять комментарии. Войдите, пожалуйста.

          Самое читаемое