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

В этой статье ми приоткроем завесу тайны над понятием «теория цвета», постараемся изложить материал максимально просто и понятно даже для простого обывателя. Также, рассмотрим влияние цветовой палитры на эмоциональное настроение. После ознакомления с этим материалом – у вас появится ещё один инструмент повышения конверсии и посещаемости вашего ресурса.

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

цветовое колесо

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

Аналогия. Цвета, соседствующие друг с другом на диаграмме называются аналогичными. Они приятно сочетаются друг с другом. Если в дизайне веб сайта вы будете применять такую комбинацию, результат вашей работы будет приятен глазу. Данное сочетание довольно часто встречается и в природе. Много профессиональных дизайнеров используют доминирующий цвет, который господствует в общем дизайне и потом выбирают из 2-3 его соседей.

аналогия аналогия_1

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

комплиментация комплиментация_1

Тройная цветовая схема. Тройная схема использует цвета, равноудалённые друг от друга. Результат – довольно яркая, даже пёстрая, и привлекающая внимание картинка. Часто такая комбинация применяется для дизайна сайтов, рассчитанных на детей и магазинов детских товаров.

тройная тройная_1 Разорванная тройная схема. Это вариация ранее описанной Комплиментирующей палитры. Результат – почти такой же броский дизайн как и при использовании комплиментации, однако несколько более спокойный и умеренный в своём настроении.

разорванная тройная разорванная тройная_1

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

прямоугольник прямоугольник_1

Квадрат. Эта схема похожа на схему «прямоугольник». Но все цвета круга равноудалены друг от друга.

квадрат квадрат_1

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

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

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


Подпишись на обновления блога по Сайтовед по RSSRSS, RSS по EmailEmail, twitter hennertwitter!


Интересные посты на "Сайтоведе":

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Можно использовать следующие HTML-теги и атрибуты: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>