Wednesday, 28 March 2012

Rethinking texture blending

Most landscape graphic engines have to represent different types of landscape and the question of what happens when impassable rock meets flat ground comes up in a lot of them. For some games it's entirely an artist problem but for those of us making lives hard for ourselves by using procedural generation, we've tended to find ourselves blending from one texture to another across a simple fade. For a while now i've liked the idea of textures blending in a more realistic way and did in fact get it sort of working ten years ago on Battle Engine Aquilla at Lost Toys (video link at bottom of page).

Battle Engine mixed the textures with the CPU while generating them local to the player as mentioned towards the end of my 2011 GDC talk but that was back in the days of fixed function hardware. These days it can easily be done in the shader. I'd been intending to get Topia working like this and spent most of the last few days actually implementing it. Here's a screen grab from yesterday morning. 

Notice how the grass sort of flows into the cracks in the rock and lumps of rock seem to be poking out of the sand on the beach. This is because the shader is actually working out how 'rocky' each pixel should be by adding the low-res 'rockiness' map to the detail-bump-map of 'rockiness', this is effectively modelling the rock poking through the sand and allowing the grass into the cracks in the rock.

Another screen grab, sadly more out of focus as i've taken to pointing my phone at my iPad to take screenshots via instagram. Notice that the reflection of my headphone lead poking out of my phone is in perfect focus. As is the side of my head where you can see the other end of that lead going in my ear...

Taking things a little further, i'm now bringing the bump map of the grass texture into the calculation. Notice how the lumps of rock are poking through the ground but the fuzzy grass is also overlapping the edge of the rock. I'm pretty pleased with how well this worked.

This last pic, though not as excitingly coloured as the others, is probably the most relevent as it's an actual screen grab of Topia running on my iPhone. This messing with Instagram really brings home how important tweaking colours is going to be as it looks kind of bland in comparison. It illustrates the texture blending pretty well though.

Battle Engine doing it into textures 'back in the day' (2001)


  1. I think you can take a screenshot on the iPad itself by pressing Home + Power.

  2. The last shot is taken like that, I just like the convenience and effect of instagram->Twitter

  3. Looking really cool Glenn - do the shader calcs add any overhead or does the hardware handle that?