Сегодня эмоциональный дизайн становится очень мощным инструментом в руках профессиональных веб-дизайнеров. Следуя тенденции к упрощению сложных элементов, стремлению скорее к самой сути, нежели поверхностному восприятию, создание сайтов все больше ориентировано не на техничность, а на эмоциональное выражение.
Еще совсем недавно разработчики были настолько увлечены внутренней адаптацией к Сети, что на какое-то время совсем упустили из виду внешний вид сайтов, делая их практически безликими. Если бы не Дон Норман (Don Norman) и его книга «Эмоциональный дизайн» (Emotional Design), вполне возможно, что мы бы и по сей день концентрировались лишь на улучшении функциональности, игнорируя потенциал эмоций в веб-дизайне.
Чтобы получить большее представление о идеях Дона Нормана советую посмотреть этот ролик:
В своей книге как раз Норман и описывает почему «привлекательные вещи более эффективны». Если ресурс вызывает положительные эмоции, он быстрее завоюет доверие посетителей.
Существует целых три уровня эмоционального дизайна:
1. Интуитивное восприятие (внешний вид)
Более округлые и сглаженные элементы дизайна благоприятно воздействуют на человеческое сознание, в то время как острые, рваные и угловатые формы порождают обеспокоенность и настороженность. Интуитивные эмоции возникают в человеке мгновенно, так как связаны они скорее с подсознанием, поэтому многие веб-дизайнеры пытаются в первую очередь воздействовать на интуицию пользователей и вызвать массу положительных эмоций от результатов своего труда.
— очень позитивный сайт магазина книг для детей, вызывающий массу положительных эмоций и ассоциаций.
2. Удобство (юзабилити)
Подробней о принципах юзабилити уже говорилось в статье 7 способов улучшить юзабилити сайта. Основа юзабилити — сделать так, чтобы человек на сайте не задумывался куда перейти и что нажать. Чтобы этот принцип начал работать, необходимо создать условия, при которых возникает ощущение контроля над выполненным действием.
Входная страница — отличный пример приятной страницы с отличным юзабилити.
3. Созерцание (личная удовлетворенность, размышления, память).
Сознательный уровень, при котором человек способен размышлять над совершенными действиями. Такие эмоции могут возникать при рассматривании определенного объекта и его анализе.
Например, дизайн заставляет вести анализ, проводить некую аналогию с современной географической картой мира и искать в этом какие-то сходства.
Привлекательные продукты способствуют творческому мышлению и расширяют другие психические процессы в человеческом сознании. Если дизайн хорош, то в нем все три уровня работают одновременно. Сочетая данные уровни, вы можете сделать дизайн:
- привлекательный (влияние на восприятие пользователей);
- эффективный (убедитесь, что посетители находят именно ту информацию на ресурсе, которую действительно ищут);
- приносящий удовольствие;
- запоминающийся (положительное впечатление и память).
Простой, но запоминающийся дизайн —
Реализация эмоций в веб-дизайне
Веб-сайт обычно включает в себя несколько элементов, которые помогают сделать его более ярким и рассматривать в качестве «носителя» той или иной эмоции. Некоторые элементы достаточно очевидны: формы, цвета, градиенты, контраст и т.д. Однако давайте остановимся на менее явных приёмах.
Юмор
Юмор, пожалуй, один из самых эффективных способов общения между людьми. Смех и улыбки способны «растопить лед» и заставить людей чувствовать себя комфортно. Однако то, что у одного человека вызовет смех, для другого может показаться оскорбительным, поэтому при использовании юмора на веб-сайте, следует учитывать специфику проекта.
— Дмитрий в плане юмора оттянулся по-полной
Кстати говоря, веселые сайты создаются не только индивидуально, существует масса отличных макетов, которые нельзя обойти стороной. Например, вот такой .
Распознавание
Человек устроен так, что постоянно (порой даже неосознанно) ищет эмоциональную связь с другим человеком. Вот почему изображения лиц способствуют внутренним переживаниям — радости или огорчениям. Иными словами, человек подсознательно ищет на сайте лицо другого человека, и это лицо способно зарядить эмоциями.
Пример эмоционально насыщен и вызывает положительные эмоции:
И ещё
Желание
Если сайт занимается электронными продажами, что спрос на товар напрямую зависит от привлекательности картинок. Привлекательность побуждает к покупке желанного продукта.
Сочный и яркий сайт ресторана:
И
Приятные мелочи
Где же ещё можно разгуляться, как не на игре с мелочами? Приятные мелочи могут «зацепить» человека на эмоциональном уровне. Вот пара примеров, чтобы вы поняли, что я пытаюсь сказать:
Самое элементарное место, где можно показать своё внимание к мелочам — это страница 404. Например, на хабре
Второй пример — страница запуска компании в MailChimp. Под кнопкой написана фраза “This is your moment of glory”, означающая важность этого события
Ну и наконец многими любимый Pinterest. На странице ввода логина и пароля используюстся небанальные фразы “Looks good!”, вызывающие положительные эмоции и расположение
Эмоциональный дизайн имеет много позитивных качеств. Столкновение с чем-то привлекательным и необычным пробуждает в нас творческое мышление. Дон Норман определил три уровня визуального дизайна, основанного на наших психологических процессах: интуитивное восприятие, поведенческое восприятие и созерцательный уровень. Перед веб-дизайнером стоит ответственная задача сбалансировать эти уровни и обеспечить максимальную отдачу веб-проекта для пользователей: предугадать их внутренние цели, потребности и ожидания.
Главный совет для веб-разработчиков: прежде, чем создавать сайт, изучайте эмоции потенциальных пользователей, анализируйте, используйте свои наблюдения. Начните наконец создавать эмоции, а не просто привлекательный дизайн и впоследствии вы точно забудете о других приемах привлечения посетителей на ресурс.
И наконец… что почитать?
Есть отличная книга, где подробно рассказывается о эмоциональном веб-дизайне — книга Аарона Уолтера «Эмоциональный веб-дизайн».
..
