Естественные цвета и дизайн интерфейсов - Теория цвета - Webmascon

| WEBMASCON - журнал для веб-мастеров обновление |11.11.2003

| Теория цвета

Начало
Темы
Архив
Daily
Персоналии
Форумы
Отзывы
О сайте

все статьи на тему Теория цвета

# Естественные цвета и дизайн интерфейсов

Natural Selections: Colors Found in Nature and Interface Design
© Copyright 8 September 2003, Luke Wroblewski © перевод, Александр Качанов распечатать

Всемирная Паутина переполнена стерильным дизайном. Сайты компаний Hewlett-Packard, IBM, Dell, Microsoft, и множества других фактически неотличимы друг от друга (у них сходные цветовые схемы и расположение элементов). Можно было бы сказать, что такая однообразность интерфейса делает Сеть более удобной для работы, но в действительности такие сайты не оставляют в памяти пользователей никакого следа и не способны создать положительный контакт со своей аудиторией.

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

### Способность выделяться

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

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

Уникальная палитра, основанная на найденных в Природе цветах, может вызволить вас из цветовой унылости World Wide Web (рис.1), помогая создать более запоминающийся веб-сайт. Например, естественная комбинация цветов (рис. 2), использованная при создании макета этого сайта (рис. 3), полностью контрастирует с более "стандартной" версией дизайна этого же сайта (рис. 4). Мягкие цвета достаточно нежны, чтобы быть фоном, но вместе с тем они позволяют достаточно чётко выделить четыре основных информационных области сайта.

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

### Способность направлять

Естественные цвета часто менее насыщены и более приятны для глаз, чем их искусственные аналоги. В результате они дают пользователю возможность сосредоточиться на взаимодействии с сайтом, не отвлекая его слишком яркими оттенками. Когда вы пытаетесь сосредоточиться на информации, размещённой в слое с очень яркой цветовой гаммой (рис. 4), ваши глаза постоянно возвращаются к этим ярким цветам (в данном случае к синей полосе наверху). С другой стороны, оттенки жёлтого и голубого на альтернативном варианте дизайна (рис. 3) создают гармоничный баланс между изображениями, панелями навигации и контентом. (Это особенно полезно для веб-сайтов, имеющих значительный объём материалов). Наиболее заметными сделаны самые полезные элементы - меню и блоки с содержимым, но не фоновые цвета, для которых были выбраны природные цвета. Наши глаза привыкли к голубым, жёлтым и серым тонам, так как мы видим их каждый день вокруг себя.

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

### Способность увлекать

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

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

### Способность вдохновлять

Естественные цвета, помимо всего прочего, вдохновляют. Разнообразие Природы непрерывно предлагает новых идеи и подходы при выборе цветов. Например, цвета, использованные в компании по привлечению туристов в Дублин, оказались вовсе не оранжевым, зелёным и белым цветами ирландского флага, как вы могли бы подумать. Вместо них были использована цветовая комбинация, характерная для морского побережья Ирландии. Такое сочетание цветов является более живым и привлекательным, делая Дублин забавным и эмоционально открытым. Жалко, что эта схема не была использована на всем сайте Дублина, из-за чего он менее ярок и менее привлекателен.

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

Люк Вроблевски

Luke Wroblewski - автор замечательной книги "Site-Seeing: A Visual Approach to Web Usability". Он работает в LukeW Interface Designs, и ведет курсы дизайна интерфейсов в Университете шт.Иллинойс в Urbana-Champaign.

Ссылки по теме

- Эта статья на английском языке | англ.
- Другие статьи сайта Boxes and Arrows | англ.

« назад к списку статей

Самые популярные статьи
- Шаблонные решения для web-сайтов
- 10 главных ошибок веб-дизайна 2002 года
- К черту старые броузеры
- Незаменимые инструменты Web-Мастера
- Как подобрать гармоничную комбинацию цветов для Web-сайта

Начало | Темы | Архив | Daily | Персоналии | Форумы | Отзывы | О сайте

|  | Автор и администратор ресурса - Александр Качанов Webmascon Project открыт в 1999 году
© 1999-2002, переводы, Александр Качанов © 1999-2002, Webmascon © дизайн | matepuana.com |  |