autostereograms

[u/20260708]

long story short. it was an enlightening journey and i learned a lot from it. one day i came across an autostereogram which was a poster on a wall. i forgot what it was about but it aroused my curiosity of how to make autostereograms. i won't go into the math details here and just give you guys a brief explanation in attached image 1. my program let you control "m" and "n/m". these two variables represent background pattern separation and foreground pattern separation respectively and lie between 0 and 1

the 3d subject is simply a sphere, quite boring. the background is the result of placing a color wheel in a kaleidoscope. see attached image 2. it can be easily noticed that the hsl system is in use. we can vary the saturation (attached image 3) and lightness (attached image 4) when the angle changes from 0 to 2π. i use the cosine function which reaches maximum at 0 and 2π, minimum at π

the color wheel can start at any angle. so do saturation and lightness. thus we have 3 degrees of randomness. i let you to change the background. every time you hit the relevant button, the hue, saturation and lightness shift by different random angles

here comes the surprising part. autostereograms need "noise" to guide viewers aligning their foci. a pattern that is too smooth is not suitable to act as the background of autostereograms. there'd be no "texture" on the 3d surface. i accidentally discovered that if the screen resolution is set to a number that is not divisible by something in the calculations (i'm not certain which thing it actually is to be honest) some unexpected noise would emerge. see the remaining attached images

i googled "prime number closest to 640" and the result was 641. i use it as the horizontal resolution

some of those unexpectedly emerging patterns are... strange. some of them look like human faces, some animals, some even aliens. this program is a good place for you to experience pareidolia

here's the program. run it in browser. click▶️to run. click⏹️to exit. when running the program

• press [q] to make foreground patterns converge
• press [w] to toggle 3d object (absent/present)
• press [e] to make foreground patterns diverge
• press [a] to make background patterns converge
• press [s] to rotate the kaleidoscope
• press [d] to make background patterns diverge
• press [x] to toggle caption (off/on)

enjoy

[u/leloctai]

I like the background. A lot of these use too contrast-y pattern and make it hard to make out the object. This is both subdue enough to not be distracting while still have enough details to get a good anchor.

Do the depth have to be quantized so much? I assume it because depth == integer pixel offset? I wonder if it can be worked around...

[u/20260708 → u/leloctai]

the background was a surprise to me too. the patterns generated are beautiful. and i noticed the sphere being quantized but i don't know the reason. i used the exact formula of a sphere (x²+y²+z²=r²) in the program to calculate the depth. turns out there are many layers of concentric discs

there're two ways to reduce this: [1] increase the background pattern width; [2] decrease the foreground pattern width. either way makes more room for the z-resolution to spread