Sign in to follow this  
angelmu88

Rain droplets technique

Recommended Posts

angelmu88    228

Hi,

 

I have to implement an effect for simulating raindrops on a window and although I've found a lot information on how to implement a particle system for that purpose, like the great Kaneda articles (e.g. Animation of Water Droplets Moving

Down a Surface), I'm still looking for a good technique for the droplets.
 
Take a look at this video:
 
 
or this other one:
 
 
Do you think they are using a expensive technique such as Metaballs or something much simpler?
 
Thanks

Share this post


Link to post
Share on other sites

All it involves is just texture masking - not expensive at all. You create several textures with semi-transparent water droplets using the alpha channel (this can probably be done in photoshop) then have their vertical texture coordinates change as a variable of time in the shader code.

Share this post


Link to post
Share on other sites
angelmu88    228

All it involves is just texture masking - not expensive at all. You create several textures with semi-transparent water droplets using the alpha channel (this can probably be done in photoshop) then have their vertical texture coordinates change as a variable of time in the shader code.

 

Is it texture masking enough when it comes to simulate the meandering of the drop? I want it to be as realistic as possible so I don't want the drops to go down following a straight path, in this case, the drop would have to follow this pre-baked random path no?

Share this post


Link to post
Share on other sites
angelmu88    228

 

All it involves is just texture masking - not expensive at all. You create several textures with semi-transparent water droplets using the alpha channel (this can probably be done in photoshop) then have their vertical texture coordinates change as a variable of time in the shader code.

 

Is it texture masking enough when it comes to simulate the meandering of the drop? I want it to be as realistic as possible so I don't want the drops to go down following a straight path, in this case, the drop would have to follow this pre-baked random path no?

 

 

Also if you look at the first video, see how the drops are affected by the movement of the camera

Share this post


Link to post
Share on other sites


Also if you look at the first video, see how the drops are affected by the movement of the camera

 

That's a good point. Originally I was thinking you store movement of the camera in variables for each direction and multiply this by the s-direction texture coordinate, but then that doesn't account for the bending of the drops.

Share this post


Link to post
Share on other sites
Styves    1792

A much better approach than a static scrolling texture, which is likely what's being used here, is using a very simple particle system. Spawn N number of particles and make them slide down the screen with time and some variation (you can just render some quads to the screen and make them move with time). Use some extinction to make the particle fade away after a short period. Once that period is over, spawn a new particle. This way you always have N number of particles, no more, no less.

 

Render this to a buffer using simple vignetting on each particle quad, to get a heightmap of the drops (you can use an ellipsoid shape for the vignette, for a better drop-like look). Then to apply it to the scene, compute a normal from it and use it to displace the screen coordinates when sampling the screen image (same pass).

 

You can vary the amount of slide based on the camera's looking direction, so that it doesn't slide when you look up. You can also do it to hide drops if you're looking down. Another cool thing is you can use some pre-blurred textures for out-of-focus drops (or even merge them into mip-maps for easy lookups).

 

 

This shouldn't take more than a fraction of a millisecond, since the geometry is simple, fillrate is very small and the texture you use for the drops can be quite small. You can also try batching the particles via a vertex buffer and expanding on the GPU to lower the draw call count, if that becomes a problem.

Edited by Styves

Share this post


Link to post
Share on other sites

Looks somewhat similar to the roughly 10 year old "blood shader" sample from the time when "pixel shader 2.0" was considered the newest coolest thing, except of course raindrops aren't blood, i.e. they're colorless, transparent and refracting, less viscuous. And nowadays, the texture would likely be quite a bit larger (probably screen-sized).

Share this post


Link to post
Share on other sites
angelmu88    228

Looks somewhat similar to the roughly 10 year old "blood shader" sample from the time when "pixel shader 2.0" was considered the newest coolest thing, except of course raindrops aren't blood, i.e. they're colorless, transparent and refracting, less viscuous. And nowadays, the texture would likely be quite a bit larger (probably screen-sized).

 

Thank you all for your replies. Actually that blood algorithm is better than it seems. If I modify a bit the physics to take not only into account the gravity but also other forces like the wind and I store the resultant force instead of storing only the gravitational force I think I can get something quite good.

 

Thanks, again.

Share this post


Link to post
Share on other sites
Waterlimon    4398

Hmm...

 

1) A texture to represent the wet and dry areas of the surface. 1 Byte per cell (Amount of water in cell + approx direction of flow)

 

2) Water droplet particles. When the particles travel, they increment the cells touched in the above texture. The droplets choose their velocity using:

    a) Gravity

    b) Any existing water trails left by other droplets on the texture. If a droplet collides with an existing trail, it should move along it (as long as its somewhat in the same direction). If a cell in the trail has a too big value, divide it evenly into the neighboring cells.

 

3) Droplets are only rendered as droplets if they are not moving along a path left by another particle. If they are moving along such a path, make them invisible and simply have them increment the cell values as they go.

 

This has quite a lot of possible parameters that can be adjusted as well as behaviors that could be added (you want to decrement the water in cells over time for example)

Im not sure if this is possible to implement on the GPU efficiently in all aspects.

 

The behavior im looking for:

*Droplets leave trails of water

*Droplets that hit other trails continue along that trail if its parallel and so on

*The trails persist but might change or divide as more water flows along them

 

I guess the first step would be to have droplet particles go along a surface according to gravity, the next step would be them leaving behind trails that slowly disappear, and the third step would be making the droplets interact with the trails.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

Sign in to follow this