PSX (ретро) фильтр для вашей игры на Godot

Мне для проекта нужен был такой фильтр на камеру, а, как известно, для Godot готовых ассетов можно сказать нет. Решил сделать сам, заодно поделится с вами, может кому пригодится.

Для тех, кто понимает, что ему нужно, сразу оставляю ссылку:

github.com

GitHub - Capybard/psx-3d-filter: PSX filter for your 3D game in Godot

С остальными разбираемся как же нам такой фильтр сделать.

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

Для камеры создайте дочернюю ноду CanvasLayer, в ней обязательно:

Выставите слой побольше.

PSX (ретро) фильтр для вашей игры на Godot

Поставьте галочку на Follow Viewport.

К CanvasLayer прикрепляем дочернюю ноду ColorRect, и тут уже обязательно применяем следующие настройки:

Цвет делаем прозрачным.

Anchors Preset выставляем на Full Rect.

Включаем Show Behind Parent.

В материале выбираем ShaderMaterial. В Shader создаем новый файл и вставляем туда следующий код:

shader_type canvas_item; uniform float pixel_size : hint_range(1.0, 32.0) = 4.0; uniform float color_depth : hint_range(2.0, 256.0) = 64.0; uniform float dither_strength : hint_range(0.0, 1.0) = 0.5; uniform float scanlines : hint_range(0.0, 1.0) = 0.3; uniform float vignette_strength : hint_range(0.0, 1.0) = 0.2; uniform sampler2D screen_texture : hint_screen_texture, repeat_disable, filter_nearest; void fragment() { vec2 screen_uv = SCREEN_UV; vec2 pixelated_uv = floor(screen_uv * pixel_size * 100.0) / (pixel_size * 100.0); vec4 color = texture(screen_texture, pixelated_uv); color.rgb = floor(color.rgb * color_depth) / color_depth; vec2 screen_pos = FRAGCOORD.xy; float dither = fract(sin(dot(screen_pos, vec2(12.9898, 78.233))) * 43758.5453); color.rgb += (dither - 0.5) * dither_strength / 64.0; float scanline = sin(screen_uv.y * 1000.0) * 0.5 + 0.5; color.rgb *= 1.0 - scanlines * scanline * 0.1; vec2 uv_centered = screen_uv - 0.5; float vignette = 1.0 - dot(uv_centered, uv_centered) * vignette_strength; color.rgb *= vignette; COLOR = color; }

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

Если у вас остались какие-то вопросы, или что-то не получается, пишите – помогу.