Лого vc.ru

Цвет в игровом дизайне: Тренды, примеры использования и основные технологии

Цвет в игровом дизайне: Тренды, примеры использования и основные технологии

Сооснователь игрового ресурса Gamelogic Герман Туллекен рассказал изданию Gamasutra о том, как геймдизайнеры и разработчики используют цвет при проектировании игр.

Редакция рубрики «Рынок игр» публикует перевод заметки.

Поделиться

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

  • художники создают настроение;
  • разработчики улучшают свои игры;
  • а маркетологи продвигают товары и услуги.

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

Функция цвета в играх

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

Эмоции

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

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

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

Брендинг и мода

Цвет играет важную роль в брендировании игр, делает их узнаваемыми. Вспомните голубой и оранжевый цвета в Portal, ярко-красный в Mirror's Edge, сочный мясной цвет в Super Meat Boy, пурпурно-синий в Super Mario Bros, ярко-розовый в Hotline Miami.

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

Цвета в казуальных играх
Цвета в шутерах от первого лица

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

Можно заметить, что в 2012 году стали доминировать голубые и коричнево-оранжевые оттенки. Алый цвет несколько потускнел и уступил место приглушённым и «атмосферным» оттенкам, сделав игры более монохромными. Во многих современных играх специально применяется некоторое обесцвечивание и тонирование, так они выглядят реалистичнее.

Визуальная иерархия

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

Выделять важные элементы можно с помощью цветового значения (value), насыщенности (saturation) и оттенка (hue).

Фокусировка с помощью значения
Фокусировка за счёт насыщенности
Фокусировка с помощью оттенков

Прочитайте это руководство для разработчиков по визуальной иерархии.

Движение

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

В Geometry Dash фон меняется в радужном порядке и помогает разделять уровни игры (эта идея подробнее обсуждается ниже).

Механика

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

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

Hue — игра, в которой игрок должен перемещать разноцветные объекты, чтобы они исчезали.

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

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

В игре Blendoku вам нужно расставлять цветные квадратики в градиентном порядке, выстраивая их наподобие кроссворда. В игре Huedoku та же идея реализована на квадратной сетке. Эти игры похожи на Online Color Challenge, которая тренирует вашу способность собирать в градиентном порядке цветные элементы. Игра Brandseen задействует цветовую память: игроки вспоминают цвета популярных брендов и получают за это баллы.

Обозначения и идентификаторы

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

Идентификаторы

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

Цветовой глиф должен заметно отличаться от других идентификаторов и от нейтральных цветов игровой сцены. Идентификаторы обычно используются в играх-противоборствах, таких как Kill Zone, и в территориальных баталиях, например, в Rise of Nations.

Kill Zone
Rise of Nations

Обозначения

Цветом можно обозначать свойства элементов (такие, как пункты или части террейнов). Цвет подсказывает игроку, можно ли взаимодействовать с этим пунктом или областью и каким образом это нужно делать.

Например, в беговом режиме Mirrors Edge объекты, которые могут помочь вашему прогрессу, выделены красным цветом.

Mirrors Edge

В игре Witness, которая скоро выйдет, цветовое решение некоторых сцен будет зависеть от их значимости.

В игре Portal 2 голубые порталы предназначены для объектов, которые нужно вытолкнуть наружу, а оранжевые — для тех, которые нужно втянуть внутрь.

Portal 2

В Pirates of the Caribbean Online (и во многих других играх) цвет используется для категоризации разных ингредиентов зелья.

Pirates of the Caribbean Online

Вариации контента

Цветовые вариации — самый дешёвый способ масштабирования игрового контента.

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

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

Tiny Wings
Blowfish Rescue

Мы создали для этого плагин Unity — Colors:

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

Технология

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

Galaxian (1978 год) стала первой игрой с RGB-цветосинтезом. До этого цвета в видеоиграх производились с помощью целлофановых листов и картонных фонов.

Замечание: Кажется, мы ошиблись с первой цветной игрой. Перед этим было ещё несколько цветных игр. Эти сведения могут оказаться неточными, но ими могли быть Wimbledon (1974 год) и Color Gotcha (1973 год). Galaxian могла оказаться первой игрой, в которой использовались многоцветные спрайты. Кейт Смит в своей статье рассматривает некоторые игры, в которых раньше других начали использовать цвет (Николас Ралабат поделился в комментариях этой ссылкой, за что ему большое спасибо).

Galaxian

К немногочисленным ранним устройствам, которые отображали больше 256 цветов, относились PC Engine (1987 год) с 482 одновременно отображаемых цветов (из 512 возможных) и Neo Geo (1990 год) с 4096 одновременно отображаемых цветов (из 6553) возможных. В 1994 году Play Station установила новый стандарт — 16,7 млн цветовых оттенков.

На сайте ColourLovers есть отличная инфографика с историей цвета в видеоиграх, отрывок из неё приведён ниже.

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

С развитием технологий цветовая палитра устройств постепенно расширялась, и игры стали отображать всё больше цветов. Невозможно воспроизвести всё видимое цветовое пространство, но реальные устройства всё больше к этому приближаются. Некоторые проекторы (например, Brilliant Color) расширяют палитру за счёт использования большего количества первичных цветов. Самую широкую палитру из всех существующих — около 90% всех видимых цветов — воспроизводит лазерный видеопроектор (это связано с тем фактом, что лазеры производят действительно монохроматические основные цвета).

Старые способы увеличить число цветов

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

Кроме того, смена палитры осуществлялась в разных сценах видеоигр. До того, как появились 32-битовые полноцветные игры и 3D-рендеринг, смена цветов использовалась для анимации воды, огня и других природных эффектов (как в S.P.Y. Special Project Y). На единственном плоском изображении производилась циклическая смена 256 цветовых оттенков, а визуальные эффекты (анимация) достигались переключением между цветами палитры — так создавалась иллюзия движения пикселей.

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

Биология цвета

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

Наглядным примером биологического воздействия цвета является то, как мы видим красный цвет. Красный свет фокусируется за сетчаткой глаза, делая хрусталик более выпуклым, чтобы приблизить изображение. Именно поэтому красный цвет привлекает внимание (это явление используется в таких играх, как Mirror's Edge), а предметы, окрашенные в тёплые цвета, кажутся нам ближе, чем те, что окрашены в холодные цвета.

Цветовая слепота в играх

Цветовая слепота, или дальтонизм — это отсутствие или снижение способности видеть цвет или различать цвета при нормальном освещении.

Цветовая слепота поражает примерно каждого двадцатого мужчину и 1 из 200 женщин. Самый распространённый вид этого заболевания — красно-зелёный дальтонизм, при котором человек не может различать красные и зелёные оттенки. Ниже показаны цвета, которые видит человек с нормальным зрением (слева) и цвета, которые воспринимает человек с красно-зелёным дальтонизмом.

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

Кроме того, в шутерах от первого лица вместо красных и зелёных индикаторов для обозначения противоборствующих команд используются альтернативные цвета: голубой и оранжевый. Такое решение было применено в Call of Duty: Black Ops. Компания Treyarch пошла ещё дальше, разработав специальный тестер на цветовую слепоту.

В этой статье описано, как следует играть в игру, если вы дальтоник.

Невозможные цвета

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

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

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

Diatomic Number
Популярные статьи
Показать еще
Комментарии отсортированы
как обычно по времени по популярности

Офигеть, очень крутой разбор. Автор – милашка.

>В игре Portal 2 голубые порталы предназначены для объектов, которые нужно вытолкнуть наружу, а оранжевые — для тех, которые нужно втянуть внутрь.
Автор хотя бы раз играл в Portal или Portal 2?

Ой. Мы уже в прошлом месяце эту статью перевели. Полезная.

0

Интесно, почему ничего не сказано про Fallout, в котором цветофильтр создаёт 50% атмосферы.

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

Сейчас обсуждают
Дмитрий Лимонов

потому что ресторан не означает "дорого, бохато", как привыкли в РФ. Это всего лишь пункт общественного питания. Да, есть элитные рестораны, а есть в формате закусочных. Мир не кончается там, где ваши представления о нём не совпадают с реальностью.

«Будьте нашим гостем»: кому McDonald's даёт право бесплатно есть в своих ресторанах
0
Владимир Тихомиров

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

Бывший глава Google затруднился ответить на один из традиционных вопросов компании на собеседованиях
0
Александр Васильев

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

«Никому не выгодно, чтобы у вас скапливались деньги»
0
Artem Zinnatullin
Juno

Не собираюсь оправдывать ролик сбера, но если вы про вот это видео с футболистом youtu.be/VGEfNcvntno, то оно ничем не лучше, тк там блин оператор(ы) по полю бегают, сверху съемка ведется и рядом с полем люди явно не на телефон снимают. Всем участникам было понятно, что это какой-то прикол. Была бы скрытая съемка — без вопросов.

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

Видео: Герман Греф в «костюме инвалида» в отделении «Сбербанка»
0
Artem Zinnatullin
Juno

Я может не понимаю, но в чем большая разница между "в имитирующем инвалида костюме" и "под видом инвалида"?

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

Видео: Герман Греф в «костюме инвалида» в отделении «Сбербанка»
0
Показать еще