теория цвета для дизайна и иллюстрации

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

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

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

Пример использования дизайнером небольшой цветовой палитры для создания мудбордов от дизайнера Natalia Kononkova. Источник

Содержание

1. Кому и зачем нужна цветовая палитра
2. Сколько цветов должно быть в палитре
3. Как использовать цветовую палитру на сайте
4. Как подобрать палитру

Кому и зачем нужна цветовая палитра

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

И.К. Айвазовский. Девятый вал. 1850 г. Источник

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

Использование ограниченной палитры в брендинге, автор Lemontoli. Источник

Сколько цветов должно быть в палитре

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

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

Исследование N. Faisal 2016. Специалисты NNGroup изучили влияние атрибутов веб-дизайна на лояльность пользователей и построение у них доверия к высокой неопределенности. В ходе эксперимента было изучено 112 различных сайтов, которые пользовались особой популярностью среди пользователей в 2000–2015 годах. Выяснилось, что половина всего объема сайтов имели однотонную цветовую палитру, а в качестве цветового решения для второй половины были выбраны всего два акцентных цвета. Аналитики пришли к выводу о том, что такие дизайнерские решения позволили создать единство в восприятии большинства пользователей, а также дали возможность людям не отвлекаться на яркие элементы, а оставаться сосредоточенными на контенте.

Классический пример минималистичной цветовой палитры — в оформлении сайта использовано всего 4 оттенка. Пользователи изучают контент, не отвлекаясь на декоративные элементы. Источник

Исследование NNGroup 2015. Аналитики предложили фокус-группе оценить несколько версий сайта американской компании Sun Microsystems, которые отличались друг от друга только цветовыми решениями. Пользователи отметили, что если на яркой фоновой подложке представлена яркая фотография, то им сложно воспринимать информацию. Идеальный сайт имеет минималистичную цветовую схему.

Пример минималистичной палитры от компании Lamoda. Источник

Как использовать цветовую палитру на сайте

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

Небольшая цветовая палитра. Источник

Как подобрать палитру

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

Вот некоторые из таких сервисов. 

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

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

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

Пример сгенерированных палитр в Colllor для голубого цвета. Источник

Найти другие сервисы в интернете можно по запросам «цветовой круг онлайн», «подбор цветов онлайн» и подобным.

ИСКРА —
неделя знакомства
с дизайн-профессиями

бесплатно

ИСКРА —
неделя знакомства
с дизайн-профессиями

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

разжечь искру

Палитра в вычислении — HiSoUR История культуры

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

терминология
Адаптивная цветовая палитра расширяется от 2 цветов до 256 цветов, демонстрируя, как изменяется изображение (нажмите, чтобы увидеть анимацию).
В зависимости от контекста, термин палитра и связанные с ней термины, такие как палитра «Интернет» и палитра RGB, могут иметь несколько иные значения. Ниже приведены некоторые из широко используемых значений для палитры в компьютерной графике:

Общее количество цветов, которые данная система может генерировать или управлять (хотя из-за ограничений видеопамяти она может не отображать их одновременно):
полная палитра: например, на дисплеях Highcolor имеется 16-битная палитра RGB.

Ограниченный выбор цветов, которые могут отображаться одновременно:
На весь экран:
фиксированный выбор палитры: данный адаптер дисплея может предлагать фиксированный выбор цвета, если его аппаратные регистры установлены надлежащим образом. Например, адаптер цветной графики (CGA) в одном из стандартных графических режимов может быть установлен так, чтобы отображать так называемую палитру # 1 или палитру # 2: две комбинации из трех фиксированных цветов и один определенный пользователем цвет фона каждый.
выбранные цвета или выбранные цвета. В этом случае выбор цвета, обычно из более широкой явно доступной полной палитры, всегда выбирается программным обеспечением, как пользователем, так и программой. Например, стандартный адаптер VGA-дисплея, как говорят, обеспечивает палитру из 256 одновременных цветов из 262144 разных цветов.
палитру по умолчанию или системную палитру: данные выбранные цвета официально стандартизованы каким-либо органом или корпорацией. Например, известные веб-безопасные цвета для использования с интернет-браузерами или палитра Microsoft Windows по умолчанию.

На индивидуальном изображении:
цветной или цветной таблицы: ограниченный выбор цвета сохраняется внутри данного файла с индексированным цветным изображением. Например, GIF.
палитру изображений или цвета изображения. Предполагается, что ограниченный выбор цвета является полным списком цветов, данных данным цифровым изображением, даже если файл изображения не использует кодирование с кодировкой цветного пикселя.
Основное оборудование, которое может использоваться для хранения этих одновременных цветов:
аппаратная палитра или таблица цветного просмотра (CLUT): чтобы показать их, значения выбранных цветов должны быть загружены в регистры аппаратного обеспечения цветности подсистемы отображения. Например, аппаратные регистры Commodore Amiga известны как их цветовая палитра, так и их CLUT, в зависимости от источников.

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

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

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

Созданная таким образом мастер-палитра может быть заполнена до 8R × 8G × 4B = 256 цветов, но это не оставляет места в палитре для зарезервированных цветов, цветовых индексов, которые программа может использовать для специальных целей. Более общим является использование только 6R × 6G × 6B = 216 (как в случае с цветами в Интернете), 6R × 8G × 5B = 240 или 6R × 7G × 6B = 252, что оставляет место для некоторых зарезервированных цветов.

Затем при загрузке мозаики миниатюр изображений (или других разнородных изображений) программа просто сопоставляет каждый исходный индексированный цветной пиксель с его наиболее приближенным в палитре мастера (после сброса этого в регистры аппаратного цвета) и записывает результат в видео буфера. Вот образец простой мозаики из четырех эскизов изображений, используя палитру мастера из 240 цветов RGB и 16 дополнительных промежуточных оттенков серого; все изображения объединены без существенной потери цветовой точности:

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

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

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

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

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

Некоторые ранние компьютеры, такие как Commodore 64, MSX и Amiga, поддерживают спрайты и / или полноэкранное видеоизображение с помощью аппаратного обеспечения. В этих случаях номер записи прозрачной палитры определяется аппаратным обеспечением, и оно было числом 0.

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

При работе с изображениями truecolor на некоторых устройствах для микширования видеоизображений можно использовать триплет RGB (0,0,0) (без красного, без зеленого, без синего: самый темный оттенок черного, иногда называемый суперчерком в этом контексте) в качестве прозрачного цвета , Во время разработки он заменяется так называемым волшебным розовым. Точно так же типичное программное обеспечение для настольных издательских систем может принимать чисто белый, триглет RGB (255,255,255) из фотографий и иллюстраций, которые должны быть исключены, чтобы абзацы текста вторглись в ограничивающий прямоугольник изображения для нерегулярного размещения текста вокруг предметов изображения.

2-D программы рисования, такие как Microsoft Paint и Deluxe Paint, могут использовать назначенный цвет фона в качестве прозрачного цвета при выполнении операций вырезания, копирования и вставки.

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

Программные палитры

Майкрософт Виндоус
Приложения Microsoft Windows управляют палитрой 4-битных или 8-битных индексированных устройств отображения цвета с помощью специализированных функций Win32 API (для режимов отображения Highcolor и Truecolor, таких функций не хватает интересных функций). Эти API-интерфейсы имеют дело с так называемой системной палитрой и множеством логических палитр.

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

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

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

Конечный результат зависит от того, сколько приложений работает с цветами экрана. Окно переднего плана всегда предпочтительнее, поэтому окна на фоне могут вести себя по-разному: от повреждения, чтобы быстро перерисовать себя. Когда системная палитра изменяется, система запускает определенное событие для информирования каждого приложения. При получении окно может быстро перерисоваться, используя одну функцию Win32 API. Но это должно быть явно указано в программном коде; следовательно, тот факт, что многим программам не удается управлять этим событием, и их окна становятся коррумпированными в этой ситуации.

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

Безопасные цвета для Веб. Таблица из 216 цветов, рекомендуемых для экранного дизайна — ColorScheme.Ru

ColorScheme

· Инструмент для подбора цветов и генерации цветовых схем ·

Цветовой Круг Онлайн ⇒

Карта СайтаНазвания ЦветовЦвета АвтомобилейИмена цветов в HTMLКонвертер Цветов

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

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

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

Безопасные цвета были выведены математически, а не потому, что они кому-то больше пришлись по душе. Для получения безопасного цвета из Красного, Зелёного и Синего, нужно использовать только данные десятичные значения: 0, 51, 102, 153, 204, 255 — и никакие другие. Каждое из трёх шестнадцатеричных значений не должно отличаться от 00, 33, 66, 99, CC, FF.

Палитра состоит из 216 безопасных веб-цветов. Под каждым цветом указаны два значения — RGB, для создания цвета в графическом редакторе, и его шестнадцатеричных HEX-код, для обозначения цвета в HTML.

• 255 255 204#FFFFCC
• 255 255 153#FFFF99
• 255 255 102#FFFF66
• 255 255 51#FFFF33
• 255 255 0#FFFF00
• 204 204 0#CCCC00
• 255 204 102#FFCC66
• 255 204 0#FFCC00
• 255 204 51#FFCC33
• 204 153 0#CC9900
• 204 153 51#CC9933
• 153 102 0#996600
• 255 153 0#FF9900
• 255 153 51#FF9933
• 204 153 102#CC9966
• 204 102 0#CC6600
• 153 102 51#996633
• 102 51 0#663300
• 255 204 153#FFCC99
• 255 153 102#FF9966
• 255 102 0#FF6600
• 204 102 51#CC6633
• 153 51 0#993300
• 102 0 0#660000
• 255 102 51#FF6633
• 204 51 0#CC3300
• 255 51 0#FF3300
• 255 0 0#FF0000
• 204 0 0#CC0000
• 153 0 0#990000
• 255 204 204#FFCCCC
• 255 153 153#FF9999
• 255 102 102#FF6666
• 255 51 51#FF3333
• 255 0 51#FF0033
• 204 0 51#CC0033
• 204 153 153#CC9999
• 204 102 102#CC6666
• 204 51 51#CC3333
• 153 51 51#993333
• 153 0 51#990033
• 51 0 0#330000
• 255 102 153#FF6699
• 255 51 102#FF3366
• 255 0 102#FF0066
• 204 51 102#CC3366
• 153 102 102#996666
• 102 51 51#663333
• 255 153 204#FF99CC
• 255 51 153#FF3399
• 255 0 153#FF0099
• 204 0 102#CC0066
• 153 51 102#993366
• 102 0 51#660033
• 255 102 204#FF66CC
• 255 0 204#FF00CC
• 255 51 204#FF33CC
• 204 102 153#CC6699
• 204 0 153#CC0099
• 153 0 102#990066
• 255 204 255#FFCCFF
• 255 153 255#FF99FF
• 255 102 255#FF66FF
• 255 51 255#FF33FF
• 255 0 255#FF00FF
• 204 51 153#CC3399
• 204 153 204#CC99CC
• 204 102 204#CC66CC
• 204 0 204#CC00CC
• 204 51 204#CC33CC
• 153 0 153#990099
• 153 51 153#993399
• 204 102 255#CC66FF
• 204 51 255#CC33FF
• 204 0 255#CC00FF
• 153 0 204#9900CC
• 153 102 153#996699
• 102 0 102#660066
• 204 153 255#CC99FF
• 153 51 204#9933CC
• 153 51 255#9933FF
• 153 0 255#9900FF
• 102 0 153#660099
• 102 51 102#663366
• 153 102 204#9966CC
• 153 102 255#9966FF
• 102 0 204#6600CC
• 102 51 204#6633CC
• 102 51 153#663399
• 51 0 51#330033
• 204 204 255#CCCCFF
• 153 153 255#9999FF
• 102 51 255#6633FF
• 102 0 255#6600FF
• 51 0 153#330099
• 51 0 102#330066
• 153 153 204#9999CC
• 102 102 255#6666FF
• 102 102 204#6666CC
• 102 102 153#666699
• 51 51 153#333399
• 51 51 102#333366
• 51 51 255#3333FF
• 51 0 255#3300FF
• 51 0 204#3300CC
• 51 51 204#3333CC
• 0 0 153#000099
• 0 0 102#000066
• 102 153 255#6699FF
• 51 102 255#3366FF
• 0 0 255#0000FF
• 0 0 204#0000CC
• 0 51 204#0033CC
• 0 0 51#000033
• 0 102 255#0066FF
• 0 102 204#0066CC
• 51 102 204#3366CC
• 0 51 255#0033FF
• 0 51 153#003399
• 0 51 102#003366
• 153 204 255#99CCFF
• 51 153 255#3399FF
• 0 153 255#0099FF
• 102 153 204#6699CC
• 51 102 153#336699
• 0 102 153#006699
• 102 204 255#66CCFF
• 51 204 255#33CCFF
• 0 204 255#00CCFF
• 51 153 204#3399CC
• 0 153 204#0099CC
• 0 51 51#003333
• 153 204 204#99CCCC
• 102 204 204#66CCCC
• 51 153 153#339999
• 102 153 153#669999
• 0 102 102#006666
• 51 102 102#336666
• 204 255 255#CCFFFF
• 153 255 255#99FFFF
• 102 255 255#66FFFF
• 51 255 255#33FFFF
• 0 255 255#00FFFF
• 0 204 204#00CCCC
• 153 255 204#99FFCC
• 102 255 204#66FFCC
• 51 255 204#33FFCC
• 0 255 204#00FFCC
• 51 204 204#33CCCC
• 0 153 153#009999
• 102 204 153#66CC99
• 51 204 153#33CC99
• 0 204 153#00CC99
• 51 153 102#339966
• 0 153 102#009966
• 0 102 51#006633
• 102 255 153#66FF99
• 51 255 153#33FF99
• 0 255 153#00FF99
• 51 204 102#33CC66
• 0 204 102#00CC66
• 0 153 51#009933
• 153 255 153#99FF99
• 102 255 102#66FF66
• 51 255 102#33FF66
• 0 255 102#00FF66
• 51 153 51#339933
• 0 102 0#006600
• 204 255 204#CCFFCC
• 153 204 153#99CC99
• 102 204 102#66CC66
• 102 153 102#669966
• 51 102 51#336633
• 0 51 0#003300
• 51 255 51#33FF33
• 0 255 51#00FF33
• 0 255 0#00FF00
• 0 204 0#00CC00
• 51 204 51#33CC33
• 0 204 51#00CC33
• 102 255 0#66FF00
• 102 255 51#66FF33
• 51 255 0#33FF00
• 51 204 0#33CC00
• 51 153 0#339900
• 0 153 0#009900
• 204 255 153#CCFF99
• 153 255 102#99FF66
• 102 204 0#66CC00
• 102 204 51#66CC33
• 102 153 51#669933
• 51 102 0#336600
• 153 255 0#99FF00
• 153 255 51#99FF33
• 153 204 102#99CC66
• 153 204 0#99CC00
• 153 204 51#99CC33
• 102 153 0#669900
• 204 255 102#CCFF66
• 204 255 0#CCFF00
• 204 255 51#CCFF33
• 204 204 153#CCCC99
• 102 102 51#666633
• 51 51 0#333300
• 204 204 102#CCCC66
• 204 204 51#CCCC33
• 153 153 102#999966
• 153 153 51#999933
• 153 153 0#999900
• 102 102 0#666600
• 255 255 255#FFFFFF
• 204 204 204#CCCCCC
• 153 153 153#999999
• 102 102 102#666666
• 51 51 51#333333
• 0 0 0#000000

Что такое фирменные цвета и как использовать фирменные цвета »Mark Brand Boutique

Mark Brand Boutique

Mark Brand Boutique

Меню

Бесплатные ресурсы для фотографов и креативщиков

Бесплатные загрузки

ProPhoto Website Designer для фотографов и видеооператоров цвета и как вы используете их, чтобы усилить индивидуальность вашего бренда? В этом посте мы рассмотрим, что такое фирменные цвета и как лучше всего их использовать в малом бизнесе.

Что такое фирменные цвета

«Фирменные цвета» являются ключевым компонентом визуальной идентификации бренда. Обычно существует 3-8 обозначенных цветов, которые создают цветовую палитру, дополняющую индивидуальность и стиль бренда.

Существует два разных типа фирменных цветов: основные фирменные цвета и вторичные фирменные цвета.

Основные фирменные цвета

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

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

Скорее всего, вы думали о красном. Красный является основным цветом бренда компании Coca-Cola и постоянно и часто используется во всех маркетинговых кампаниях.

Вторичные фирменные цвета

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

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

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

Сколько фирменных цветов мне нужно для моего бизнеса?

Как правило, у вас может быть до двух 3 «основных» фирменных цветов и «4-5 вторичных» цветов.

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

Насколько важны цвета моего бренда?

Ценность и важность цвета вашего бренда зависит от вашей отрасли и конкретных целей.

Цвета бренда очень важны, если вы используете стратегию «идентификатора».

Некоторые предприятия используют цвет в качестве «идентификатора», что делает цвета их бренда очень важными. «Идентификатор» цвета бренда — это когда цвет бренда становится единым с брендом, и было бы трудно отделить цвет от бренда.

Примерами этого могут быть Target и красный, Walmart и синий, T-Mobile и ярко-розовый, Starbucks и зеленый. Каждая из этих компаний предпочитает использовать цвет в качестве «идентификатора» для повышения узнаваемости своего бренда. Эта стратегия успешна для этих компаний и помогает завоевать прочное признание.

Фирменные цвета менее важны, если тенденции в вашей отрасли часто меняются.

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

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

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

Как часто я должен менять цвета своего бренда?

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

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

Рекомендации по использованию фирменных цветов

При управлении фирменными цветами следуйте этим рекомендациям, чтобы создать сильный и последовательный образ бренда:

• Выберите до 3 основных цветов бренда
• Выберите до 5 дополнительных цветов бренда
• Выберите цвета, которые соответствуют индивидуальности и стилю вашего бизнеса
• Выберите цвета, которые обеспечат гибкость и долговечность бизнес
• Не меняйте часто цвета

Популярные посты в блоге бренда

Бесплатные загрузки и ресурсы

 

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

/ markbrandboutique

/ markbrandboutique

/ markbrandboutique

Наверх ↑

ProPhoto Website Designer для фотографов и видеооператоров

Mark Brand Boutique

Mark Brand Boutique

Mark Brand Boutique

Мировой.

безопасные платежи по:

красный, белый и синий. Семь правил о цветовых палитрах, которые… | Ник Бабич

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

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

Применение цвета в дизайн-проекте во многом связано с балансом. Чем больше цветов вы используете, тем сложнее достичь баланса. Вы добьетесь лучших результатов, если будете придерживаться максимум 3 основных цвета в вашей цветовой схеме. Согласно исследованию Университета Торонто о том, как люди использовали Adobe Color CC, большинство людей сказали, что предпочитают простые цветовые комбинации, основанные только на двух или трех цветах.

Если вам нужны дополнительные цвета помимо тех, которые вы определили в своей палитре, используйте оттенки и оттенки.

Как создать схему

Так как же выбрать эти два или три цвета? Цветовой круг может помочь.

12-цветный круг — важный инструмент для создания цветовых схем

Существует ряд предустановленных стандартов цветовых схем, упрощающих создание новых схем, особенно для начинающих:

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

Монохроматическая схема очень приятна для глаз (особенно синие или зеленые оттенки). Как вы можете видеть в этом примере с Facebook, схема выглядит чистой и элегантной.

• Аналог . Аналогичные цветовые схемы создаются из родственных цветов; один цвет используется в качестве доминирующего цвета, в то время как другие используются для обогащения схемы. Хотя это относительно легко осуществить, хитрость заключается в том, чтобы определить яркость цветов, которые вы используете, так как вся схема будет преувеличена. Например, приложение Clear, управляемое жестами, использует яркие аналогичные цвета для визуального определения приоритетов вашего текущего набора задач. В то время как Calm, приложение для медитации, использует аналогичные цвета синий и зеленый, чтобы помочь пользователям чувствовать себя расслабленными и умиротворенными.

Аналогичные схемы создаются с использованием трех цветов, расположенных рядом друг с другом на цветовом круге с 12 спицами. Clear, управляемое жестами приложение для ведения дел, использует яркие и энергичные аналогичные цвета, чтобы визуально расставить приоритеты в текущем наборе задач. Calm использует аналогичные цвета для создания общего настроения.

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

Использование дополнительных цветов — самый простой способ выделить что-то.

• Пользовательский. Создать собственную цветовую схему не так сложно, как многие думают. Есть простой трюк, который вы можете использовать для создания отличной цветовой палитры: просто добавьте яркий акцентный цвет в нейтральную палитру (например, традиционную монохромную схему). Недавно созданная схема будет очень яркой визуально.

Добавление одного цвета к дизайну в оттенках серого просто и эффектно привлекает внимание. Макет с сочетанием белого и серого с акцентами синего цвета в цветовой гамме Dropbox.

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

Самые лучшие цветовые сочетания исходят от природы. Вы можете создать цветовую схему из кадра.

60–30–10 — это простое правило, которое поможет вам создать хорошо сбалансированные цветовые палитры. Идея состоит в том, что один цвет (обычно нейтральный) составляет 60 процентов палитры. Другой дополнительный цвет составляет 30 процентов палитры. Третий цвет, используемый в качестве акцента, занимает оставшиеся 10 процентов. Эта формула работает, потому что создает ощущение равновесия.

60% — ваш доминирующий оттенок, 30% — дополнительный цвет и 10% — акцентный цвет. Эта техника позволяет глазу комфортно перемещаться от одной фокусной точки к другой.

В реальной жизни чисто черного почти не бывает. От всех «черных» объектов вокруг нас отражается некоторое количество света, что означает, что они не совсем черные, они темно-серые. Дороги не черные. Тени не черные.

Цвет этого волка темно-серый, а не черный.

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

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

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

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

«Цвет создает, усиливает, изменяет, раскрывает и задает настроение картины». — Кифф Холланд

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

Красный, Оранжевый, Желтый

• Красный (Страстный, Могущественный, Опасный, Важный): Красный — чрезвычайно стимулирующий цвет. Создается впечатление скорости и силы. Он известен как цвет энергии. Он доказал физиологические эффекты увеличения кровообращения и повышения метаболизма. Вот почему, когда люди видят красный цвет, они читают сильнее и быстрее. Использование красного цвета — это способ привлечь внимание пользователей или выделить отдельный элемент, требующий внимания.
• Оранжевый (Игривый, Энергичный, Привлекательный, Дешевый): Оранжевый — теплый и яркий цвет. Он обладает энергичной аурой и способен создать у ваших пользователей ощущение теплого гостеприимства. Некоторые исследователи считают, что оранжевый означает дешевизну.
• Желтый (Веселый, Дружелюбный, Стимулирующий, Привлекающий внимание): Желтый — чрезвычайно универсальный цвет, в зависимости от того, какой оттенок вы выберете. Светло-желтый ассоциируется с солнцем и, следовательно, передает позитив и теплоту. Темные оттенки желтого (как золото) создают впечатление старины и возраста. Эти более темные оттенки часто связаны с безвременьем и мудростью.

Зеленый, Синий, Фиолетовый

• Зеленый (Натуральный, Безопасный, Свежий): Зеленый отражает чувство защиты окружающей среды и близость к природе. Это также означает рост, и поэтому его часто связывают с бизнесом. Зеленый означает чувство правильного или неправильного.
• Синий (Спокойный, Ответственный, Заслуживающий доверия, Надежный): Синий цвет часто ассоциируется со спокойными и расслабляющими эмоциями. Он также ассоциируется с силой и надежностью, вызывая чувство доверия и профессионализма. Синий излучает чувство внутренней безопасности. Вот почему вы можете увидеть банки и технологические компании, использующие этот цвет. Гиганты социальных сетей, такие как Facebook, Twitter и LinkedIn, используют синий цвет в своих сетях.
• Фиолетовый (Роскошный, Таинственный, Романтичный, Духовный): исторически связанный с королевской властью, фиолетовый намекает на то, что продукт относится к категории элитных.

Розовый, Черный, Белый, Серый

• Розовый (Женственность, Невинность, Молодость): Розовый наиболее известен своими ассоциациями с женственностью.
• Черный (Мощный, Утонченный, Таинственный, Дерзкий): Черный привлекает внимание быстрее, чем другие цвета, включая красный. Вот почему он чаще всего используется только для текста и акцентов.
• Белый (Чистота, Здоровье, Чистота, Невинность): Белый акцентирует другие цвета вокруг себя, что делает его популярным выбором в качестве вторичного цвета.
• Серый (Нейтральный, Формальный, Утонченный, Стерильный): Серый олицетворяет нейтралитет, он может принимать характеристики черного или белого. При использовании в качестве основного цвета он создает впечатление официальности.

Важно отметить, что значение цветов может варьироваться в зависимости от культуры и обстоятельств. Чтобы узнать больше об этом, ознакомьтесь со статьей «Символика цветов и значения цветов во всем мире».

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

Избегайте использования только цвета в качестве индикатора

Приблизительно 8% мужчин и 0,5% женщин страдают той или иной формой дальтонизма. Это 1 из 12 мужчин и 1 из 200 женщин. Хотя существует несколько форм этого состояния, наиболее распространена слепота на красный и зеленый цвета. Человек, страдающий этой формой дальтонизма, как правило, не может видеть вариации красного и зеленого цветов.

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

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

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

Избегайте низкой контрастности текста

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

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

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

• Мелкий текст должен иметь коэффициент контрастности не менее 4,5:1 относительно фона.
• Крупный текст (14 pt жирный/18 pt обычный и выше) должен иметь коэффициент контрастности не менее 3:1 по отношению к фону.

Хорошая новость, вам не нужно проверять это вручную. Используя инструмент Color Contrast Checker, вы можете проверить свои цветовые сочетания всего за несколько кликов.

Webaim Проверка цветового контраста

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

Adobe Color CC (ранее известный как Kuler) — отличный инструмент для поиска, изменения и создания цветовых схем. Каждый цвет в палитре можно индивидуально изменить или выбрать в качестве основного цвета несколькими простыми щелчками мыши. Палитры можно сохранять и добавлять в библиотеку, а на сайте доступно несколько отличных цветовых схем, созданных сообществом:

Adobe Color CC — отличный инструмент, который может ускорить изучение различных вариантов цветовых схем.

Если вы хотите провести визуальное исследование использования определенного цвета другими дизайнерами, перейдите на страницу dribbble. com/colors и выберите нужный цвет.

Вы также можете указать минимальный процент снимка, содержащего цвет (например, снимок на 30% состоит из синего). Укажите минимальный процент кадра, содержащего цвет.

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

ColorZilla — это расширение, доступное для Google Chrome и Mozilla Firefox, которое включает в себя множество инструментов, связанных с цветом, включая палитру цветов, пипетку, генератор градиентов CSS и браузер палитр.

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

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

Coolors дает вам возможность загрузить изображение и создать из него цветовую палитру.

Моделирование цветовой слепоты в Adobe Photoshop

С помощью Photoshop вы можете проверить доступность своего дизайна. Просто перейдите к View > Proof Setup , а затем вы можете выбрать один из двух типов (тип Protanopia или тип Deuteranopia).

Чтобы предотвратить проблемы с доступностью в дизайне, рекомендуется испытать на себе дальтонизм во время проектирования. NoCoffee Vision Simulator можно использовать для имитации нарушений цветового зрения и условий слабого зрения на любом пейджере. Например, используя параметр «Дефицит цвета» «Deuteranopia», вы можете просматривать веб-страницы в оттенках серого. Это поможет вам сделать ваш дизайн доступным для пользователей с нарушениями зрения.

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

Вам нравятся цветовые схемы? Увлекаетесь ли вы юзабилити-тестированием и пользовательскими исследованиями? Зарегистрируйтесь в программе Springboard Введение в UX-дизайн курс. Тысячи студентов использовали его, чтобы начать успешную карьеру дизайнера.

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

Логотипы, веб-сайты и многое другое…

Логотипы, веб-сайты, обложки книг и многое другое…

Получить дизайн

Чейз. Ситибанк. Баркли. Банк Америки. Все банки. Все используют синий цвет в качестве одного из доминирующих цветов брендинга. Даже другие финансовые учреждения, такие как Prudential и Merrill Lynch, используют синий цвет. Очевидно, что это больше, чем совпадение, что все эти компании, связанные с деньгами, выбрали синий цвет для своего фирменного стиля. Так что же они все знают, чего не знаете вы?

Согласно этой статье Indian Express, потребители считают бренды, использующие синий цвет, более экологичными, чем другие цвета, даже зеленый. Наши статьи отвечают на вопрос: почему?

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

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

Почему цвета брендинга имеют значение

— «Цвета, как и особенности, следуют за изменениями эмоций». -Пабло Пикассо

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

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

Один из самых известных теоретиков цвета, Фабер Биррен, много писал о связи между цветами и нашим эмоциональным состоянием, в частности, в своей книге Психология цвета и теория цвета . Точно так же, как слова «любовь» и «велосипедная стойка» вызывают разные эмоции, цвета, такие как красный и синий, также вызывают разные реакции человека. Еще более интересно то, что одни и те же цвета обычно вызывают сходные реакции у разных людей; другими словами, желтый цвет вызывает схожие чувства у людей от Монтаны до Тимбукту. Это распространяется даже на оттенки отдельных цветов, поэтому глубокий темно-синий и светло-голубой также будут иметь разные эффекты.

Теория цвета неразрывно связана с историей человечества, как вы можете видеть на странице рукописи 1826 года Чарльза Хейтера.

Теория цвета идет намного глубже, чем «розовый — красивый цвет». Психологи связывают это с самой эволюцией человека; связи с определенными цветами развились после многих лет ассоциации их с определенными объектами. Например, кроваво-красный цвет предупреждает людей об опасности поблизости; коричневые пятна грязи и гнилой пищи, как правило, неаппетитны.

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

Американцы усердно работают над своим зеленым, а европейцы усердно работают над своим синим?

И давайте не будем забывать о культурных ассоциациях. Ярким примером является то, как американцы ассоциируют зеленый цвет с деньгами, потому что валюта, которую мы используем каждый день, имеет зеленый цвет. Люди из других стран не обязательно поймут фразу «тратить зелень»; однако компания, «идущая на зеленый свет», найдет отклик почти у всех.

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

Нанесение фирменных цветов

—

Только что отправили вам первый урок.

По словам нейробиолога Антонио Дамасио, то, что потребители думают о бренде, имеет большее значение, чем то, что они

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

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

Просто для организации вот наиболее распространенные области, в которых вы будете использовать цвета вашего бренда:

• логотип
• сайт
• витрина
• дизайн для магазина
• униформа персонала
• объявлений

Best Buy выбирает умную цветовую схему доминирующего синего и пассивного желтого, дополняющую пару, как мы объясним ниже. Синие ковры, синие стены, синие рубашки у сотрудников — один взгляд на эту картинку, и ты понимаешь, что ты не в RadioShack.

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

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

Как определить индивидуальность вашего бренда

—

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

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

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

Что означают разные цвета маркировки?

—

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

• Красный — Красный означает страсть, волнение и гнев. Это может означать важность и привлекать внимание.
• Оранжевый — Оранжевый означает игривость, жизнерадостность и дружелюбие. Он бодрит и заряжает энергией.
• Желтый — Желтый пробуждает радость, молодость и оптимизм, но также может показаться привлекательным или доступным.
• Зеленый — Зеленый символизирует стабильность, процветание, рост и связь с природой.
• Светло-голубой — Светлый оттенок синего излучает спокойствие, доверие, открытость. Это также может означать невиновность.
• Темно-синий — Темно-синий символизирует профессионализм, безопасность и формальность. Он взрослый и надежный.
• Фиолетовый — Фиолетовый может означать королевскую власть, творчество и роскошь.
• Розовый — Розовый символизирует женственность, молодость и невинность. Он варьируется от современного до роскошного.
• Коричневый — Коричневый создает суровый, землистый, старомодный вид или настроение.
• Белый — Белый ассоциируется с чистотой, добродетелью, здоровьем или простотой. Он может варьироваться от доступного до элитного.
• Серый — Серый означает нейтральность. Он может выглядеть приглушенным, классическим, серьезным, загадочным или зрелым.
• Черный — Черный вызывает ощущение силы, утонченности, остроты, роскоши и современности.

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

Когда дело доходит до передачи кому-то всех ваших денег, доверие имеет первостепенное значение. Вот почему на веб-сайте Chase Bank и других финансовых учреждений так много синего.

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

Формула построения фирменной цветовой схемы

—

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

1. Планируйте выбор 3-х цветов

Базовый, акцентный и нейтральный. Цветовые схемы бренда могут содержать от 1 до 4 цветов в зависимости от типа (см. ниже), но даже монохромные схемы потребуют некоторых вариаций оттенков для разных целей.

2. Выберите базу

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

3. Выберите акцент

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

4. Выбор нейтрального цвета

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

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

В процессе выбора фирменных цветов вы должны помнить о конечной цели: какую цветовую схему вы используете? Как правило, бренды используют одну из следующих распространенных цветовых схем:

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

• Монохроматический — Если у вас есть одна черта характера, на которой вы хотите сосредоточиться, монохромная схема подчеркнет значение этого фирменного цвета. Хотя это отлично подходит для минималистских брендов, здесь задача состоит в том, чтобы дифференцировать оттенки настолько, чтобы ваше зрение не становилось визуально чахлым.
• Аналог — Цвета рядом друг с другом на цветовом круге имеют гармоничные отношения, поскольку соседние цвета обычно имеют схожие эмоциональные коннотации. Аналогичные схемы — беспроигрышный вариант, но они не подходят для того, чтобы выделиться или привлечь внимание.
• Дополняющий — Цветовые дополнения — или противоположности — это цвета, расположенные непосредственно друг напротив друга на цветовом круге. Поскольку они противоположности, в паре они раскрывают лучшее друг в друге; Вы часто видите дополнительные цвета в спортивных командах. Дополнительные цвета отлично подходят для динамичных, стимулирующих визуальных эффектов, но будьте осторожны, чтобы не копировать другой бренд, поскольку они очень популярны.
• Triadic — Стабильная фирменная цветовая схема, триадные цвета рисуются равными частями для трех разных участков цветового круга. Триадные схемы стабильны, как и аналогичные темы, но предлагают более стимулирующее разнообразие, как и дополнительные схемы. Самое сложное — заставить три цвета совпадать с чертами вашего бренда.

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

by BATHI

Знайте, когда следует раскрашивать за пределами линий

—

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