Цвет — значительная часть любого проекта. Он напрямую влияет на наше восприятие компании. Поэтому дизайнер обязательно должен уметь работать с цветом. В рамках работы у тебя будут разные задачи. Подобрать цвета для интерфейса или целого бренда.
В дизайне интерфейсов и айдентики цвет играет значительную роль. Они напрямую зависят друг от друга. Когда мы работаем над айдентикой, то стараемся выделить нашу компанию среди других цветовых палитр. Цвет в интерфейсе должен отражать характер бренда и упрощать его восприятие для пользователя.
Цвет формирует наше настроение. Сравните два этих кадра одного и того же героя. В рамках вселенной DC супермен больше не классный парень в ярком трико, а сложный человек в мрачной костюме.
При это цвет может нас обманывать. Поверишь ли ты, что клетки «А» и «B» одного цвета? Это можно понять, если пипеткой проверить цвета в графическом редакторе. Но наш мозг отказывается в это верить, потому что мы точно знаем, что клетки на шахматной доске разного цвета.
Помните иллюзию с платьем? Одни говорили, что платье синее, а другие золотое. Это отличная демонстрация, насколько мы по-разному воспринимаем реальность.
Значения цветов и целостность
Как мы уже с тобой разобрались в модуле Анализ аудитории дизайн продукта зависит от его целевой аудитории. Поэтому цвет также зависит от наших пользователей.
У нас есть свои предубеждения по поводу цвета. Один больше подходит для корпоративных презентаций, другой — для постеров на вечеринке. Или есть служебные цвета. Вспомни какую палитру используют светофоры. Прочные ассоциации: красный — ошибки, желтый — внимание, зеленый — всё хорошо.
Тут не стоит забывать и про культурный контекст. Например, в восточных странах траурным цветом считается белой, когда у нас чёрный. Поэтому чувство цвета — очень субъективная вещь. С ним нужно быть аккуратно.
Посмотри, как выглядят сайты премиальных продуктов. Например, интерфейс швейцарского частного банка, который буквально торгует слитками золота. В дизайне — минимум деталей, черный цвет и немного акцентного желтого. Создаётся ощущение, что банк явно не для всех.
А теперь сравни этот дизайн с цветовой палитрой Сбера, который ориентирован на широкую аудиторию. Его клиенты — буквально вся Россия. Поэтому он должен быть нейтральным, но в то же время иметь узнаваемый цвет — зеленый.
Но если создать определенный контекст, то и Сбер можно увести в темную палитру. Так он делает для своих премиальных продуктов и подписки Сбер.Прайм. Почему так? Задача — показать всю уникальность данного продукта и выгоды от его использования. Ты должен почувствовать, что ты не такой как все.
Эти примеры достаточно простые. Создать «премиальность» легче всего. А как с помощью цвета создать ощущение надежность или инновационности? Уже сложнее. Что тут говорить, если иногда от дизайнера требуется сделать разноцветный гроб и придумать для этого целую концепцию.
Всё зависит от проекта. Поэтому не забывай про правило целостности. Понимание контекста придёт с опытом.
Колористика и цветовой круг
Базово все цвета в работе дизайнера можно разделить на три группы: основной, дополнительный и акцентный цвета. Схемы ниже помогут тебе лучше с этим разобраться. Познакомься, цветовой круг. Его создал швейцарский художник Иоханнес Иттен в прошлом веке. В основе цветового круга лежат 3 базовых цвета: синий, красный и жёлтый.
Это удобный инструмент для создания цветовых палитр. Чаще всего, в проекте не так много цветов. Например, мы используем около 2-3. Сейчас мы расскажем какие цветовые схемы существуют и как они помогут тебе выбрать палитру.
Монохромная схема
Предполагает выбор самого яркого оттенка из монохроматической шкалы. Это будет акцентирующий цвет.
Кадр из фильма «Бегущий по лезвию 2049»
Аналоговая схема
Включает в себя цвета, которые расположены рядом друг с другом на цветовом круге. Таким образом, взяв желто-оранжевую палитру, вы можете выбрать светло-желтый в качестве основного цвета, несколько желтых оттенков — в качестве дополнительного, а оранжевый — акцентирующим.
Такой приём использует MasterCard. Красный и оранжевый как раз находятся рядом друг с другом на цветовом круге.
Комплементарная схема
Она состоит из двух цветов, которые находятся напротив друг друга на цветовом круге. Эта комбинация очень эффективна для создания акцента.
Такую схему используется в своём логотипе VISA. Более того, контрастные цвета логотипа также построены на ассоциациях. Они транслируют надежность и лояльность бренда (синий), а также тепло и вовлеченность (желтый).
Сплит-комплементарная триада
Вариант дополнительного сочетания цветов, когда вместо противоположного цвета используются два соседних цвета. Эта схема выглядит так же контрастно, но не так интенсивно.
«Танец», Анри Матисс
Триадная схема
Триадическая схема состоит из трех цветов, равномерно расположенных на цветовом круге, поэтому их довольно трудно комбинировать. Среди них должен быть выбран доминирующий цвет.
При выборе акцентирующего цвета следует иметь в виду, что теплые тона кажутся тяжелее, чем прохладные, которые визуально исчезают на заднем плане. Красный считается самым тяжелым цветом, а самым легким — желтый.
Для того, чтобы лучше понять цвет, обязательно посмотри проект студии OBYS.
На этом по цвету всё. Большой блок по графическому дизайну закончили. Конечно, это только верхушка айсберга. Поэтому ниже — материал для более детального изучения. Идем дальше. В следующем модуле мы поговорим про Иллюстрации.