Video wird geladen...

Video konnte nicht geladen werden

Zur Startseite

Waterfall breakdown time! Been working on this waterfall material for the last few days, I want to share a few neat things and gotchas I found when working on it. It's not very complex of an effect, really just a few panning textures! 🧵1/n

510,040 Aufrufe • vor 3 Jahren •via X (Twitter)

25 Kommentare

Profilbild von Dylan Meville
Dylan Mevillevor 3 Jahren

Firstly, the material uses the Thin Translucent shader model. This is because: 1) If we used normal translucent, when you make the material more translucent specular highlights fade away too (BAD!) For water we want BRIGHT highlights and transparent water, like this!

Profilbild von Dylan Meville
Dylan Mevillevor 3 Jahren

2) SLW doesn't like rendering multiple layers. If you have a waterfall, you gotta have a treasure chest behind it, and so when you look back through the waterfall at the ocean, if they are both SLW, the ocean looks BLACK. So Thin Translucent it is!

Profilbild von Dylan Meville
Dylan Mevillevor 3 Jahren

And also, make sure the translucent pass is set to "BEFORE DOF", this is needed to get our nice reflections from our waterfall! This is a bit odd still, as things break a bit if the waterfall doesn't have something (like rocks) writing depth right behind it, but.... good enough!

Profilbild von Dylan Meville
Dylan Mevillevor 3 Jahren

Ok so, material time! Really, it's just a few panning textures. Lets start with normals! Just using a waves normal map, and stretching it so it looks a bit streaky, which gives us those nice highlights. And then just scrolling it down!

Profilbild von Dylan Meville
Dylan Mevillevor 3 Jahren

If we turn down opacity (to make our mesh see through), and then turn on refraction (1.12, pixel normal offset, and metallic spec offset at 0.1, 1, 0.33) we already get something that looks SUPER watery! OoooOoO

Profilbild von Dylan Meville
Dylan Mevillevor 3 Jahren

FOAM TIME. I'm using these two foam textures, that are also just scrolling down. We can remap vertexColor.r from [0,1] to [-1,1], and ADD that to our foam mask to let use dissolve away foam.

Profilbild von Dylan Meville
Dylan Mevillevor 3 Jahren

This remap is important, bc if we just multiply the foam*vtxcolor.r the parts of the text that were black (no foam) could NEVER have any foam no matter how hard you painted it. Remap to -1,1 then adding means that we can have NO FOAM or SOLID foam with a nice noisey dissolve btwn

Profilbild von Dylan Meville
Dylan Mevillevor 3 Jahren

One important thing; If we just turn on refraction again, you'll see that our foam that should be ONTOP of the water, is also getting refracted and it looks GROSS. This is an easy fix, we just lerp the refraction amount based on the foam mask!

Profilbild von Dylan Meville
Dylan Mevillevor 3 Jahren

That is to say, anywhere there is FOAM, we want refraction to be 1 (which is no refraction), anywhere there isn't foam, we want refraction to be whatever the water refraction we set is (1.2ish). So just Lerp(a:waterRefraction, b:1, t:FoamMask)

Profilbild von Dylan Meville
Dylan Mevillevor 3 Jahren

Really now, it's just a case of layering on the foam with the water surface below and figuring out our final opacity based on these masks. We can plug in a color value to the "Thin Translucent Material Output" node to tint our water and make it look like blue gatorade or whatever

Profilbild von Dylan Meville
Dylan Mevillevor 3 Jahren

It's ez and just a few lerps though

Profilbild von Dylan Meville
Dylan Mevillevor 3 Jahren

THATS REALLY IT! You now have a cool waterfall! YAY But still have two super neat tricks that I think are cool that make the waterfall EVEN COOLER.

Profilbild von Dylan Meville
Dylan Mevillevor 3 Jahren

#1) Scale-based uvs. Instead of just using texcoords to sample the foam/normal textures, we can scale them up by the obj scale first, so that when we scale up the waterfall mesh, the textures don't get gross and stretched, but instead keep the same size! COOL HUH??

Profilbild von Dylan Meville
Dylan Mevillevor 3 Jahren

We can also get a "random" value from the object position and use that as a random offset to the texcoord too, so that every waterfall gets a little random offset so they look a little different and not all scrolling the exact same texture at the same time in the same place

Profilbild von Dylan Meville
Dylan Mevillevor 3 Jahren

#2) Is a bit more complex, but I really HATE that hard edge on the left and right sides of the waterfall. They are perfectly STRAIGHT. We need to break up that edge so it looks more organic. We could just fade it out with a vertex color painted on, but that's boring...

Profilbild von Dylan Meville
Dylan Mevillevor 3 Jahren

Instead, lets paint an opacity mask (in vtxcolor.a) and then use that, just like we did with the foam, as a dissolve! We'll only use the foam coming from the splashy looking texture, and if we sharpen up that mask we get some REALLY nice splashes on the edges now too!

Profilbild von Dylan Meville
Dylan Mevillevor 3 Jahren

Plugging that into opacity, looks so good!! Those gross hard straight edges are now splashy beautiful edges!

Profilbild von Dylan Meville
Dylan Mevillevor 3 Jahren

The one issue with this, now that we have parts of the waterfall we want to cut away entirely, if we just plug it into opacity, those cut away bits are still getting specular highlights (and refractions, and wpo)! GROSS!! We can fix this though :)

Profilbild von Dylan Meville
Dylan Mevillevor 3 Jahren

We just have to use this opacity mask in a lerp, to lerp metallic, spec, and roughness down to 0 on pixels that are cut away (value of 0, black, on the opacity mask). We also want to lerp refraction down to 1 in these spots, and scale down the wpo intensity here too!

Profilbild von Dylan Meville
Dylan Mevillevor 3 Jahren

Oh, I didn't talk about WPO! It's straightforward! Using the built-in "Low Res Blurred Noise", we just visually find some nice values for the uv scale, and scroll speed, and then push each vertex towards it's normal direction, scaled by the noise*intensity!

Profilbild von Dylan Meville
Dylan Mevillevor 3 Jahren

If you want your waterfall to be two-sided, remember to flip the normal.z based on the twosidedsign node!

Profilbild von Dylan Meville
Dylan Mevillevor 3 Jahren

Graph

Profilbild von Dylan Meville
Dylan Mevillevor 3 Jahren

DM_Mul2Sub1 is just the remap from [0,1] to [-1,1]. Just does exactly what it says, multiplies the input by 2, then subtracts 1.

Profilbild von Dylan Meville
Dylan Mevillevor 3 Jahren

THE END THANKS FOR COMING TO MY TED TALK! Always happy to answer questions or explain something more, just ask! I'm gunna go drink some blue gatorade now as looking at this waterfall made me THIRSTY

Profilbild von Dylan Meville
Dylan Mevillevor 3 Jahren

There's also a youtube thingy, doesn't quite go in as much detail as this thread, but might be usefuly. Mostly me just rambling, so watch at 2x speed!

Ähnliche Videos