I am trying to make a much simpler version of the graphic effects we see in the game Civilization 6. This question applies to the graphics on land and ocean tiles. But I first noticed this effect on the ocean tiles.

enter image description here

So you will see the waves effect (fairly near centre of the image), if you ever played the game you'll know that these waves roll into the coast and are there to let you know its an ocean tile and not a lake.

But these waves span several hex tiles, appearingly seamless. But the map is procedurally generated and so land tiles and ocean can appear in any random formations.

How does it know which animated texture to play for each tile?

I already have made the hex tile map.
I have NOT yet learnt how to add my own custom material/shader to make the texture animate, but I believe I can learn this on my own

But I really am at a loss of how the tile 'knows' what its neighbours are doing and is able to join the texture so nicely). Is there a name for this process of which i can do further research? Any tips on where to start making this effect. (I only want it to look very basic to start with , I'm not expecting to be able to recreate Civ6 any time soon :P

Many thanks!


1 Answer 1


I don't know how Civ6 does it. But this is how I would do it:

A height map is generated based on the tile information; this could be a simple version (a tile could be represented by 1 pixel in that heightmap). This is then used by a shader as a regular water-foam shader works. The heightmap could be more intricate and have a flow map (so each pixel has an X/Y vector in the rgb coded in)- for more advanced shaders with flowing water or different lapping waves.

The water is not rendered tile-by tile but as one 3D plane using the generated heightmap as source of information. Deeper parts of the ocean could be darker etc.

In fact I suspect the rest of the gameworld is also rendered as terrain using such technique (considering the mountain ranges are similar seamless and unique). The 'undiscovered' areas on the map have a distinct perlin noise look to them... Remember that game visuals and gamelogic are two separate entities- so how the world is represented can be completely different from how the world is displayed. So using heightmaps and 3D meshes that line up with the hex grid are completely valid strategies- the world is simply not drawn hex-by-hex tile.

  • \$\begingroup\$ thank you this has given me some food for thought. Will try and bash something together soon using this technique \$\endgroup\$ Jan 7, 2019 at 13:04

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .