ASCII Shader Thing

For starters, Yesterday I was inspired from bowler (@troutser) in the Roblox Scripting Assistance Discord Server

Image

image

I used acerola my beloved as a reference

The prototype took under an hour to finish, and the performance is reasonable, and I parallelized it quite easily, thanks to ComputeLua


another one with a different character gradient:

another one that fades the farther it is

screenshots

image

building at 200x200 resolution


building at 150x150 resolution (without difference of gaussians)

the classic treehouse at 100x100 resolution

(sorry for the low quality demo, i was trying to keep the obs from adding even more lag)
without obs, it stands at ~18 fps in 80x80 resolution
raycasting, edge detection, and ascii gradient quantization are all computed in parallel using ComputeLua

let me know whats your fps

what do you think
  • ok cool
  • why
  • next question
  • bad performance booo
  • erm what the sigma

0 voters

10 Likes

3 Likes

It’s dependent on your computer’s specs and mine isn’t really optimized for gaming; and since roblox doesn’t have GPU support, we’re limited to using the CPU + we can’t precisely get the screen pixels so we’d have to use raycast, which is by far the longest task. If we could get the screen pixels, then It’d be way faster (150 ms faster, which seems small but it’ll get the frame delta time from 0.15s to 0.009s)

4 Likes

attempted, got this crap

cool idea btw

2 Likes

Try using a variety more characters for the character gradient, Im sure It’d be better

2 Likes

i already used !@#$%& and |, can’t figure out how to determine which character to use. i was just using the Value in the HSV form of the color of each pixel.

1 Like

Mine uses the luminance value (approximate brightness) of each pixel, and since luminance is in the range of 0-1, I can just multiply it by #characters to get the appropriate character

1 Like

how did you get the luminance value? i used value because it also ranges from 0 - 1, and determines the darkness of the color.

1 Like

It just multiplies each color channel by some predetermined weight and sum them all together, you can try googling it since I cant get on my pc as its being serviced right now

2 Likes

good to know. thanks for the info bud

2 Likes

i was doing the difference of gaussians wrong, the sobel filter is supposed to be applied to the DoG value, but it was just purely for the edge detection treshold. now its corrected and parallelized for each edge detection step (Raycast → DoG → Sobel → ASCII)
image


the performance stays relatively the same at ~14-18 fps in 80x80

1 Like

just rendered the building in 200x200, which was really laggy (4 fps)

2 Likes

try a 1920 x 1080 one please, let’s see how that does

1 Like

no please have mercy

1 Like

when i hide the gui (the shader is still running), the gameplay feels smoother, so it might be that the textlabels (represented as pixels) is causing lag; or just that the renderer isnt fast enough (the gaussian blur is the slowest now)

1 Like

This shader looks nice! Good job on it!

1 Like

the difference and gaussians + sobel filter took 200 ms (0.3s) each frame, the fps went from 14 to 18 consistently; so ig its time to optimize the gaussians

1 Like

is there anyway to push the performance also how does it work?

1 Like

@finaIlyhappy ⠀ ⠀ ⠀ ⠀ ⠀ ⠀ ⠀ ⠀ ⠀ ⠀ ⠀ ⠀ ⠀ ⠀ ⠀ ⠀ ⠀ ⠀ ⠀ ⠀ ⠀ ⠀ ⠀ ⠀ ⠀ ⠀ ⠀ ⠀ ⠀ ⠀⠀^ (click the reply above)
There should be a way, but I’m trying my best right now; I’m gonna implement some precomputations so that it gets a tad bit faster

1 Like

did some tuning and now its doing a consistent 200 ms refresh rate instead of 400 ms (tried other alternatives to gaussian blur but they’re all trash with little to no improvement in performnce)

1 Like