Черная пятница в UPROCK! 2 дня до конца распродажи!

Главная дилемма дизайна: поиск баланса между эстетикой и функциональностью

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

В сентябре 2021 года приложение для просмотра коротких видеороликов TikTok стало самым скачиваемым в мире — 656 миллионов загрузок! Такой успех был обусловлен многими факторами, но, пожалуй, самым важным является функциональный интерфейс.

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

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

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

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

Эстетика в дизайне продуктов

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

Давайте подробнее разберем, как эстетика влияет на опыт взаимодействия.

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

Во-вторых, если визуальные элементы применяются последовательно и согласованно, это способствует формированию и укреплению образа бренда. Такой интерфейс вызывает доверие, что повышает вероятность возвращения пользователей.

Наконец, люди часто воспринимают эстетичный дизайн как более понятный и удобный, даже если объективно он таковым не является. Эффект эстетики-юзабилити был открыт в 1995 году. Участники исследования должны были протестировать разные интерфейсы банкоматов, и в результате оценили устройства с более эстетичным дизайном как более простые в использовании, несмотря на отсутствие существенных различий в функциональности. 

Это привело исследователей к выводу, что визуальная привлекательность продуктов положительно влияет на восприятие удобства использования.

Функциональность в дизайне продуктов

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

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

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

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

Эстетика vs функциональность: выбираем подход

Нам необходимо найти правильный баланс между эстетикой и функциональностью. Классический пример такого баланса — iPhone. Утонченный дизайн, интуитивно понятный интерфейс и инновационные функции, такие как AirDrop, по-прежнему выделяют его на фоне других устройств.

Когда в приоритете эстетика

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

Интернет-магазин одежды и косметики ASOS — отличный пример эстетичного интерфейса.

ASOS: Сочетание яркой графики и чистого белого фона повышает визуальную привлекательность и удобство навигации

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

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

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

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

Эстетика с сайта Fenty Beauty

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

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

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

Помимо визуально привлекательного интерфейса, Fenty Beauty предлагает такие функции, как виртуальная примерка и консультация с бьюти-экспертом.

Когда в приоритете функциональность

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

Главная страница Google с единственным полем ввода, — яркий пример минималистичного дизайна, который устраняет отвлекающие факторы и концентрирует внимание пользователя на поставленной задаче.

Одна из самых эффективных функций — простой призыв к действию (CTA), который помогает людям быстро попасть туда, куда им нужно. Например, если пользователь заходит в папку «Черновики и отправленные» в Slack, но у него нет черновиков, ему предлагают создать новое сообщение.

Slack побуждает пользователей предпринять конкретные действия

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

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

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

Medisafe, платформа для отслеживания приема таблеток, вошедшая в список финалистов премии Reuters Events Pharma Awards USA в 2022 году, — пример отличного функционального дизайна в сфере здравоохранения.

Пользователи Medisafe получают напоминание о приеме лекарства в установленное время

Приложение Medisafe отличается удобством использования. Люди могут отмечать принятые лекарства прямо с экрана блокировки. Получив уведомление, пользователь просто нажимает и удерживает его, чтобы открыть окно напоминания и подтвердить прием.

Разбор кейса: приоритет юзабилити и потребностей пользователей

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

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

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

Независимо от того, что стоит во главе угла — эстетика или функциональность, конечной целью дизайнера всегда должно быть создание комфортного и значимого опыта. Сосредоточив усилия на разработке ключевых функций, а не на эстетике, мы создали удобный, ориентированный на пользователя интерфейс. Наш клиент остался доволен результатом и вскоре запустит MVP, чтобы артисты и слушатели могли протестировать бета-версию приложения.

Заключение

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

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

Источник
и
:
arrow