Material Design 2.0
На днях прошла ежегодная конференция Google I/O, которая по количеству полезного не уступает эпловскому WWDC.
events.google.com/io
Уже начали выкладывать видео с выступлений на канал Google Design.
Много внимания посвятили дизайну: дизайн-система Google Material была существенно обновлена и теперь позволяет достичь больше гибкости. Это замечательный повод ещё раз изучить сайт material.io/design, если позволяет английский. Теперь разработчики могут использовать готовые системные компоненты под любую из платформ.
Юрий Ветров в своём посте для vc.ru проанализировал визуальные изменения: больше белого и скруглений.
Визуально новая операционная система Android P сближается с iOS и я нахожу эту унификацию хорошим трендом, который упрощает дизайн для разных платформ.
Няшная попсовая реклама про обновление:
Я расскажу о тех инструментах, которые вышли вместе с этим обновлением.
gallery.io
Сервис красивый и многообещающий, но пока сильно уступающий Зеплину по функциям. Можно авторизоваться через гугловский аккаунт. Умеет загружать макеты на сервер через плагин Material Theme Editor. Если использовать в макетах компоненты из дизайн-системы, даёт разработчикам ссылки на спеки компонентов.
Галерея в деле (англ.)
Есть приложение для обоих платформ, удобно смотреть макеты на устройстве. В том числе, длинные, в которых есть вертикальная прокрутка. Это камень в огород Скетч Клауда.
Разработчики могут смотреть размеры, отступы и цвета. Но Галерея не нарезает ассеты с признаком экспорта. А значит, пока не позволяет отказаться от Зеплина. С хотспотами тоже не работает.
– плагин для Скетча, который помогает собрать кастомную библиотеку. Облегчает создание дизайна на базе их дизайн-системы.
Плагин в деле (англ.)
Скачать: material.io/tools/theme-editor/
Что умеет:
Задавать цвета. Настраиваем палитру, которая будет применена к символам этой новой библиотеки. Доступны два семейства цветов, главное и второстепенное.
Задавать скругления блоков. настраиваем радиус скругления у фоновых блоков и карточек.
Управлять шрифтами на проекте. Задаём гарнитуры и начертания шрифтов для заголовков. Text Styles Скетча вообще не используются, все только в символах. Спорный момент. Не хочется терять поддержку текстовых стилей.
Подгружать наборы иконок. Системные иконки Матириала можно скачать в виде отдельных скетч-библиотек. Можно выбрать их стиль: залитые, с острыми и скруглёнными углами, контурные или двухцветные. Плагин умеет красить их в нужный оттенок.
Фактически, этот плагин — первый полноценный фреймворк для дизайнеров интерфейсов, который соединяет в себе мясо UI-кита и автоматизацию плагина. В удобном виде он позволяет привести цвета, шрифты и иконки в одну централизованную систему и легко генерировать макеты для разработчиков.
Я веду Скетч-дизайнер, телеграм-канал и сайт о дизайне интерфейсов в Скетче, плагинах и горячих клавишах. Также пишу о дизайн-системах, проектировании и UI-анимации в Фреймере.