3 ms·
For my game Astral Divide, I ended-up making a technique that is not listed. It's similar to the one described as "Blurred Buffer", except that instead of doin
by Seb-C 2y ago
For my game Astral Divide, I ended-up making a technique that is not listed.
It's similar to the one described as "Blurred Buffer", except that instead of doing a blur pass, I'm exploiting the borders created by the antialiasing (I think via multi sampling, or maybe texture filtering).
I draw the object in plain opaque white on a transparent black background, and in the fragment shader I filter what does not have a fully opaque or transparent alpha channel (according to some hardcoded threshold). It gives decent enough results, it's cheap performance-wise and is very simple to implement.
- eknkc 2y agoWouldn’t that cause aliasing if you set those pixels to a solid color? Or do you keep the alpha and set a color so the outline is faint but not aliased?
- Seb-C 2y agoI'm reusing the alpha channel indeed. And I reverse it for the innermost side of the border. const float MIN_ALPHA_THRESHOLD = 0.3; const float MAX_ALPHA_THRESHOLD = 0.7; [...] if (fragmentColor.a < MIN_ALPHA_THRESHOLD) { // Outer edge of the border float outputAlpha = fragmentColor.a / MIN_ALPHA_THRESHOLD; outputColor = vColor * outputAlpha; } else if (fragmentColor.a > MAX_ALPHA_THRESHOLD) { // Inner edge of the border float outputAlpha = 1 - ((fragmentColor.a - MAX_ALPHA_THRESHOLD) / (1 - MAX_ALPHA_THRESHOLD)); outputColor = vColor * outputAlpha; } else { // "Inside" of the border outputColor = vColor; } So if the border goes like transparent->opaque, I divide it into segments using a threshold (transparent->min_threshold->max_threshold->opaque) and change the alpha values: - Smoothen out the transparent->min_threshold segment, so that it goes linearly from a=0 to a=1 - make opaque (a=1) the min_threshold->max_threshold segment - Revert and smoothen out the max_threshold->opaque segment so that it goes linearly from a=1 to a=0
- coinfused 2y agoInteresting! I’ll try it out. Thanks for sharing.
- kgeist 2y agoTricks like that are just so satisfying. I remember in a video editing software I was working on, I was tasked to implement the Crop tool, and there was a requirement to temporarily blur everything outside of the cropped area during editing. I didn't want yet another expensive blur pass, so all I did was just change the mipmap bias so that a lower-res texture rendered, and texture filtering did all the work for free. I then compared my result to a similar "blur" effect in Powerpoint (when cropping, too), and it looked the same (even better - Powerpoint had a slight color banding, and my impl didn't). Another similar trick - we didn't have full res antialiasing for some reason (performance?), and most of the canvas was just a bunch of 2D rectangles (representing video frames), however they could be rotated, and aliasing was visible along the edges. Instead of enabling full screen antialiasing I just extruded all quads a little bit, while proportionally shrinking UV coordinates - so that the visible "edge" was inside the actual 3D quad, and texture filtering, again, did all the work for free :)