Угадать желания пользователя: примеры предупреждающего дизайна и способы его применения

От легендарной скрепки Microsoft до голосового помощника Google Now.

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

Английское слово anticipatory («предупреждающий») произошло от латинского anticipare, что значит «заботиться о чем-то заранее». В каком-то смысле большинство продуктов содержат хотя бы один элемент такого предупреждения.

По мнению Аарона Шапиро из компании Huge, предупреждающий дизайн — это метод, согласно которому дизайнер может максимально упрощать для пользователей процесс взаимодействия с продуктом, принимая решения за них.

Так было всегда

Только подумайте: с момента зарождения веба пользователи сталкивались с окнами оповещений, всплывающими элементами, оповещениями в приложениях и другими компонентами, которые призваны предотвратить какое-то событие в будущем или попросить пользователя осуществить какое-то другое действие на основе его поведения в прошлом. Большинство таких событий основываются на простых условиях: если пользователь делает X, тогда нужно показать ему Y.

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

Пример использования этого подхода — Clippy из MS Office. Задолго до появления Siri, Cortana или Google Now созданный Microsoft виртуальный ассистент распознавал базовые намерения пользователей и отвечал на них, предлагая помощь. Если пользователь начинал набирать текст, в начале которого стояло обращение «Dear sir», это активировало появление Clippy.

Знаменитый персонаж Clippy из Microsoft Office
Знаменитый персонаж Clippy из Microsoft Office

Почему предупреждающий дизайн актуален сегодня

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

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

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

К примеру, Google Now позволяет пользователю «сфокусироваться на том, что важно», отвечая на вопросы, которые еще даже не пришли ему в голову. Если в календаре человека обнаружится бронирование столика в ресторане, Google Now рассчитает оптимальный маршрут до заведения и посоветует места по пути, где можно сделать красивые фотографии. Все это обогащает опыт пользователя.

Угадать желания пользователя: примеры предупреждающего дизайна и способы его применения

Предупреждающий дизайн и когнитивная нагрузка

Профессионалы годами применяют принципы «не повторяйся» (Don’t Repeat Yourself, DRY) и «делай проще» (Keep It Simple, Stupid, KISS) — пришла пора применить эту логику, чтобы сломать барьеры, с которыми сталкиваются взаимодействующие с интерфейсом пользователи.

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

В психологии используют термин «когнитивная нагрузка», чтобы описать затрату умственных усилий, которые требуются от человека в конкретный момент времени. Для всех, кто связан с проектированием интерфейсов, это важное понятие. Необходимо постоянно задавать себе вопросы:

  • Делаем ли мы все возможное, чтобы облегчить жизнь пользователя, которому нужно разобраться с чем-то новым для работы с продуктом?
  • Как можно снизить число элементов, на которые пользователь должен обращать внимание в единицу времени?

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

Онлайн-магазин продуктов Peapod создал мобильное приложение, которое выполнено в соответствии с принципами предупреждающего дизайна. В продукте используется проприетарный «движок» товарных рекомендаций Order Genius — он позволяет пользователям заполнить корзину за пару кликов, выбрав товары, которые они уже заказывали ранее. Рекомендации генерируются с учетом разных факторов, например, сезонности. Кроме того, программа постоянно анализирует поведение пользователя, чтобы с течением времени повысить точность рекомендаций.

Угадать желания пользователя: примеры предупреждающего дизайна и способы его применения

Еще одна попытка избавить покупателей от сложностей, связанных с подбором продуктов, — интеграция Preapod с Gatheredtable API. Пользователю лишь нужно выбрать тип диеты, блюда из которой он хочет приготовить, и сервис сам подберет ингредиенты, которые останется добавить в корзину.

Угадать желания пользователя: примеры предупреждающего дизайна и способы его применения

Предупреждающий дизайн и эмпатия

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

Как верно заметил дизайнер Пит Смарт в своей статье «Реальная эмпатия для инноваций»: «Эмпатический анализ помогает понять, какими способами люди преодолевают препятствия, и часто позволяет увидеть более элегантные решения проблем». Человеку, который преодолел 2517 миль в попытке с помощью дизайна решить «50 проблем за 50 дней», явно можно верить.

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

В Waze можно встретить несколько элементов предупреждающего дизайна, среди наиболее заметных:

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

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

Типы отчетов, доступные в Waze
Типы отчетов, доступные в Waze

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

Примеры использования предупреждающего дизайна

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

Facebook: использование геолокации для облегчения встреч в офлайне

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

Что если соцсеть собирает данные о желаниях, предпочтениях и местоположении для облегчения встреч в офлайне? Именно такой вопрос возникает после анализа вот таких оповещений приложения Facebook:

В оповещениях Facebook рекомендует события неподалеку, которые собираются посетить друзья пользователя
В оповещениях Facebook рекомендует события неподалеку, которые собираются посетить друзья пользователя

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

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

Facebook Beacon — Bluetooth-устройство, которое позволяет охватывать пользователей соцсети, находящихся неподалеку
Facebook Beacon — Bluetooth-устройство, которое позволяет охватывать пользователей соцсети, находящихся неподалеку

Saleswise: как превратить собранные данные в инструмент экономии времени

Saleswise — приложение, которое объединяет email, CRM, заметки и другие данные в единой панели для облегчения процесса продаж. Если вы зарегистрируетесь в системе и подключите свой Google-календарь, начнет работать предупреждающий дизайн.

Saleswise анализирует события в календаре на предмет потенциальных встреч для проведения продаж. Даже если вы вышли из системы и уже забыли о ней, от сервиса придет сообщение с темой «Подготовьтесь к вебинару» — к такому выступлению точно стоит готовиться заранее.

Пример сообщения от Saleswise
Пример сообщения от Saleswise

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

Pandora: рекомендации на основе релевантности

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

Пример такого алгоритма — проект Music Genome компании Pandora. Он рекомендует целые плейлисты музыки на основе одной выбранной песни. Каждый трек анализируется с применением до 450 музыкальных характеристик, сформулированных музыкальным аналитиком. Определив музыкальную идентичность, стоящую за песней, алгоритм затем может подобрать соответствующие ей другие композиции и сформировать из них плейлист.

Угадать желания пользователя: примеры предупреждающего дизайна и способы его применения

Онлайн-маркетплейсы вроде Ebay и Amazon также преуспели в создании таких рекомендаций. Они могут отправлять email-сообщения, в которых содержатся рекомендации на основе прошлого поведения пользователей.

Amazon отправляет письма с купонами на скидку на товары, соответствующие интересам пользователя
Amazon отправляет письма с купонами на скидку на товары, соответствующие интересам пользователя

Brita: упрощение повторных покупок

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

Угадать желания пользователя: примеры предупреждающего дизайна и способы его применения

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

Угадать желания пользователя: примеры предупреждающего дизайна и способы его применения

Meetup: рекомендации на основе интересов

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

Угадать желания пользователя: примеры предупреждающего дизайна и способы его применения

К примеру, человек состоит в нескольких объединениях разработчиков в своем регионе: такой набор данных позволяет Meetup запустить «предупреждающую» цепочку email-писем и оповещений, информирующих пользователя о новых встречах по его интересам.

Письмо с рассказом о новом оповещении
Письмо с рассказом о новом оповещении

Expedia: идеи за рамками покупки

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

Для путешественников это решает вопрос, который возникает сразу после бронирования авиабилетов и отеля: «Чем мне заняться в этом городе?» Expedia знает, куда едет человек, а Trippy — что там понравилось другим путешественникам. Вот как это выглядит:

Письмо от Expedia с советами из базы знаний Trippy
Письмо от Expedia с советами из базы знаний Trippy

Credit Carma: как предугадать возможности для кросс-продаж

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

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

Угадать желания пользователя: примеры предупреждающего дизайна и способы его применения

Fandango: поиск возможностей для дополнительного заработка

В базе Fandango, продающего билеты в кино, более 26 тысяч кинозалов США. Разработчики сервиса поняли, что если пользователь заинтересовался определенным фильмом, то ему могут понравиться и товары, связанные с ним. Например, если пользователь купил билет на фильм «Земля будущего», ему дарят электронную версию книги, по которой был написан сценарий. Подарок открывает возможности для партнерства — в случае с книгой это производитель электронных книг Nook.

Письмо с подарком от Fandango и Nook
Письмо с подарком от Fandango и Nook

Microsoft Delve: автоматическая привязка интерфейса к предпочтениям пользователей

Сервис Microsoft Delve — это своеобразный виртуальный помощник для команд, работающих в Office 365. Он анализирует контент и поведение команды для выработки предложений, ссылок на документы и подсказок контактов еще до того, как пользователь задумается об этом.

Логическая схема работы предупреждающего дизайна Delve
Логическая схема работы предупреждающего дизайна Delve

Домашний экран Home View уникален для каждого пользователя: он автоматически генерируется на основе представлений системы о том, что может быть интересно пользователю в конкретное время. К примеру, Delve может понять, что два человека работают вместе, если они одновременно просматривают один и тот же документ в «облаке».

Документы в Home View каждого пользователя подбираются автоматически
Документы в Home View каждого пользователя подбираются автоматически

Turbotax: прозрачное заполнение финансовых отчетов на основе пользовательских данных

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

Угадать желания пользователя: примеры предупреждающего дизайна и способы его применения

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

Угадать желания пользователя: примеры предупреждающего дизайна и способы его применения

Turbotax не только упрощает процесс заполнения отчетов, но и помогает людям законно платить меньше налогов. К примеру, в зависимости от предыдущих ответов появляются дополнительные вопросы, которые позволяют понять, полагаются ли человеку налоговые вычеты.

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

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

Чек-лист для старта работы

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

  • Есть ли способ упростить решение задачи для пользователей?
  • Не перегружаем ли пользователя информацией, которая может его запутать?
  • Можем ли не задавать этот вопрос и найти ответ на него в имеющихся данных?
  • Есть ли возможность направить взаимодействие с продуктом на основе прошлых предпочтений?
  • Можно ли сэкономить время пользователя, предложив ему шаблоны?
  • Можно ли на конкретном шаге дать пользователю дополнительную выгоду?
  • Существует ли возможность снизить вероятность ошибки в конкретном месте или дать альтернативные пути движения до её совершения?
  • Какая среда будет наиболее эффективна для распространения инструкций по решению конкретной задачи? Должны ли инструкции быть в виде текста, аудиоруководств или видео?

Предупреждающий дизайн: новый стандарт

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

1515
3 комментария

Интересная статья!

2
Ответить

Скрепыш, сколько времени прошло..

1
Ответить

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

Ответить