Мобильный логотип Томатус
+7 (495) 181 01 44
Оставить заявку
Ирина

25 Мая 2014, Ирина

О том, как цвета сочетаются

Вступление

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

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

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

С чего начать?

С прекрасного цветового круга Иоханнеса Иттена!

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

Цветовой круг

Цветовой круг — главный инструмент для подбора цветовой схемы дизайна или проверки гармоничности.

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

Вторым стал цветовой круг Гёте. За основу были взяты три цвета — красный, желтый и синий, из которых получалось огромное количество новых цветов, плавно переходящие один в другой.

Иттен же составил круг из 12 частей. Как и у Гёте, за основу Иттен взял три цвета, при смешивание которые, он получается три дополнительных (составных) — зеленый, оранжевый и фиолетовый. А далее составные цвета смешиваются с основными, таким образом, получаются третичные цвета.

Цветовой круг, который лег в основу теории гармонии цветов, готов!


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

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


Самый простой и понятный для новичков — круг Иттена. Его мы и будем использовать.

Сочетание цветов. Цветовые схемы.

Что такое цветовой круг, мы уже разобрались. Теперь давайте разберемся как работает "колесо фортуны"!

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


  1. Аналогичное (аналоговая триада) — используются три соседних по кругу цвета. В результате получается мягкая и приятная цветовая схема, такое сочетание часто встречается в природе.
  2. Дополнительное (комплементарное) — два противоположных цвета. Комплементарные цвета — контрастные. Данная цветовая схема весьма распространена в веб-дизайне, т.к. очень эффектно и удачно можно выделить основные элементы интерфейса. Главное, не применять рядом два противоположных по цветовому кругу шрифта =) А то глаза у пользователя очень быстро устанут от такой анархии. 
  3. Контрастная триада — к одному из цветов добавляют два соседних. В итоге мы имеем более спокойную альтернативу комплементарной цветовой схеме.
  4. Классическая триада — три цвета равноудаленные на круге. Для веб-дизайна, рекомендуется использовать только один цвет в качестве основного, а с помощью других двух -расставлять акценты / смысловые нагрузки.
  5. Прямоугольная схема — используются две пары контрастных цветов. Для веб дизайна такую схему следует использовать крайне осторожно, выбирая только один цвет в качестве основного, а остальные - как вспомогательные. Тогда и дизайн будет выглядеть гармонично, и потенциальный покупатель на сайте будет чувствовать себя комфортно.
  6. Квадратная схема — еще один вариант прямоугольной схемы. Цвета располагаются на равном расстоянии друг от друга. 

Влияние на эмоции

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


Теперь разберемся, что такое тепло, а что такое холодно!

Теплые цвета


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

Использованием таких цветов можно отразить страсть, силу, мощь, энергию, радость.

Холодные цвета


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

Нейтральные цвета


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

Нейтральные цвета — очень условная классификация. К этой группе относятся ахроматические цвета: белый и черный, серый, плюс коричневый и цвет слоновой кости. Хотя коричневые и являются спорными в этой группе, так как многие художники и дизайнеры утверждают, что это теплые цвета. А если углубится, то и серый не всегда бывает нейтральным, например, в Японии принято считать что существует более 50 оттенков серого, 7 из которых являются основными, из которых только 4 нейтральны. Но на самом деле, все это философия =)

LEVEL UP!

Ура! Теперь, когда базис понимания цветовых схем заложен, мы наконец-то можем начать погружение в цветовые модели с головой. О том, как устроены наши любимые цветовые модели: RGB, CMYK, LAB — читайте далее!

Вернуться ко всем статьям