Real-Time Rain Material Within Unreal Engine
Subscribe:  iCal  |  Google Calendar
7, Mar — 1, Jun
York US   26, Mar — 29, Mar
Boston US   28, Mar — 1, Apr
Anaheim US   29, Mar — 1, Apr
RALEIGH US   30, Mar — 1, Apr
Latest comments

Those animations look amazing!! Great job!

Very cool review of the making of Spellbreak. Would be even more cool to see some videos inside UE4 showing how they do a few very specific things unique to them.

This was so helpful for me. I'm hoping to adapt your tutorial to pull off something similar comparing modern satellite imagery with historical maps. No topo, so my steps should be simpler, but I'm a novice with Blender and you've really helped. Thanks!

Real-Time Rain Material Within Unreal Engine
22 May, 2018

Take a survey

Cem Tezcan gave a detailed breakdown of his amazing moisture/rain material he created with the help of Substance Designer. 

Raindrops in Substance Designer

Actually, I love the realism that fluid effects add to our visuals. Fluids are also one of the most challenging subjects on real-time technology because you can’t add simulations to your workflow considering the limited computing power.

I started to create this material a year ago. Instead of getting rain material, my purpose in those days was to achieve some moistened glass material with few drops. I was going to use that for a composition of fresh water on glass bottles. I created just a roughness map and a normal map.

These maps were just tiling of random combinations of 4 different drops that I created procedurally. I made the drops blend with the surface it is attached on, to get a more realistic look.

Project link

This material has the parameters to tweak moist density and randomization options.

Substance material tweak video:

Put aside the Substance Designer’s general material design capability, it also has an amazing procedural way to create very realistic and accurate “geometries” by designing just height maps and normal maps. Drops that I created on Substance Designer look very realistic to me from the start. For the advantage that they are customizable, randomizable and more importantly “tileable”.

Substance material shape movement video: 

This kind of textures is not possible to create by image conversion. Real world drops have either translucency or reflectivity. This means it is not possible to get any proper depth information by the photo references. Because of the inability to capture a tileable water drop normal map from the real world, these should be created artificially. Finally, few weeks before, I decided to make that drops animated on a real-time rainy scene with Unreal Engine.


At first glance, I exported randomized 4 different tiles of drop normal and roughness maps, and 4 different grayscale flow maps in 1k resolution from Substance Designer. Then I mixed, blended and panned these sets with different speeds and UV tilings. Substance Designer gave me the perfect tileable sets, and by panning those sets, I created endlessly and differently looping rain flows.

After creating and adding parameters to this material, I worked on the blueprint to decrease the 4 sets of textures to 1 piece of 1k normal map and 1k grayscale flow alpha by re-using them with different rotations and mirroring to consume less system source. Finally, I got the same result with 2 pieces of 1k textures!

After all the blending and panning in a material function blueprint, I used that result on a translucent material that I created with another blueprint.


Unreal Engine’s material blueprint system is different than the general blueprint system in the engine. It has no flow control like events, branches and loops. It is very hard to get time-based randomization within material blueprint. As I know that panner is a time-based UV changer, I created 2 pieces of 128 x 128 B&W maps to pan them differently to get random intersections between them.

This workaround created a random flashing mask for random raindrops on the surface.

By this randomization system and differently panned normal maps, I blended those to get ultimate disordered flows.


Just simple panning, randomizing and blending took the job. I added some multipliers to control the rain effect on the glass like layered flow speeds, static drop densities, general movement, tiling and so on.

You can stop the flow and make the drops just randomly appear when you need to use the material on a horizontal plane by parameters.

Material adjustments video:

The whole system can be blended with every object which has textures and normal maps already on it. Just don’t forget to lower the roughness values for a wet look.

Adding material to an existing object:

The magnifying glass effect is created by the engine but it is looking good even in close up renders because the curvature and the shape of normal map properly generated in Substance Designer at first place.

Close up animation:


This version is easily rendered on my Nvidia GTX 1070 in 4k resolution with >90 fps on the rainy cafeteria scene. I’m currently working on a light version of the material.

There are 500 instructions on the material right now, but I didn’t optimize any nodes yet. Because I just focused only on quality and realism. Textures can be reduced to 512 x 512 resolution, It will be enough because I tile them 4 to 8 times on 1-meter glass. There is no need to 1k resolution. I will cancel some roughness iterations. I suppose, it can be reduced to 200-300 iterations and can be used on games by canceling additional more layer blendings by leaving some different flow styles.

Real-time capture video with FPS counter on my machine with Nvidia GTX 1070.


Cem Tezcan, Technical Designer

Interview conducted by Kirill Tokarev

Leave a Reply

9 Comment threads
0 Thread replies
Most reacted comment
Hottest comment thread
3 Comment authors Recent comment authors

I’m very happy that we’ve cleared out our intentions that we are always on the constructive side on the discussion. Thanks for this. And I’m very glad that you reviewed this material in a proffessional way as a person who has technical knowledge. finally, thanks again for finding it visually nice.

All the best,

@cemtezcan Thanks for bringing those points up! Thinking of your solution from the angle of ArchViz or static renders changes my view quite a bit. The ability to bake is a great feature, by the way. I’m hoping to see more and more assets offering this. When I said “overkill”, I was referring to the white-papers and write-ups I linked. Perhaps there is a language barrier- I know how certain parts of communication and/or meaning can get lost in translation. As far as my consumer view, you are correct. I definitely look at potential purchases with performance and usability in… Read more »

@derjyn (doesn’t contain “waterflow” and cannot exaggerate) price – ~$20 in Turkey (nice loop, not so realistic but may be fine for specific, tight needs. I don’t consider this as a complete alternative to my work, if you completely understand the capabilities of my material, you shouldn’t too) (this one too is too repeatative and non adjustible. Yet, it is not so realistic for agressive rain) So, I see 3 uncompetative samples (by adjustibility and reality) and one of them is more expensive than my solution. Also you can bake the texture on my material and use… Read more »

@serkan_buldan – I don’t remember using aggressive language, but hey- some people are more sensitive than others. Thanks for the tutorial on how to speak to humans! I’ll be sure to heed that wisdom in the future (okay, now I’m being snarky). I’ve no intention to offend anyone, I just come from a wide-yet-tight circle of designers and developers that are quite blunt when it comes to criticism, and we don’t take offense to this sort of thing. It’s healthy, and something people should be used to if they intend to be efficient. Getting emotional or defensive is a waste… Read more »

Since you are open to discussion and critics i would suggest you to use less aggressive language when you are on the internet. I would try something like,

“Hey Cem, this is great material and thanks for the article. As far as i know from 80lvl Facebook group you can improve the performance or you may consider dropping the price. Keep up the good job.”

It doesn’t have to be the same words but this kind of attitude would lead to a softer conversation because your intention will be clear.

Is there any link or video for the cheaper solutions that you mentioned before? Please share them. I haven’t seen any cheaper, faster, HD, loopable and adjustable “normal map” flipbook video that you said in your first post. I would be happy to compare the results in realism.

My motivation wasn’t to knock Cem, not as a person nor as a developer. As I said, “this is cool, no doubt about that”. I was sharing my personal opinion about the price-point for a material that is so expensive (performance-wise), and pointing out the fact that the same look can be achieved for cheaper (both performance and wallet-wise). I personally find it hard to budget 10s of dollars for a single material, a single effect, etc., but that’s me. Other people have money pouring out of their ears and can afford to play like that. The internet is getting… Read more »

Derjyn it is really hard to understand your motivation of commenting. I bought the material and it *highly* satisfied my needs. Also the seller is really helpful, I was’nt able to run it in 4.18 he fixed it in minutes. If you really want make something really productive create your material and than release an article here.

$16 for a *very* non-performant material? If this was intended for use in high-detail scenes, not meant for gameplay, one would generally just use a flipbook animation, or looping HD video texture (both of which are higher quality and available for free all over). I love options, but c’mon, that’s pretty steep. $5, maybe. And you can loop in materials, using custom HLSL nodes. Also, there are better ways of doing this, all around. Somewhere on the forums, Ryan Brucks (of Epic fame) himself touched on this. I’ve personally been working on a cool water material (not “material blueprint”, thankyouverymuch)… Read more »

Related articles