hal

Maybe the biggest visual change I've made to the game so far but I've always been fond of fancy schmancy borders in rpgs.

What is it?

Rules

• All skill levels are welcome!
• The use of generative AI is not permitted.
• Other media which features pixel art may also be submitted.
• If you submit a game, you also must include source code.
• There will be a theme each week which you are required to follow.
• You are allowed to work solo or with a team.
• No NFTs.
• Do not give unsolicited advice.

How to Submit

hi!!! i'm assuuuuming you're talking about the effect in this one?

i'm using something called parallax mapping!! i know most people know what parallax is and how it works in the realworld but im just gonna demonstrate it real quick just so i dont have to keep going "ok now imagine how parallax works"

so imagine you have two windows. in the middle of the window on the left, there is an Orb. it is directly in the middle of the window. the window on the right also has an Orb, but this one is pushed backwards outside the window quite a bit. now if you look at the two windows, and turn them, you get this:

for the first window, the Orb stays basically in the center of the window. but in the second window, if you turn the window right, the Orb "looks like" it's moving left

parallax mapping is essentially taking this assumption, that if you change the angle you are looking at an object, the further away an object is, the more it will move in the opposite direction. i will spare you on the matrix math involved but you can get the exact relation you need by getting the Tangent Space View Direction. you dont need to understand the math behind this to use it

so, lets go back to the window example, how would you make the same effect, but with just this 2d texture of the Orb?

what if, whenever the object it was attached to turned right, you just moved the texture to the left, by X amount, where X is how far into the window the orb is. you would essentially be cheating god and "faking" the parallax. it would look like it's moving like it's far out of the window, but really, it's still a 2d texture. it would look like this:

i was too lazy to make the shader and record another gif but i dont need to because functionally it would look almost identical because when you turn it right the Orb moves left

again, you can just Know the right direction to push the texture in based on the current angle by getting the Tangent Space View Direction. ok another example. what if you had a black and white noise texture, like this

now what would happen if, instead of moving the whole texture X amount. you moved each pixel a proportional amount based on how bright it is. a 100% black pixel would not get moved at all, and a 100% white pixel would get moved the furthest along the Tangent Space View Direction. a pixel thats right down the middle would move half that distance etc etc. well it would look something like this!!!

thaaat's the basics behind it!!! it's also used for effects like faking room interiors through windows with just a 2d texture in biig cityskapes and the like

you can see how the cube example looks kind of like an ice cube with the distortion, that's Not intentional and how parallax mapping artifacts. i do not care about it, because i make crystals. but some people do care about it, so you can use parallax occlusion mapping, which is like parallax mapping but a step up

here's some more reads on it if you are interested!!!
https://simonschreibt.de/gat/windows-ac-row-ininite/
https://www.patreon.com/posts/playing-with-29753575
https://catlikecoding.com/unity/tutorials/rendering/part-20/
https://halisavakis.com/my-take-on-shaders-parallax-effect-part-i/

I keep forgetting there's no avatar preview when editing your profile....
..... do I just try whipping up a preview tool so I can double check the centering/look of an avatar without having to upload it beforehand

EDIT: there's supposed to be one but it's Borked it seems. Will still do it because it'd be useful just for seeing how an avatar looks like at smaller sizes + it'd be funny.

or did someone make a tool like that already? Surely someone did, right?

It's here and it does what it says on the tin

And the source is available at https://github.com/eramdam/cohost-avatar-previewer