Unity Water Drain Vertex Animation Shadergraph

This shader work came about accidentally as I was building scenery assets for this Labyrinth test environment. I noticed my walls were not vertically plumb or straight at all and that the asset should not rely on the environment being limited, instead I built a simple vertex animation shader for the main drain gate body that playfully swings the gate back and forth while rocking the gate pin around also. The water shader was more involved, matching the ripples and waves to the swinging gates was done using the same sine waves for both shaders (these in hindsight should have been a shader sub graph), some simple world space stretching and transformation matrix rotations to make the water hit the floor regardless of positon and rotation on a wall was added also.

It's still a very stylised piece and the imperfections do benefit from that but it was a very satisfying asset and shader set to make, I would like to update the shaders to be randomised by position as currently any copies of the asset do animate at the same times.

Modelling was done in 3DS Max and ZBrush, Unwrapping in Rizom UV, Baking was done in both Marmoset Toolbag and Substance Painter (just to see their results) and texturing was done in Substance Painter.

Asset set up and shaders were made in Unity Shadergraph in URP, this works nicely in Mobile VR which the test project is aimed at.

Many thanks for reading and I hope you've enjoyed my work.

Short capture showing the drain and water shaders working in the scene at different heights and rotations.

Short capture showing the drain and water shaders working together on the final asset.

Capture showing the stretching effect of the water shader working allowing users to place the drain higher or lower on a wall knowing the water will always hit the ground.

Capture showing the rotation bending effect of the water shader, letting the asset be placed on a wall that is not vertically plumb and the water will within reason rotate to align with the ground.

Capture showing how the water and drain shaders animate in time with one another, the water and gate look believable with neither clipping through or animations mismatched.

Another capture showing the water and drain from the side.

Capture showing the water drain gate pin slowly rotating back and forth towards a full rotation as though the swinging of the gate might unwind the pin.

Low and high poly meshes exploded into their constituent parts for the water drain. I apologise for the topology, I did not aim for an incredible asset, more a good base to make the shaders with.

Vertex Colours Red and Green were used to mask rotations in the shader for the Gate and Pin.

The Water mesh used all RGBA Vertex Colour channels, Red was used for stretchign and rotating the base to always touch the floor, a combination of RGBA was used for the water ripple/wave effects and A was also used for opacity.

Fragment shader set up for the Drain Cover, a simple enough 3 texture PBR set up, it likely could have been packed down to 2 textures.

The first vertex shader effect used to swing the gate cover on the drain as though the water was pushing it open as the flow came through in waves.

The second vertex shader effect rotated the gate pin back and forth as the gate swung open and shut, however it gently processed in a full 360 so the movement was not repetitive.

Fragment shader set up for the drain water, there's not much other than vertex colour channel A used for Opacity and tiling UVs for the packed water texture that included normals and a grayscale mask for the water colour.

The first vertex shader effect drags the mesh down to touch the floor (or World 0 on the Y axis). It's masked by the vertex colour red channel so the top will follow the object pivot as it's moved but the base will stick to the ground.

The second vertex shader effect rotates the mesh to align with the ground if the asset needs to be rotated (within reason) to fit to an unlevel wall.

The final vertex shader effect matches the water ripples and waves to the rotations on the drain door so it looks like the water and gate are affecting one another and no mismatched movements.

Still from Substance Painter.