Эффект свечения пикселей в игре за четыре шага⁠⁠

Разрешение экрана у меня в игре 320х180. При таком низком разрешении видно каждый пиксель, и я решил сделать красивое ретро-свечение.

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

Алгоритм эффекта очень прост и состоит из четырех пунктов. Первые два - это неоновое свечение пикселей. Вокруг каждого пикселя делаются два свечения, каждый со своим радиусом R и значением непрозрачности A.

Берем цвет пикселя и подсвечиваем соседние таким же цветом, но с заданной непрозрачностью A. По мере удаления, свечение (непрозрачность) уменьшаем линейно, пока не дойдем до нуля на расстоянии R.

Шаг третий - скругление. Во время экспериментов оказалось, что если немного скруглить окончания непрерывных отрезков пикселей, то получается красиво. Если у пикселя в горизонтальном ряду нет соседа с какой-нибудь стороны (лево/право) - скругляем эту сторону.

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

Осталось только подобрать параметры эффекта, чтобы смотрелось хорошо. Вот, например, картинка с исходными пикселями и с постобработкой.

Тут я установил параметры, которые дают, на мой субъективный взгляд, лучшую картинку на средних и больших мониторах. А вот на телефонах - темновато. Для телефонов надо подбирать свои параметры.

Аутентичность свечения пикселей на CRT мониторах — не основная задача. Главное, чтобы смотрелось прикольно и было не больно глазам во время игры. Сейчас картинка мне нравится процентов на 80. Буду еще допиливать.

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