8 (800) 551-30-75
info@appfox.ru
Since 2008

Бесплатно по России:

8 (800) 551-30-75
info@appfox.ru

Разрабатываем 2D освещение для ночных сцен

  Доброго времени суток всем. Сегодня речь пойдет о том, как сделать освещение в 2D игре, при использовании движка Unity3D. На самом деле тема не новая, можно даже сказать, что устаревшая. Но мы решили привнести в эту тему свое решение.

Это решение имело реальное применение в нашей игре DeepOnes http://store.steampowered.com/app/696730/Deep_Ones/



Техническое задание:

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

Когда перед нами стала задача сделать 2D освещения для DeepOnes мы обратился к уже существующим решениям. И спустя некоторое время мы имели в арсенале несколько подходов.

Давайте их рассмотрим по конкретней.

1.     Решение с использованием SpotLight и затемнением материала спрайтов. 

Решение не самое оптимальное для нас, так как часть игры предусматривала «темноту», а часть игры требовала нормальное «дневное» освещение. В таком случаем можем столкнуться с проблемой замены материала и шейдеров для каждого времени суток. Конечно, никто не отменял проверки в методе Start() – какая сейчас сцена и какой материал нужно использовать. Но зачем на лишние проверки грубо говоря на каждом спрайте.

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

Шаг 1: Создаем новый материал.
Шаг 2: Выставляем ему шейдер Sprites>Diffuse.
Шаг 3: Добавляем на сцену нужный вам спрайт.
Шаг 4: В компоненте Sprite Renderer выставляем в Material наш свежесозданный материал.
Шаг 5: Создаем SpotLight(модно и PointLight, но на него криво ставятся световые текстуры(light cookie).
Шаг 6: Выравниваем свет относительно нашего спрайта.
Шаг 7: В компоненте Transform>Position света значение Z ставим -10(ну или больше).
Шаг 8: Настраиваем цвет, интенсивность, длину света(если надо).

 

Результат которого можно добиться :

а.

 

Такой результат нас не устраивал, поэтому двигаемся к следующему способу.

 

2.     Использование плагина 2D Volumetric Lights

https://github.com/aszecsei/2D-Volumetric-Lighting

http://u3d.at.ua/load/ehffekty/2d_volumetric_lights/21-1-0-505

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



Конечно смотрится очень красиво. Плагин не сложен в использовании. Но при работе мы столкнулись с тем, что слишком много освещения на сцене заставляют проседать fps, а в 2d платформере это недопустимо. Так что оставим этот плагин на полочке симпатичных ассетов.

3) И наконец-то гвоздь программы собственное решение.





И так , что же мы использовали для реализации такого света.

1)    Создаем слой Light. Помечаем все объекты на которых должен быть источник света. Например, на персонаже это будет выглядеть именно так.


2) 2 скрипта. Которые должны висеть на 2D камере.

SpritelightPostRffrct и LightController

Скрипт SpritelightPostRffrct отвечает непосредственно за освещение. Скрипт LightController отвечает за включение/выключение света на определенных уровнях.

 

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


4)    Создаем материал на основе этой текстуры. Для изменения цвета источника света изменяем цвет материала.   

ВАЖНО.

Цвет должен иметь прозрачность 1.


5)    Задаем шейдер материалу.


6)    Скрипт InitLight отключает компонент  MeshRenderer на объекте – источнике света.

7)    Собираем все вместе на объекте освещения и проверяем работу.

8)    Не забываем оставить FeedBack по поводу использования плагина.

 

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

Ссылка на яндекс диск:  https://yadi.sk/d/XBYRKte03UFTwC


Возврат к списку статей

ПОДПИШИТЕСЬ НА ОБНОВЛЕНИЯ

Осмысленное изучение обучающих материалов позволит профессионально повысить квалификацию. Подпишитесь на бесплатные советы и статьи по ключевым этапам разработки.

Ваше имя: * E-mail: * Ваш комментарий или вопрос: * - обязательные поля для заполнения ПОДПИСАТЬСЯ


Разработка мобильных приложений Appfox
г. Москва, Профсоюзная улица, д. 27
Телефон:
Мы работаем ежедневно с 10:00 до 22:00
Appfox
350.000 рублей
Appfox Контакты:
Адрес: Профсоюзная улица, 27 117418 Москва,
Телефон:+7 499 112–03–83, Электронная почта: info@appfox.ru
Онлайн заявка
Оставьте ваши контактные данные и наш консультант свяжется с вами
Ценовой диапазон
5 000 р
более 5 000 000 р
Нажимая на кнопку «Отправить», Вы даете согласие на обработку своих персональных данных