Category Archives: Game Art Tricks

I made a game! Buy on Steam

This article was updated. Jump to Update 1.

What can I say, I like water textures. You too? If so, let’s take a look at some water effects in Jedi: Fallen Order! If you want, you can jump to specific sections with this index:

Splash โ€ข Impact โ€ข Drops โ€ข Bubbles โ€ข Waterfalls

One day, I was happily jumping into a puddle and thought to myself: “I wonder what the textures look like for this effect!”

Source: Jedi: Fallen Order

Interesting: The first jump doesn’t trigger a splash when I land. Only the second (higher) jump does! It looks like there’s a timer and splashes are only allowed to re-trigger after a certain cooldown.

Splash

Turns out, there are (almost) no textures used! Instead, they use mesh particles. Of course, it’s not uncommon to use splashy meshes in modern games, but to be honest, I didn’t expect, that 95% of the splash is mesh based:

Source: Jedi: Fallen Order

Indeed, there are some “classic” particles, but those are only used for the small drops. Below, you can see their texture (I assume that each particle gets random UVs assigned to use one of the bubble bobbles):

The majority of the effect is based on mesh particles with a nice (refraction) shader. Yes, these meshes contain way more geometry than a standard particle (with only 4 vertices) but there’s no wasted overdraw which is a huge plus.

Source: Jedi: Fallen Order

By the way, there is a nice tutorial out there for creating such splashy meshes by Andreas Glad.

Impact

Now, I was hooked and wanted to know if other water effects make use of geometries as well. For example, when this friendly AT-AT has a little accident and falls, we can see some nice water splashes.

Source: Jedi: Fallen Order

But in this case: no meshes!

Source: Jedi: Fallen Order

It’s standard particles using a flip book texture (and again nice refraction in the shader):

Since I mentioned refraction twice, here is a little example of how this flip book looks with and without refraction:

Refraction Material based on Scene Color

It’s very interesting, that small effects like the jump gets these complex meshes, while a huge splash like the AT-AT impact “just” gets standard particles. My guess: It’s about scale. Maybe they decided, that meshes for small-scale splashes are OK but creating geometries for huge splashes (with a lot of detail and drops) would require too much geometry?

Drops

At this point, I couldn’t tell anymore what’s a particle and what’s a mesh. Are the falling drops or the impact splashes meshes or textures?

Source: Jedi: Fallen Order

Both are standard particles, where the splash is using the same flip book texture as the AT-AT impact, and the drops are using this one:

Bubbles

For the bubbles when diving, I was sure it would be geometric spheres distorted via vertex shader!

Source: Jedi: Fallen Order

But I was wrong:

Source: Jedi: Fallen Order

Here are the two normal maps which are used for the bubbles: One for the bubble itself and another one to distort the bubble for the classic wobbly look:

The bubble texture has enough space left, right, up and down to be distorted without visible seams!

Waterfalls

There are some nice waterfalls in the game as well, and I love to look at geometries and textures from such cascades.

Waterfall #1 – Classic-Shmassic

Let’s start with this simple, splashy stream of water.

Source: Jedi: Fallen Order

To make it short: It’s all particles using the textures we’ve seen before (the flip book from the impact and the sprite sheet used by the drops).

Source: Jedi: Fallen Order

Waterfall #2 – Crossed-Shmossed

At first, I thought we see some classic particles falling down like in the example above.

Source: Jedi: Fallen Order

But, I was wrong (again). It’s a same mesh and a nice distortion shader runs these textures along it:

Source: Jedi: Fallen Order

Note, that it’s a crossed plane. This extra geometry makes sure that the cascade also looks nice, even when seen from the side.

Waterfall #3 – Double-Shmouble

The next waterfall looks similar to the one above but

Source: Jedi: Fallen Order

it’s not just one mesh but two on top of each other:

Source: Jedi: Fallen Order

Note, how distorted the meshes look in the video above where the wireframes are revealed, while the mesh looks not deformed in the video below. This is because a vertex shader is deforming the vertices to add some nice wavy motion.

Source: Jedi: Fallen Order

The shader running on the left mesh uses the textures on the left and the shader running on the right mesh uses the textures on the right.

Waterfall #4 – Opaque-Shmopaque

These big scale waterfalls are special: A shader mixes several textures and moves them along a static opaque geometry:

Source: Jedi: Fallen Order

I’m not sure if all of these textures are actually used, but that’s what my analyzer showed me:

Now, there’s another layer of waterfalls on top! But this time they use a translucent material. We know the mesh already from the Double-Shmouble:

And if you asked yourself, how the nice water vapor is added to the level: It’s “just” big planes (which add a very nice depth to the image):

That’s it! I hope you’re as fascinated about water effects and their meshes and textures as I am! If you want to know more about the creation of textures for VFX (e.g. water splashes), continue reading here:

Have a very nice day! โ™ฅ
Simon

Update 1

Death Stranding was free in the Epic Store and I wanted to look at their waterfalls for some time anyway, what a nice opportunity! Here are they in their full beauty:

Source: Death Stranding

The first surprise: Only one texture is used! At first, I thought: “Wait…only a normal map and nothing else?!” but then I realized, that they put a nice water structure into the Alpha Channel of this texture!

Source: Death Stranding

If you need photos with a similar look, check these amazing photos on textures.com!

The main mask is coming from the mesh itself in form of vertex colors. They use the 3 channels for different masks, but I’m not sure what G and B is used for:

Source: Death Stranding

I tried to re-create the waterfall material in Unreal. I’m not sure if I got it right, but I think the main thing is to use the vertex color and add the water mask (from the alpha channel) on top. Here is my material, but like I said: It’s just my guess!

Click to resize

Here you can see me trying to get the alpha and albedo right by comparing the unlit versions:

If you have any idea how to improve the result, or maybe you’ve even some inside-knowledge: Let me know! :)