Зачем использовать материальный дизайн? Взвешивание плюсов и минусов

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

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

Что такое материальный дизайн?

Материальный дизайн был создан Google в 2014 году, частично на основе карточного макета, используемого в Google Now. Отношение к бумажным стилям дизайна отличало его от плоского стиля дизайна, который широко использовался в то время.

Как и большинство систем дизайна, Material Design был создан для обеспечения унифицированного взаимодействия с пользователем на различных устройствах, платформах и методах ввода. Подобно тому, как Apple внедрила принципы плоского дизайна в качестве своего стандарта, Google использовала Material Design, чтобы гарантировать, что независимо от того, как пользователи получают доступ к своим продуктам, они будут иметь постоянный пользовательский опыт.

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

Зачем использовать материальный дизайн?

Как и в любой хорошо зарекомендовавшей себя системе дизайна, в использовании Material Design есть несколько основных плюсов, которые дизайнеры должны учитывать.

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

Google поддерживает Material Design и хранит обширную документацию по его использованию и реализации. Такой поддержки и документации может не хватать многим современным системам проектирования.

Несмотря на всю эту полноту и документацию, Material Design остается довольно гибкой библиотекой дизайна. В руководящих принципах большая часть особенностей реализации дизайна полностью оставлена ​​на усмотрение дизайнера.

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

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

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

Недостатки использования материального дизайна

Хотя материальный дизайн имеет очень очевидные плюсы, это не значит, что нет минусов, связанных с его использованием.

Во-первых, Material Design сразу идентифицируется и прочно ассоциируется с Google и, в частности, с Android. Хотя это не обязательно плохо для всех, для некоторых это потенциально негативно.

Одна большая причина, по которой это может быть негативным, заключается в том, что это ограничивает эффективность другого брендинга при использовании системы дизайна. Да, дизайнеры могут включать логотипы, цветовые палитры (в соответствии с рекомендациями по материальному дизайну) и другие отличительные факторы для поддержки идентичности бренда, но продукт, соответствующий спецификациям материального дизайна, почти всегда также будет ассоциироваться с Google.

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

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

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

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

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

Круг, обозначающий «Дом», идентифицировать значительно сложнее, чем значок дома, который ранее использовался в большинстве интерфейсов Android. Это яркий пример того, как форма ставится выше функции, что является наследием плоского дизайна Material Design.

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

Заключение

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

Тем не менее, существует множество других вариантов использования за пределами платформы Android, где Material Design является хорошим выбором. По мере дальнейшего развития системы проектирования количество таких ситуаций неизбежно увеличивается. Дизайнеры должны, по крайней мере, ознакомиться с рекомендациями, чтобы они могли сами определить, когда уместно использовать Material Design, а когда лучше подходят другие системы.

• • •

Дальнейшее чтение в блоге Toptal Design:

• Как создать эффективную структуру дизайна (с помощью бесплатного файла эскиза)
• Создание руководства по стилю пользовательского интерфейса для лучшего UX
• Понимание систем дизайна и шаблонов
• A/B-тестирование UX для компонентных фреймворков
• Психология дизайна и нейробиология потрясающего UX