Эмоциональный веб-дизайн - Аарон Уолтер

Предвкушение, эксклюзивность и статус

Удивление сжимает эмоции пользователя до одного мгновения, делая его реакцию более интенсивной, а предвкушение (антипод удивления) может создать особую эмоциональную связь. Предвкушение возникает тогда, когда мы объявляем о грядущем событии и даем аудитории время над ним подумать. Родители пробуждают воображение детей в канун Рождества, рассказывая, что скоро Санта придет к ним домой, а дети предвкушают праздничное волшебство и подарки.

Дизайнеры видеоигр называют предвкушение «открытой системой». Игры с открытой системой (например, The Sims[21]) позволяют пользователям играть по своим правилам. Открытые системы побуждают людей задействовать воображение. Игры с закрытой системой, вроде Super Mario Brothers[22], сильно сужают игровое пространство, заставляя пользователя двигаться к определенной цели в заданном направлении. Сравнивать открытую и закрытую системы – все равно что выяснять, чем книга отличается от фильма. Книги требуют нашего воображения, а в фильмах все уже придумано за нас.

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

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

Новый Twitter

В начале 2010 года ребята из Twitter работали над проектом масштабного редизайна под скромным названием «Новый Twitter». Над концепцией вместе с командой работал и креативный директор Twitter Дуг Бауман, который тщательно изучал малейшие визуальные детали и схемы взаимодействия. Программист Марк Траммел проводил тесты на удобство и простоту использования интерфейса. Видео тестирования транслировалось в дизайн-студию, чтобы Бауман и команда могли сразу исправлять недочеты.

Ставки были очень высоки: Twitter стал частью повседневной жизни для сотен миллионов пользователей. Перед дизайнерами стояла сложнейшая задача – не потерять постоянных пользователей, которые изучили сервис вдоль и поперек и мимо внимания которых не прошло бы ни одно, даже самое незначительное изменение. Слухи о проекте редизайна пошли, когда Бауман опубликовал его частичный скриншот в Dribbble (http://bkaprt.com/de/7) – социальной сети, где дизайнеры могут размещать части своих работ в маленьком разрешении 300 × 400 пикселей (рис. 4.4). Ограничения Dribbble позволили Бауману, как он выразился, поделиться фрагментом «не сдавая контору». К тому же осталось достаточно простора для фантазий, что находится за пределами скриншота.

Рис. 4.4. Дуг Бауман опубликовал частичный скриншот редизайна Twitter на Dribbble в апреле 2010 года, чем спровоцировал массу слухов и обсуждений

В считаные минуты скриншот разошелся по Сети. Статьи на GigaOm и Mashable заставили сотни тысяч людей размышлять о том, что готовит Новый Twitter. Спустя пять месяцев Новый Twitter был запущен для ограниченного числа пользователей. Некоторые из них были влиятельными блогерами, некоторых, по всей видимости, выбрали случайно. И наконец, ожидание закончилось!

Первые пользователи Нового Twitter (рис. 4.5) хвастались фолловерам, что выиграли в twitter-лотерее, и отсылали сообщения с хэштегом[23] #NewTwitter. Это позволяло с легкостью отслеживать обсуждение редизайна. Несмотря на то что постепенный запуск прежде всего преследовал цель избежать возможных негативных последствий и обеспечить пользователям плавный переход на новый интерфейс, ограниченный доступ вызвал у первых пользователей ощущение принадлежности к избранному кругу, что, разумеется, не оставило их равнодушными. Поделившись своими чувствами в твитах, они получали ответы от все еще находившихся в ожидании фолловеров, что позволило им закрепить свой уникальный статус.

Рис. 4.5. Результат редизайна Twitter 2010 года

Предвкушение, эксклюзивность и повышение статуса сформировали пользовательское восприятие редизайна Twitter.

Конечно, нашлись и активные критики, но в целом впечатление было таково: Новый Twitter лучше своего предшественника (рис. 4.6). Пользователи приходили к Новому Twitter в хорошем настроении и получали удовольствие от нового дизайна и функциональных улучшений. Твиты первых пользователей позволяли остальным влюбиться в новый дизайн еще до того, как они его увидели.

Рис. 4.6. Пример, иллюстрирующий положительные эмоции фолловеров при запуске Нового Twitter

Говорить «вы можете» вместо «вы должны»

Twitter сделал и еще кое-что интересное. Он не заставлял всех пользователей перейти на новый дизайн, а оставил им возможность сохранить старый. Предоставьте человеку выбор – и вы увидите, как изменится его отношение к ситуации. Если заставить человека что-то сделать, он отреагирует негативно. Позвольте ему меняться тогда, когда он готов к этому, и вы погасите его гнев. Любой из нас предпочтет услышать «вы можете» вместо «вы должны».

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

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

Эффект предшествования

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

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

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

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

MailChimp: случайный эффект предшествования

Насколько силен эффект предшествования, я осознал, будучи ведущим дизайнером в MailChimp. В 2008 году мы запустили масштабный редизайн, перестроив бо́льшую часть приложения. Развеселый бренд (как вы, возможно, знаете, на нашем логотипе изображена обезьяна) и беспрецедентная свобода дизайна не мешали нам тестировать стратегии эмоционального дизайна.

Мы начали с бросающегося в глаза, но ненавязчивого элемента – говорящего шимпанзе на некоторых страницах. Этот персонаж, известный под именем Фредди фон Чимпенхаймер IV, выглядывает из-за заголовка страницы и выдает забавное приветствие, иногда ссылаясь на смешное видео с YouTube (рис. 4.7). Из истории дизайна мы знали, что говорящее лицо бренда может стать проблемой, и сразу установили для Фредди ряд правил.

Рис. 4.7. Фредди фон Чимпенхаймер IV шутливо приветствует пользователей, делая рутинную отправку электронных писем чуть более приятной