FORGOT YOUR DETAILS?

Цветовая теория для дизайнеров, часть 1: значение цвета

by / Wednesday, 26 February 2014 / Published in Web-решения, Дизайн

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

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

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

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

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

Теплые цвета

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

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

Красный (чистый цвет)

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

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

За пределами западного мира красный имеет другие ассоциации. Например, в Китае красный является цветом процветания и уважения. Он также может быть использован для привлечения удачи. В иных восточных культурах красный носят невесты в день свадьбы. В Южной Африке, тем не менее, красный — это цвет траура. Красный также ассоциируется с коммунизмом. Красный цвет стал связываться с пропагандой защиты от СПИДа в связи с широко распространенной «красной» кампанией.

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

Примеры

Темный оттенок красного придает чувство силы и элегантности дизайну сайта.

Чистый красный в сочетании с черным фоном дает чувство силы и высокого профессионализма сайту.

Очень яркие акценты красного придают сайту чувство энергии и движения.

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

Темно-красный в сочетании с серым и белым производит очень элегантное и профессиональное впечатление.

Оранжевый (вторичный цвет)

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

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

Примеры

Яркая оранжевая коробка привлекает внимание с своему контенту, даже в сочетании с другими красными элементами на странице.

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

Темно-оранжевый в сочетании с салатным воспринимается как нейтральный и «земной» цвет.

Оранжевый используется здесь для придания дружественного и приглашающего впечатления.

Оранжевые акценты придают визуальный интерес и обращают внимание на приглашающую надпись.

Желтый (чистый цвет)

Желтый обычно расценивается как наиболее яркий и энергический среди теплых цветов. Он ассоциируется с счастьем и солнечным сиянием. Желтый также может быть ассоциирован с обманом и трусостью (называть кого-то «желтым» означает считать его трусом).

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

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

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

Примеры

Яркий желтый заголовок и графика придают этому сайту чувство энергии и позитива.

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

Яркий желтый акцент обращает внимание на наиболее значимые части сайта.

Яркий желтый подсолнух напоминает посетителям о лете, а в сочетании с изысканно-желтым фоном придает чувство уюта и стабильности.

Яркий желтый заголовок добавляет немного дополнительной энергии дизайну.

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

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

Синий — единственный чистый цвет в холодном спектре, что означает, что остальные образованы путем смешения синего с теплыми (желтым для зеленого и красным для фиолетового). Зеленый получает некоторые атрибуты желтого, а фиолетовый — красного. Используйте эти цвета в дизайнерских проектах для придания им чувства профессионализма или спокойствия.

Зеленый (вторичный цвет)

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

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

Примеры

Очень приглушенный зеленый придает сайту весьма близкое к природе и земле чувство.

Яркий зеленый заголовок в сочетании с лиственным мотивом придает сайту очень натуральный и живой вид.

Оливковый придает сайту натуральный вид, что хорошо подходит контенту.

Более яркий зеленый в ретро-стиле придает ему очень свежий, энергетический вид.

Еще один оливковый сайт с очень натуральным видом.

Синий (чистый цвет)

Синий часто ассоциируют с печалью в английском языке. Синий также используют для представления спокойствия и ответственности. Светлый голубой может быть освежающим и дружественным. Темный голубой является более строгим и торжественным. Синий также связан с миром и имеет духовные и религиозные коннотации в многих культурах и традициях (например, Дева Мария в основном изображается в синих одеждах).

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

Примеры

Темно-синий придает торжественный вид, в то время как более светлый и голубой синий освобождают дизайн от чрезмерной чопорности.

Темно-синий придает этому сайту профессиональный вид, особенно в комбинации с белым фоном. А светло-голубой акцент придает немного больше интереса.

Яркий, небесный синий придает сайту молодежный и ультра-модный вид, что подчеркивается красноватым акцентом.

Этот сайт сочетает несколько синих оттенков, что придает ему освежающий вид.

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

Фиолетовый (вторичный цвет)

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

В Таиланде фиолетовый является цветом траура для вдов. Темно-фиолетовый традиционно ассоциируется с достатком и королевским родом, в то время как светло-фиолетовый (как лавандовый) считается более романтичным цветом.

В дизайне темно-фиолетовый может придать вид достатка и роскоши. Светло-фиолетовый мягче и связывается с весной и романтикой.

Примеры 

Темный оттенок, использованный здесь, напоминает королевский фиолетовый, что весьма подходит для брэнда Asprey luxury.

Светлый и средний фиолетовый здесь хорошо работают на то, чтобы сообщить креативный вид.

Более светлый, красноватый фиолетовый этого сайта придает ему одновременно богатый и энергичный вид.

Темно-фиолетовый фон на сайте придает ему креативности.

Темно-фиолетовый акцент на сайте дает ему роскошный и изысканный вид.

Нейтральные

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

Черный цвет

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

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

Примеры

Черный акцент в сочетании с более яркими цветами и очень темный коричневый фон придают общий дерзкий вид.

Черный в сочетании с ледяным голубым выглядит холоднее.

Черный здесь в сочетании с темно-серым и цветом лайма, а также общая гранжевая тематика добавляет остроты дизайну.

Черные акценты добавляют дополнительный уровень утонченности и модернизма дизайну.

Строгие черные акценты добавляют общее чувство утонченности дизайну.

Белый

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

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

Примеры

Белый на сайте Fuelhaus используется в контрасте с электрическим синим.

Белый фон весьма популярен на сайтах с минималистическим дизайном, и предполагает сильный контраст черной типографии.

Здесь белый используется как акцентирующий цвет, который осветляет весь сайт.

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

И снова белый используется как осветляющий фон для всего сайта.

Серый

Серый — это нейтральный цвет, в основном сконцентрированный на холодном конце спектра. Он может быть расценен как капризный или депрессивный. Светлый серый может быть использован вместо белого в некоторых дизайнерских проектах, и темно-серый может быть использован вместо черного.

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

Примеры

Светлый серый придает весьма приглушенный и мягкий вид этому сайту.

Светло-серый фон добавляет ощущение того, что его набрали в типографии.

Более холодный серый на этом сайте придает ему модный, изящный вид.

Темно-серый фон и светло-серые буквы придают совершенно модный вид этому дизайну.

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

Коричневый

Коричневый ассоциируется с землей, деревом и камнем. Это совершенно натуральный цвет и теплый нейтральный. Коричневый может быть связан с надежностью и торжественностью, стойкостью, приземленностью. Он может также быть оценен как скучный.

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

Примеры

Серо-коричневый здесь дарит чувство солидности и надежности.

Оранжево-коричневый здесь придает весьма натуральный и солидный вид.

Темно-коричневый, используемый для фона, привносит здесь земной и устойчивый вид к общему дизайну, и позволяет более светлым тонам по-настоящему выделяться.

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

Серо-коричневый фон здесь придает стабильный и приближенный к земле вид.

Бежевый и цвет загара

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

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

Примеры

Фон светло-песочного цвета ощущается юно и свежо, поскольку он окружен яркими цветами вокруг себя.

Светло-песочный фон приносит более консервативное и элегантное чувство в общий дизайн.

Желтоватый песочный фон становится еще теплее благодаря оранжевым и коричневым акцентам в дизайне сайта.

Песочный часто используется в качестве бумажной текстуры и в своей более сероватой форме как бетон или каменная текстура.

Бежевый фон заголовка и другие акценты на сайте придают утонченный и традиционный вид общему дизайну.

Кремовый и слоновая кость

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

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

Примеры

Фон цвета слоновой кости имеет теплые свойства, которые подогреваются более холодными цветами сайта.

Серовато-кремовый фон сайта сделан более теплым оранжево-коричневыми акцентами.

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

Кремовый фон здесь оттеняет винтажную тему, которая проходит сквозь дизайнерскую схему.

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

В заключение…

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

  • Красный: страсть, любовь, ярость
  • Оранжевый: энергия, счастье, жизнелюбие
  • Желтый: счастье, надежда, обман
  • Зеленый: новые начинания, изобилие, природа
  • Синий: спокойствие, ответственность, печаль
  • Фиолетовый: креативность, роялти, изобилие
  • Черный: мистерия, элегантность, дьявол
  • Серый: капризность, консерватизм, формализм
  • Белый: непорочность, чистота, добродетель
  • Коричневый: природа, полезность, надежность
  • Песочный или бежевый: консерватизм, благочестие, скука
  • Кремовый или слоновая кость: спокойствие, элегантность, непорочность

Кэмерон Чапман (Cameron Chapman)

Кэмерон Чапман является профессиональным веб- и графическим дизайнером со стажем более шести лет. Она написала много блогов, включая ее собственный, Cameron Chapman On Writing. Он также является автором The Smashing Idea Book: From Inspiration to Application.

Перевод и обзор подготовила Ольга Тернова, корреспондент портала Как сделать презентацию


TOP