logo80lv
Articlesclick_arrow
Research
Talentsclick_arrow
Events
Workshops
Aboutclick_arrow
profile_loginLogIn

Real-Time Rain Material Within Unreal Engine

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.

1 of 2
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.

1 of 2
1 of 2

Import

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.

Maps

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.

Animation

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:

Optimization 

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.

1 of 2
1 of 2

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.

1 of 2

Cem Tezcan, Technical Designer

Interview conducted by Kirill Tokarev

Join discussion

Comments 10

  • 260056063

    材质函数有清晰的图片吗

    0

    260056063

    ·4 years ago·
  • Anonymous user

    @derjyn
    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,
    Cem.

    0

    Anonymous user

    ·6 years ago·
  • Anonymous user

    @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 mind.  Currently a big project I'm working on is using global illumination and some intense atmospheric effects (and I can maintain a healthy 60 FPS on my potato rig).  Working within a budget (performance wise, not money wise) is important, and so one material that can bring a whole game's performance to its knees can be frustrating.

    Of course, all that logic goes out the door if an asset is intended for ArchViz or specific scene renders where performance isn't an issue!  It's hard for me not to assume that a given asset, tool, or workflow overview presented here on 80.lv isn't targeted towards games or interactive media.  Especially when the tagline for the site is "80 level is the best source of valuable information about the gaming industry and its recent trends", and especially when it comes to a game engine like Unreal Engine.

    Still, I apologize for being so harsh in judging your asset under those assumptions and will certainly keep this in mind when I'm reviewing assets in the future.  You are totally right- not all assets are meant for gaming!

    0

    Anonymous user

    ·6 years ago·
  • Anonymous user

    @derjyn
    https://www.unrealengine.com/marketplace/dynamic-rain-overlay
    (doesn't contain "waterflow" and cannot exaggerate) price - ~$20 in Turkey
    https://www.thepixellab.net/free-water-rain-drops-looping-texture
    (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)
    https://www.youtube.com/watch?v=yNOF7a-qXX4
    (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 the result as flipbook animation.

    Your comments makes me think that your consumer behaviour is primarily based on "gaming" performance of the asset which is OK, and rational. Unlike you, some people's consumer behaviour is based on adjustibility and quality or different combinations of these 3 criterias. And this material is one of the best on quality yet. That is fine that you look for performance but that only concerns you and people like you, not everyone, and may not be considered as a physics law or the absolute unique truth. That's the rude part you stick to, by even choosing words like "overkill"... Really?

    You're just showing your approach on buying things, not more than that. There is no true and false on this, neither supressing or killing. Maybe you just need to look into these things like this way and relax a bit.

    0

    Anonymous user

    ·6 years ago·
  • Anonymous user

    @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 of microseconds, that adds up over time to too many wasted hours in my opinion. That's not me saying people can be royal [four-letter word]s and get away with it. Speaking the truth and being a jerk are two different things. Sharing an angry opinion and opening a dialogue are also two different things.

    @cemtezcan - I'm hunting down the very *specific* material overview I had in mind when I commented... I believe it was by Klemen (?) something or other (and was the jumping point for what I've been working on), but in the meantime here are some relative links to other solutions:

    * https://www.unrealengine.com/marketplace/dynamic-rain-overlay (not sure what the performance is like on this one, but the quality is good, plus it has other features like directional occlusion, which got my attention)
    * https://www.thepixellab.net/free-water-rain-drops-looping-texture (this is free and it works really well for archviz or "intense" scenes, plus... it runs well since it's just a looping video)
    * https://www.youtube.com/watch?v=yNOF7a-qXX4 (this is pretty performant, but lower quality, been around for years)

    The solution that I'm cooking up is utilizing generated flow maps and distorted UVs (the classic torus unwrap trick), as well as directional occlusion.  "Parent" surface roughness, normals, and displacement are factors in the chaos pathing.  With the newly introduced material layers functionality, there is the option of slamming this in as a material layer, rather than utilizing it as a function. I'm also wanting to approximate droplet roll-off angles, as that would enable spawning particle systems or the ability to add lens flare effects as seen in many cool photography shots.

    Some other suggested reading (perhaps you've already come across these!) are:
    * Animation of Water Droplet Flow on Curved Surfaces (several authors, but some may recognize Nishita's name)
    * http://pubs.rsc.org/en/content/articlehtml/2017/ra/c7ra09345d
    * https://www.researchgate.net/publication/280115341_Superhydrophobic_materials_and_coatings_A_review

    There are several more references in my documentation folder, but that might already seem like overkill. Again, I wasn't being rude. Just being honest; there are free alternatives that run fast and look good (from the "at-a-glance" to the up-close and personal) and so in my personal case, $16 seems a bit hard to shell out. If the instruction count were (waaay) lower, and it had the bells and whistles that other solutions had, I'd totally nab it to save me some time!

    And I do appreciate the article! I'm grateful for every article or bit of knowledge other artists, designers or developers share. It's what helps us keep pushing the bar. And this specific topic needs some love- water is a hard thing to get down. You've done a pretty good job with your solution.

    0

    Anonymous user

    ·6 years ago·
  • Anonymous user

    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.

    0

    Anonymous user

    ·6 years ago·
  • Anonymous user

    @derjyn@gmail.com

    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.

    0

    Anonymous user

    ·6 years ago·
  • Anonymous user

    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 less friendly as far as opening dialogues like this. People should be able to have opinions and share them, debate them, without being told to hush up and move along. I hope others buy and use this asset- I'd be curious to see how it stacks up to alternatives out there (again, as I said "I love options").

    As far as making my own assets and releasing articles here? It's in the works. And if somebody came along and started a dialogue about issues, opinions they had, or whatever- I would be happy to engage them!

    0

    Anonymous user

    ·6 years ago·
  • Anonymous user

    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.

    0

    Anonymous user

    ·6 years ago·
  • Anonymous user

    $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) and utility functions, and am close to the quality achieved here, sitting at ~180 instructions with everything "turned on".  The kicker?  It's pure procedural.  No textures are needed.

    So this is cool, no doubt about that.  In my humble opinion though, it's not "good".  It doesn't run fast, and it's more complicated than it needs to be.

    0

    Anonymous user

    ·6 years ago·

You might also like

We need your consent

We use cookies on this website to make your browsing experience better. By using the site you agree to our use of cookies.Learn more