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

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

«То, как мы думаем, что мы испытываем, и что мы делаем каждый день в значительной степени зависит от метафоры».
— Лакофф и Джонсон

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

Давайте посмотрим, как можно использовать метафоры для улучшения пользовательского опыта (user expirience) на своем сайте.

1. Метафоры могут показать незнакомые понятия в конкретных условиях

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

Пример: на сайте Startups, This Is How Design Works значок лампочки (меня осенило!) используется для обозначения слова «инновации»; значок гаечного ключа — для обозначения производства чего-то полезного; а значок кисти представляет «эстетическое»:

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

Многие пользователи Интернета не знают, что такое 404-я ошибка.

(И это нормально, кстати. Вы, уважаемый читатель, наверняка опытный пользователь интернета. И все же, вы можете не знать, например, плюсы и минусы разных видов МДФ — зато это прекрасно знает мебельщик. И ему может быть так же смешно, когда кто-то этого не знает. Поэтому люди должны общаться между собой как можно более понятным языком, приводя разные аналогии.)

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

Метафоры еще можно использовать для объяснения процесса.

«Datashift» показывает воображаемую машину, которая превращает иконки различных соц. медиа в статистические данные, отображающиеся на экране:

Конечно, это абстрактный процесс. Но становится ясно, какие услуги компания предлагает.

2. Метафоры могут создать знакомые ощущения

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

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

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

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

3. Метафоры вызывают эмоции! :) :(

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

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

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

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

4. Метафоры могут привлечь внимание пользователей

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

Например, у нас есть ассоциация с бейджиками — конференции и семинары. Именной бэйджики означают, что вы зарегистрированный пользователь. Вы заплатили за участие или имеете право на что-то, что доступно только немногим. Эту метафору можно использовать на сайте (разработана Meng To), чтобы сделать регистрационную форму более привлекательной:

А Flourish решили использовать дерево. Дерево объясняет, что они делают (вместе с лозунгом «Мы выращиваем веб-сайты, процветающие в самых суровых климатических условиях»). Большое большое дерево посередине пустыни, которые отлично себя чувствует! Так они показывают силу своих услуг. Иллюстрация и метафора привлекательные и запоминающиеся.

5. Метафоры могут мотивировать пользователей к действиям

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

Сайт Cascade Brewery Co предлагает классные метафоры для навигации по меню:

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

Еще один замечательный способ подтолкнуть к регистрации — обратный отсчет продолжительностью в одну минуту:

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

Заключение

Метафоры могут стать мощным инструментом для улучшения пользовательского опыта (UX). Они способны:

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

Как вы используете метафоры в своих проектах? Может, вы видели другие хорошие примеры того, как метафоры используются в интернете?

По материалам sixrevisions.com.