Megan Fox
patreon
Making a tiling texture look less ugly
🕑 Added 2019-10-31 19:35:50 +0000 UTCThere's a lot of ways of doing this, but I'm going to focus on Voronoi diagrams. Don't know the term? Well, you've probably seen one. Looks like this:
What you're doing, roughly, is determining per pixel which random point it's closest to, and then blocking all of those into a single surface. Actually doing this in real-time is tricky (and expensive) though, so there's a bunch of approximations. One of those is to do what's called Delaunay triangulation, which corresponds to the dual graph of the Voronoi diagram for the points used. Not sure what I mean? Read that link, it explains it.
This is all dense, so if you actually want to learn this stuff, google Voronoi and Delaunay, there's a ton of writeups. I'm only covering this as a stepping stone to more interesting things.
Anyways, once you have a Voronoi, there's a bunch of methods for generating a smooth voronoi. That is a voronoi diagram that doesn't have significant discontinuities at the edges of the polygons. Again, there are a lot of ways of doing this, and you end up with something closer to this (image from that book-of-shaders link there, click it! it's interesting!):
Now then. WHY do we care? This is the meat of how we break up tiling. One of the long-standing tricks for making a small tiling surface larger is adding a detail surface that tiles less quickly. You can literally take a noisy surface that tiles rapidly (and looks bad), copy the same surface but tiling it half as often, and it helps a lot to break up the noise. Not great, and you need to start with an actually tiling material (which I didn't do here so you can more clearly see what I'm doing), but here, see?
Now that's great, and it does help, but because your larger-detail-thing-on-top is uniform, it only goes so far. This kind of dumb approach really doesn't work for anything but homogeneous noise, first of all. Also, it'd be better if we could randomly vary the intensity of the larger tiling surface on top, right? Then it would REALLY break up lines.
So! That's where the Voronoi stuff comes in. Instead of just layering your material on top like a uniform blanket, we use the Voronoi to do some fancy logic that carefully blends stuff around. Why did we need the smooth Voronoi? Well because if we didn't, our fancy subtle blending would have huge seams, right? We need weighting that avoids the seams smoothly.
Anyways! Here's what all this fanciness gets us. Please refer to Inigo Quilez's excellent algorithm here. Technique 2 is the one I've been describing, more or less. Here's how it looks in practice. You start with a surface like this:
and then, with a Voronoi/anti-tiling shader, it turns into this:
This is how it looks up at RTS / seeing-a-huge-expanse-of-terrain distances. Still nice!
However! It is not a hammer for every nail. You need to be using an inherently unordered texture. Something that is visually chaotic, like tiling asphalt, or dirt, or etc. If you have a highly ordered surface, with linear scrapes or the like, this is what Voronoi does it to:
You can get around this by using, say, a normal map layer that isn't using Voronoi, adding (linear/ordered) scrapes on top of your less ordered diffuse layer (which does use Voronoi).
So anyways, that's the trick! That's how you break up tiling surfaces. Modern AAA stuff probably doesn't run into this as much, because often they just sit there and have an artist paint the whole damn thing uniquely. Or they use AI-driven tools that apply this and far more advanced tricks. If you're working in my space though, that early 00's look of having huge flat surfaces with textures stretched over them? It's super important.
If you're a $3+ patron, here's the shader I made to convert all this into Unity. Enjoy!
