Читаем Эмоциональный веб-дизайн полностью

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

Контраст не просто формирует наше мировоззрение, он влияет на нашу способность воспринимать абстрактные концепции, например бренды.

Бренд и контраст

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

Веб-дизайнер Рикардо Местра понимает, какое значение имеет контраст. Его сайт (http://duplos.org) бросает вызов традициям (рис. 2.4).


Рис. 2.4. Дизайнерское портфолио Рикардо Местра бросает вызов традициям


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

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

Власть эстетики

Несмотря на то что tumblr и сайт Местра находятся, что называется, на разных концах спектра, у них есть кое-что общее: и тот и другой доставляют пользователям эстетическое удовольствие. Оба искусно используют цвет, шрифт, масштаб, разметку и пространство. Иными словами, они прекрасно сконструированы. Дизайн часто ошибочно принимают за необязательное украшение функционального интерфейса. Вы наверняка когда-нибудь слышали, как ваши коллеги говорят: «Было бы неплохо обзавестись стильным интерфейсом, но людей больше волнует то, что́ сайт делает, а не то, как он выглядит». Интересно, пришел бы кто-нибудь из них на собеседование в пижаме, раз важен не внешний вид, а способности? Думаю, если они осмелились бы это сделать, то быстро осознали бы, насколько неправы.

Как говорит в своей книге Emotional Design («Эмоциональный дизайн») первопроходец в области юзабилити Дональд Норман[13], красивый дизайн вызывает в мозгу позитивный эмоциональный отклик, который улучшает наши когнитивные способности:

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

Норман описывает эстетически-практичный эффект. Привлекательные вещи, как правило, лучше работают.

Многие бренды применяют этот принцип, но лишь некоторые достигли таких высот, как Apple.

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

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

В 2002 году Apple запатентовала так называемый Breathing Status LED Indicator. Каждый, у кого дома есть компьютер Mac, знает, что ноутбуки и моноблоки Apple оснащены индикатором статуса, который начинает мигать при переходе в спящий режим. Дизайнеры Apple поняли, что чаще всего этот индикатор будет виден в пустых офисах, спальнях и гостиных, где станет единственным источником света.

Перейти на страницу:

Все книги серии Актуальные книги для тех, кто создает сайты

HTML5 для веб-дизайнеров
HTML5 для веб-дизайнеров

Джереми Кит обладает способностью писать легко и доступно о сложных вещах и сразу выделять те определенно важные моменты, которые имеют значение для дизайнеров-разработчиков. В книге «HTML5 для веб-дизайнеров» он рассказывает о современных тенденциях в области web-разработок.В HTML5 появилось много интересных тэгов, в том числе поддержка аудио– и видеофайлов. Теперь вам не надо тратить время на установку плагинов для проигрывания музыки или видео – просто воспользуйтесь одним из новых тегов.Автор убеждает, что можно использовать структурные элементы HTML5 прямо сейчас, например назначить стиль любому элементу, который вы захотите изобрести, или начать использовать доступные вам дополнительные уровни заголовков.Книга Джереми Кит – настоящая инструкция по использованию HTML5.

Кит Джереми

Зарубежная компьютерная, околокомпьютерная литература

Похожие книги