Alright here's the best demo I got of a new project. I love the way it looks and I think it's the strongest kinda visual style I've made so far ]:3
Threw together a real quick enemy spawner to get this done, got a lil overwhelmed towards the end. Thankfully the player can't die yet lol. Playing it made me realize how much I gotta stop iterating on how things look and focus a bit on how it actually plays, too. It's a bit too floaty for what I want.
Also! Since I got the time finally, and the video kinda sucks ass at showing off details there's two things I wanna highlight about the graphics I've been doin:
Number 1, being the outlines! I've tweaked them to hell and back and will prolly do more, but how did I actually do it? Some post processing? Edge detection? The inverted hull method? How'd I get them to sorta look hand drawn?
Well if I turn off the depth test, all's revealed! Sorta!
It's the inverted hull method (with the vertices transformed in clip space in the shader instead of model or world space, you can actually read more about that here) and instead of rendering them in a solid color I overlay a noise texture in screen space to adjust the transparency of the outline per pixel, and it ends up looking pretty convincing (to my eyes, anyway.)
Getting the right noise texture was a lil tricky, you just gotta experiment a bit. I settled on something fairly large scale and smooth, and just do some extra math in the shader to adjust how it affects the transparency even more. Yes I should just bake it into the texture but c'mon. It's early.
At one point I even experimented with sampling the noise in the vertex shader and adjusting how much it displaces the vertices. It looked pretty neat but I think it'd work even better for thicker outlines, they ended up being barely visible on some meshes.
Number 2, keeping up the theme of a faux hand drawn style, the shading:
Closer.
CLOSER.
There. Crosshatching :3
Obviously not, completely true to actual crosshatching I've seen done in the references I had, but I love it well enough to not mess with it too much from now on. Maybe work on a better texture for it, the contrast, etc. But as for how it works it works just fine for me ]:3
It's done by multiplying any incoming light by the crosshatch texture, but only if it falls within a certain "band." Lighting in games usually works by taking the direction a surface is facing and comparing it to the incoming light direction, basically giving us a number that describes how much the two are facing one another. When this number is in a certain range, the "band," the texture is applied. Outside this band it's left alone.
I went over a buncha resources, but the one that helped the most was this comment from this reddit thread. Helped me with the math, and after whipping out my graphics tablet for the first time in a few years I had a texture ready to go for testing, and up above is the result :3
No closing words other than to say this was pretty fun to write, ngl. Hoping to do more of it! Gotta nail down the gif making/screenshot taking process still.