supersampling / 2D Anti-aliasing

:information_source: Attention Topic was automatically imported from the old Question2Answer platform.
:bust_in_silhouette: Asked By findaeden

Hi. I’ve been working on a game (2D) that uses a handful of canvasitem shaders, and I realized that they all look jagged, especially when looking at text. I’ve looked in a few places for solutions to this, but couldn’t find anything. I was wondering if I could do some sort of supersampling, so shaders have more than 1 pixel to draw from and end up with a less binary, more smoothed out result.

Attached should be a screenshot of the game.
Thank you in advance.

:bust_in_silhouette: Reply From: Calinou

The 3D Viewport Scaling demo showcases how to do supersampling. Despite only being shown for 3D, the technique works in both 3D and 2D.

That said, global supersampling is expensive at high resolutions, so performing selective supersampling in the shader may be a better way to solve this particular problem.

Thank you for taking the time to respond. I tried using the first solution because it looked very intuitive, and I am extremely new to shaders (all I did so far was take shaders from YouTube tutorials and reconnect wires until the game looks like what I want). but for some reason it didn’t seem to do anything but zoom in and out. I then tried to read the article but I had no idea on how to apply anything that I read.

I was expecting there to be a simple setting on the engine that I could change, given that there’s “Shrink” on the project settings, which seems to do literally the exact opposite of what I want to do. I tried changing that in code, since the engine doesn’t let me go to negative numbers in the UI, but it looks like that can’t be changed once the game is running.

I guess I’ll just have to export the final game like this. maybe in a future project I’ll know what I’m doing. Or not.

findaeden | 2021-08-07 14:23