Stylized water tutorial (Patreon)

There are a lot of ways to do water. It's one of the more diverse shaders in UE4 in terms of approach and there are countless tutorials on them. My water setup is pretty basic but I hope you find something interesting.

• Reference

Let's begin by understanding how water can be represented. I think it's important to determine where your project's style sits on the scale. In my instance, it's definitely stylized, but there are still touches of realism that separates it from a simplified "low-poly" style, so I it's probably in the center left. Keep this scale in mind to adjust how you want the final material to look like.


I tend to collect reference from personal photos, travel blogs and Twitter. Twitter is a godsend, they have a great photography community. I can proudly say my reference folder has 6000+ photos/illustrations.

For this tutorial, I'll mostly focus on the base color of the material since normals, opacity, and other misc is very basic. The material is translucent with tessellation enabled. 
 

  ❗ Disclaimer the parameters needs to be adjusted for your liking. Copying the values will not produce the same results  ❗ 

Base color overview (High res:  https://i.imgur.com/jTbs5Ip.jpg  )

Let's begin with the master color. We lerp between 2 constant3 vectors, using depthfade for the alpha. One will control the color of shallow water and the other controlling deep water.
Demonstration


To add the surface foam, we mask using a B/W texture and setup its panner and UVs. Since the panner setup is common, we will make a material function. The texture will be swapped if the water body is a river, the ocean or a pond.
Demonstration


Material function


We will also add two types of noise, opacity noise and distortion. We will first add with a distortion mask to create a wavy effect.
Demonstration


We will then multiply with another mask. This creates areas that doesn't have foam and it helps to hide tiling.
Demonstration


The shoreline waves are taken from Hippowombat's guide ( https://twitter.com/hippowombat/status/1033888690945253376 ). Thank you! We use an opacity noise once again to add variation.
Demonstration


We use lerp to control the amount of foam the edge gets, and control the color. Sometimes I want a white edge around my water so I will lerp another color with depth fade.
To control the horizon color, we lerp with pixel depth. Finally plug everything into the base color slot. 
Demonstration


An option is to add rapids with vertex painting. Use a lerp with vertex color as the alpha.

Other stuff 

For opacity, we add 2 depthfades. Deep water will be opaque and shallow water will be translucent. Plug into Opacity.

Normal maps are taken from Tequila Works ( https://www.youtube.com/watch?v=4FIDBeF_4SI ). Plug into Normal.


We finish up by adding displacement. Plug into World Displacement.


Refraction. Fresnel Falloff should actually be negative, further objects should be distorted more than closer ones. Plug into Refraction.

   That's about it! It's a pretty amateur setup compared to professional works, but adding complicated things will just confuse me. I mostly learn by breaking down existing projects and picking apart things that might be useful. It looks good but I think it's still considered WIP, so if you have tips on improving it please let me know, the help will be appreciated. 
I hope you enjoyed my first tutorial, a guide on trees and grass will be published soon



Thanks for reading °˖✧◝(⁰▿⁰)◜✧˖°

Sources (in order)
https://twitter.com/tiffaart/status/1021004588629934082, http://canvas.pantone.com/Jiro_Miyata
The Legend of Zelda: The Wind Waker 
https://twitter.com/hyogonosuke?lang=en 
https://www.travel.co.jp/guide/matome/1520/, https://photohito.com/photo/7933227/, https://twitter.com/odwure?lang=en-gb
 http://yamaainojoki.blog.fc2.com/blog-date-201307.html 
 https://twitter.com/Iska_TOSHIKAZU 
 https://twitter.com/hippowombat?lang=en 
 https://twitter.com/simonschreibt?lang=en 
Additional Resources:
https://www.artstation.com/artwork/veV1a 
https://www.youtube.com/watch?v=FuGQXtISR6w 
https://www.youtube.com/watch?v=4FIDBeF_4SI 
https://www.youtube.com/watch?v=5zoflexdo70