Разработка шейдерных эффектов для игры

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

1000 USD

сроки выполнения : 21 день

От чего зависит цена

  1. сроков выполнения

По вашему желанию,
цена будет снижена, если:

Дешевле до

90%

Заказать годовое сопровождение

Сопровождение - это утвердить годовой бюджет, закрепить за вами сотрудников

Экономия до

50%

Сократить объем работ
(меньше концептов)

Сэкономьте время наших маркетологов и дизайнеров на создание концептов

Экономия до

25%

Увеличить сроки выполнения

Если вам «не горит», мы готовы сделать хорошую скидку

Рассрочка на

6

месяцев

За это время ваш проект уже будет приносить первую прибыль
Получить индивидуальный расчет

Разработка шейдерных эффектов для игры

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

пример использования шейдеров в Minecraft

Minecraft с шейдерами освещения и симуляции воды

Как видеокарта обрабатывает шейдеры

Видеокарта — это комплекс вычислительных блоков. Каждый блок делает свою задачу:

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

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

The Witcher 3 шейдеры

The Witcher 3 с шейдерами и без

Грубо говоря, шейдеры — это аналог фильтров в Инстаграме.

История появления шейдеров

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

В видеокартах 90-х годов еще не было отдельных шейдерных блоков. Сами видеокарты умели выполнять ограниченные наборы команд. Из-за этого нестандартные алгоритмы приходилось выполнять на центральном процессоре. Благодаря этим эффектам некоторые старые игры выглядели лучше, когда графику рендерил CPU, а не дорогая видеокарта.

Например, в Quake 2 было два способа отображения воды:

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

вода в quake 2 без шейдеров и с шейдером

Шейдеры в Quake 2

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

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

система освещения в quake 1

Система освещения в Quake 1

Затем шейдеры стали использовать для создания динамического освещения и текстур, эффектов воды, тумана и огня, а также для травы. Производитель видеокарт NVidia придумал шейдер для симуляции поведения волос, который использовался в играх The Witcher 3 и Tomb Raider.

Какими бывают шейдеры

Есть такие основные виды шейдеров:

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

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

У видеокарты 2007 года 17 шейдерных процессоров, у современной RTX 2080 — 3072

У видеокарты 2007 года 17 шейдерных процессоров, у современной RTX 2080 — 3072

Что можно сделать с вершинными шейдерами

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

Самая популярная задача вершинных шейдеров — это скиннинг или скелетная анимация. Разработчик делает внутри 3D-модели скелет и с помощью вершинного шейдера привязывает к скелету кожу — skin. Кожа — это группа вершин модели, которые расположены вокруг одной кости. Когда движется кость, то движутся и привязанные к ней вершины. Текстура между вершинами разных костей растягивается, но это лучше, чем «оторванные» руки из ранних 3D-игр.

скиннинг с помощью вершинного шейдера 

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

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

шейдер травы на Unity 3D

На создание этой травы с помощью шейдера Unity 3D понадобилось 137 строчек кода

А еще есть частицы — отдельные движущиеся точки. Шейдерные частицы требуют меньше ресурсов, чем если бы движок рендерил их так же, как 3D-объекты или спрайты. 

Что можно сделать с геометрическими шейдерами

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

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

пример работы геометрического шейдера

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

Геометрические шейдеры тесселяции позволяют сделать так: 

  • при отдалении камеры шейдер удаляет какое-то количество полигонов, чтобы сфера на расстоянии выглядела круглой, но не нагружала видеокарту;
  • при приближении камеры шейдер «выдавливает» из каждого полигона еще 2-4 треугольника, чтобы сфера казалась круглой даже если смотреть на нее вплотную. 

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

геометрический шейдер в играх

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

Что делают фрагментные шейдеры

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

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

пример работы пиксельного шейдера

Типичный пример использования фрагментных шейдеров — мультитекстурирование. Мультитекстурирование необходимо для работы лайтмапов (lightmap) и имитации системы освещения. Оно работает так: поверх текстуры объекта накладывается прозрачный лайтмап — дополнительная текстура, которая описывает освещенность объекта. Когда игровой движок понимает, что на объект падает свет, он дает команду шейдеру «проявить» лайтмап в освещенных местах. 

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

doom 3 с пиксельным шейдером

Doom 3 — первая игра с попиксельным шейдерным освещением

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

Как писать шейдеры 

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

Благодаря простому синтаксису языков программирования шейдеров их создание можно вынести в визуальный редактор. Так поступили разработчики движка Unity3D. Шейдеры Unity3D можно делать в визуальном интерфейсе Shader Graph и наблюдать за результатом в реальном времени. 

Интерфейс ShaderGraph в Unity3D

Интерфейс ShaderGraph в Unity3D

Выводы

Если бы не шейдеры — современные игры выглядели бы как Wolfenstein 3D с детализированными моделями. Именно шейдеры делают игры красивыми:

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

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

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

Контактная информация:

hi@koloro.ua

+38 (044) 223 51 20

Бесплатная консультация. Звоните

сделать запрос
up-btn

Расскажите нам о своем проекте

Получите консультацию уже сейчас!

Спасибо за ваше сообщение!

КОНТАКТЫ

понравились наши статьи?

наши новости понравятся тоже !