Как рисовать игровую 2D графику. 2 часть

Цветовая теория в играх

В этой части мы разберем значение цвета в играх и почему это так важно.

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

Как рисовать игровую 2D графику. 2 часть

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

HSB

Существуют несколько цветовых моделей. Мы начнем с HSB. Эта цветовая модель является наиболее простой для понимания. Она получила название по первым буквам английских слов: цветовой тон (hue), насыщенность (saturation), яркость (brightness). Легче всего эту модель можно изобразить в виде торта.

Как рисовать игровую 2D графику. 2 часть

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

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

  • Красный — 0°
  • Зелёный — 120°
  • Синий — 240°
  • Красный — 360° или 0°

Насыщенность

Возьмем за основу зеленый и синий цветовой тон. Насыщенность цветов 100%.

Как рисовать игровую 2D графику. 2 часть

Если мы будем двигать ползунок с насыщенностью, получим вот такие цвета.

Как рисовать игровую 2D графику. 2 часть

Таким образом, у цветов насыщенность стала меньше. Зеленый и синий “выцвел”. Получился цвет, в который добавили серого в том или ином количестве. Получается, что 0% насыщенности — это серый, а 100% это самый красочный цветовой тон.

Яркость

Яркость намного проще в понимании, она показывает, насколько цвет ярче. Ниже тот же синий цвет и его менее яркая версия.

Как рисовать игровую 2D графику. 2 часть

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

Как рисовать игровую 2D графику. 2 часть

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

Fall Guys
Fall Guys
Inside
Inside

RGB

Наравне с HSB вы также будете пользоваться RGB моделью, поэтому ее мы тоже включили в статью.

  • R (red) — красный;
  • G (green) — зеленый;
  • B (blue) — голубой.
Как рисовать игровую 2D графику. 2 часть

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

Цветовое колесо

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

Существуют основные, вторичные и третичные цвета. Всего в цветовом круге 12 цветов.

Как рисовать игровую 2D графику. 2 часть

Цвета лучше всего работают, когда они находятся в гармонии друг с другом. Ниже представлено 6 типов схем в традиционном цветовом колесе.

Монохроматические цвета

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

Firewatch
Firewatch

Аналоговые цвета

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

Как рисовать игровую 2D графику. 2 часть

Триада

Эта цветовая схема состоит из трех цветов. Цвета образуют равносторонний треугольник на колесе.

Monument Valley
Monument Valley

Комплементарные цвета

Наиболее контрастная цветовая схема. Цвета находятся напротив друг друга на колесе

No Man’s Sky
No Man’s Sky

Контрастная триада

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

Как рисовать игровую 2D графику. 2 часть

Тетрада

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

Как рисовать игровую 2D графику. 2 часть

Выводы:

  • Восприятие цвета очень субъективно;
  • Используйте цвет с умом;
  • Разучите базу, чтобы появилась полная свобода в творчестве;
  • Не бойтесь экспериментировать и старайтесь использовать более редкие цвета;
  • Цвета можно разделять и сравнивать друг с другом различными способами, а в различных комбинациях пары цветов могут выглядеть лучше или хуже.
44 показа
111111 открытие
2 комментария

Комментарий недоступен

Ответить

Очень рады :)

Ответить