#technical art

[krisp-xyz]

Hi chat I've been kinda cooking with a cool shader that scatters textures in a way where they're both seamless and have no visible repetition :3c

one cool feature is this height-based blending:

Left: regular lerp Right: custom height blending

I ran into some interesting challenges actually and realized that most methods for blending between two heightmaps actually have some drawbacks for different scenarios so I might do a whole blog post on how to properly blend two heightmaps together if that's something people are interested in

I also think it's neat to compare these two blending modes side by side since the heightmap one keeps the actual heightmap a lot more crisp and doesn't necessarily blur/fade stuff in ways that can look a bit bad depending on your heightmap

[jopilatje]

An Eevee card render for @poketcg-art’s redraw event, in which I was a bit more focused on the GPU definition of draw than actually redrawing the art. Render made in Godot, card artwork and graphics made in Photoshop.

The amount of time spent on redrawing the actual artwork was way less than writing the custom lighting shader and trying to figure out why/how the real card’s holographic foil actually reflects light the way it does. (after some research I understand the physics principle of holographic foil, but… the mirroring stripeyness of this card in particular? no idea.)

This is my digital redraw of the original artwork (not the star of the show here):

And this is the reference card, with artwork by Ken Sugimori (such a standard choice- but I’m a sucker for the classic art) in definitely-not-mint condition:

[myfloatingrock]

Hajime Sorayama, naga (1997)

[surfacedfox]

Yes, yes, we're in an era of raytracing and whatnot but the Switch still exists and often the folks who most need a game don't have the shiniest new tech to run it on. So I was thinking about stuff related to lighting techniques since IMO that makes up about 60% of the impact of any given game environment.

Generally, you'd have what's called a directional light in your scene. This directional light is usually a stand-in for your sun. If you look at a room in broad daylight, it's not just the sun that's your light source. But directional lights mean you miss out on that contrast if your window is not a sun-facing window, which can make your lighting look kinda flat.

So this is just fine:

But the moment it's made parallel instead of perpendicular....

The lighting starts looking a little samey.

IRL's, every single window and door you have is technically a light source! Additionally, I've observed that each room's parallel light mostly stays the same, varying intensity. (source: my room has a north facing window, so it's almost entirely lit by indirect lighting)

This makes sense. Compare that to a scene with some kind of actual bounced indirect lighting using some kind of Global Illumination, and you get something like this:

Hm. That's a massive performance hit. Could there be some way to do it cheaper?

Add a second sun directional light for bounced indirect lighting. This is a copy of the sun, at roughly 10% of the sun's intensity, lighting in the exact opposite direction to the sun with no shadows.

So now when we go parallel, there's still something going on that gives contrast. Most importantly, trust the process:

Now you can add a shadow casting parallel light to your sun with the same settings as your bounced indirect:

I think we're starting to see some resemblance! At its core, we've reached the point where there's something technically novel going on. We can then expand from here! For example, I can now make my light source interpolate between a set angle for each room when building its mood lighting.

In my heart of hearts, I believe the most powerful thing, the secret sauce for something that looks, and most importantly, feels awesome is intentionality. We're not aiming to simulate reality anyways, we're aiming to provide a certain experience to our players.

That said, I do feel the hate is misdirected. The reason why this is ubiquitous today is not because of laziness, but rather, executive pressure means devs don't get the time/space to be intentional.

Also, yes, you can be very intentional with more expensive GI, raytracing and all the fancy schmancy new tech. That's what differentiates really good implementations with the eh ones. This isn't a dig at raytracing. Like anything else, it's a tool to be used.

Now, having art directed and turned a few dials to make it look good while I was talking about this, here's the final result!

[canmom]

Hi, i used to follow you on here ages ago, then wandered off. If it's not too much bother, do you happen to remember the name of a very low-level graphics programming tutorial you did once? Someone i know wants to write their own rasterizer

hello! you are probably thinking of either Scratchapixel (the tutorial I was following), specifically their article on rasterisation, but maybe also my Building My Own Rasteriser series, which is the slightly more detailed notes I wrote while following along their guide some years back.

Scratchapixel is a fantastic resource, I highly recommend it. And a simple rasteriser is also a great way to learn what's going on under the hood in graphics programming, it's a great project to do, good luck to your friend!

Other useful articles and books you may find of interest:

Vulkan tutorial - in case you want to move beyond toy software rasterisers and use an actual hardware graphics API, but you don't want to just abstract it away using a library, this is where to learn how to drive Vulkan.

Physically Based Rendering: From Theory to Implementation - the definitive textbook on how to write a raytracer, available free online. A lot of the theory (microfacets etc.) will also be extremely relevant for surface shaders in a rasteriser.

Inigo Quilez's website: Inigo Quilez is the cofounder of Shadertoy, and probably the world expert on raymarching signed distance fields. There's a huge amount to explore in there if you're interested in that kind of technique and all sorts of other weird graphics tricks.

A list of frame breakdowns/graphics studies, another one - I remember finding another site with these but I can't find it right now. In any case, games usually use quite complex deferred rendering techniques, with multiple render passes combined in various ways. One of the best ways to learn about this is to use a tool like RenderDoc to break down all the draw calls in the frame, and see exactly what it does. So have a look through those pages to learn a bit how games are rendered!

game art tricks - I actually just found this one while writing this post but it's good! primarily visual effects focused, lots of very ingenious approaches to rendering things cheaply.

...I could def go on, at some point maybe I gotta just make a page on my website for 'useful graphics programming/tech art resources', but I'm probably getting a bit ahead here haha. Hope your friend has some fun drawing those triangles!

[nucleiaster]

Shader study - Valorant barrier shader

Some of my favorite streamers started playing Valorant and I really liked the way the barriers that prevent players from entering the play area at the beginning of the round looked, so I tried recreating the effect in Unity !

I absolutely love the stylized aesthetic of the vfx in this game, and how matte the shading is. It looks so good.

[fogaminghub]

🌿✨ Get ready for an adventure like no other! Horizon Zero Dawn Remastered is set to launch on October 31, bringing breathtaking enhancements to gameplay and visuals! 

With new foliage textures, improved NPC dynamics, and over 10 hours of motion-capture for more lifelike conversations, this remaster is sure to amaze. 💚

Pre-order now and rediscover Aloy’s journey with stunning new features! 

[alana-taije]

“ETCHING” (2017)

[windsails]

hii!! welcome to my page 🌱

I am researching niche topics, writing a book, practicing technical art, ui/ux design, computer science, game design, systems, building artistic toolkits...at the end of the day i like doing technical creative work and reading. My favorite thing in the world is to dig into an extremely complex technical creative project

i don’t really censor myself or what i repost so maybe don’t follow unless you’re 18+ etc etc. i have a substack, created a contextual notebook and i also produce music occasionally, i play piano and guitar. mostly i love to read, play games, watch movies, create art, learn, share

my dream is to move to a nice quiet place where i can have a garden and a big library inside and ride bikes everyday and work collaboratively on projects

[noodles-and-tea]

Well, yes.

[toonaviv]

chapter 3 was really good.

[Image description: Digital drawing of characters from Deltarune chapter 3. Toriel and Asgore are walking away from each other with neutral expressions on their face. Tenna is clinging onto the back of their shirts, looking nervously into the pit he is dangling over. In the pit is the Roaring Knight grinning at dark world Kris. Text above them reads "Divorce leads TV to the worst places." End description.]

[scapegods]

what if this scene was worse

[emryste]

redrew some older 2020 art. we remain hedgehog

[canmom]

so there's a widely used tool called ReShade which intercepts the DirectX API calls of a game to add additional post-processing effects using the game's frame and depth buffers. basically gives you access to various deferred techniques, with certain technical caveats. common effects include bloom, depth of field, tonemapping, and screen space ambient occlusion.

one of the more ambitious effects is Screen Space Realtime Global Illumination (SSRTGI, or just RTGI), implemented in Marty's Mods. this attempts to simulate diffuse-diffuse interreflection, i.e. how the light from a brightly lit object will spill onto surrounding objects. it's a very important part of rendering bright, colourful scenes.

Global Illumination is usually handled in offline rendering by raytracing, and there's been a lot of excitement in the last few years about the new realtime raytracing acceleration hardware in graphics cards. SSRTGI doesn't use this at all: it knows nothing about the scene geometry beyond the depth buffer. instead it uses raymarching, which steps a ray forward a fixed distance at a time until it discovers an intersection with the depth buffer. Since we're using the depth buffer, the algorithm only knows about the near sides of objects.

This video is a bit rambling but it shows some of the limitations of SSRTGI:

So this has been a fun new toy to play with now my computer can handle it. For example, here's a scene with a bright dancefloor in FFXIV's default renderer, which by default has a strong green tint and desaturated colours.

The Alive preset's colour grade improves matters a lot (this scene doesn't necessarily show the best of it, but removing the green tint and desaturation is a night and day difference throughout the game)...

...but my character's legs should be affected by the bright floor. Enter SSRTGI. I can actually isolate the exact RTGI contribution:

I've turned up the ray length a fair bit compared to the Alive preset's default, since it was a bit too subtle to be worth the performance hit otherwise.

You can see that the SSRTGI models both ambient occlusion and indirect light from bright surfaces. Essentially, each pixel traces a ray in a random direction until it hits a surface visible to the camera. Then, it samples the brightness of that pixel and calculates a light contribution and AO amount. I assume it does some kind of average over neighbouring pixels to smooth out the noise.

The effect is a little subtle, but it makes the scene look more integrated...

...at the cost of a hefty framerate hit (using a 4070Ti; unmodded FFXIV runs at an 1440p ultrawide on an easy 144fps (the monitor refresh rate), without RTGI I can get into the mid 90s, with RTGI it's pretty resolutely locked at 72), and heating my graphics card up to 70-80°C (well within tolerances but it's rare to see a game push it that hard).

The effect may be a little subtle in this scene, which has a lot of high frequency detail and darker materials. It really pops in the Fall Guys crossover, which is a very bright scene.

Note the bright green reflected light on the green cube as a particularly obvious RTGI effect (although the shadow it casts is kinda janky ngl). I should really get a screenshot of the exact RTGI contribution in this area, and create a suite of comparisons like the above.

The RTGI also stands out on bright days in Ul'dah, it does a lot for the Gold Saucer, and generally it makes certain environmental light sources a bit prettier. If you turn it up too much it starts to look a bit silly, since brightly lit floors turn into brilliant torches lighting up nearby walls. But there's a comfy middle ground where it's noticeable without being too extreme. I'm looking forward to seeing how it fares in the colourful areas of the expansions, but this character isn't out of ARR yet.

So, that's cool and all, but toying around with SSRTGI, you really start to feel its limits compared to true raytracing. For example, objects will cast shadows in the indirect lighting, but the specular light contributions are not properly affected by the base game's shadowmaps, so you see speculars in places that you shouldn't. A decent number of surfaces in FFXIV have planar reflections (using the usual technique of rendering the scene inverted through the mirror to a rendertexture), which is nice, but there's no middle ground between 'perfect mirror' and 'rough specular that still reflects the scene'. And of course the other usual limitations of SSRTGI, e.g. a brightly lit surface must be visible to the camera to contribute light.

No, this is nice and all, but the people want real raytracing. Which leads me to wonder is there a way to intercept all the draw calls issued by an application, extract the geometry from them, reformat it for raytracing and feed it into the raytracing hardware - basically replace the game's entire render pipeline with raytracing?

This is going to take some research. It very likely isn't possible, or performant if it was possible, because a lot of smart tech artists have already been working hard to push the limits of ENBSeries, Reshade, etc. (Acerola has a solid video on implementing various effects in Reshade.) But the imp of the perverse in me wants to figure out if it can be done. After all, RenderDoc is capable of intercepting and analysing all the draw calls issued by an application. The question is, how severe is the overhead of on-the-fly translating rasterisation calls into raytracing calls? Most likely absolutely hideous! That's not how you're supposed to use a graphics card!

Since the hardware I develop for very definitely does not support raytracing, I have relatively little idea how you actually write a shader with raytracing. But now I kind of want to find out. If I ever get anywhere beyond idle thoughts, I'll let you know what I find out.

[nucleiaster]

A stylized liquid shader I've been working on !

I'd like to post more 3d modeling and shader work here, and maybe some effects breakdown?? idk

[cherlok-jolms]

The family's fighting again.