Waterfall Shader 2D Test

 

This was a 2D shader writing job test I did in Unity, with some restrictions: only 4 texture samples allowed, and nothing allowed apart from 1 quad and 1 shader.

I enjoyed the challenge of copying the reference as closely as I could using just maths and a few texture samples for the streaks and bubbly bits.

The main waterfall shape is done with a 2d distance field for a box. There are lots of sine waves modifying the shape, and I used smoothstep a lot to get smooth edges (no aliasing here!).

The foam at the bottom was done very late and I felt a bit guilty about adding an expensive solution, so I found a cheap way of expanding the bottom part, but the visual quality is not as nice as I would like.

I found getting the streaks right, with the subtle colour variations particularly challenging. I added a variety of subtle perspective effects to make it seem like the water came over the top towards you and down, and sped up towards the bottom of the waterfall.

The “particles” droplets are done in a for loop in the shader with a modified heart shape I figured out in Shadertoy. There are only 10 particles in the loop, but the input space is mirrored and copied so there can be up to 40 visible, but each one has a random seed giving it slightly different rotations and scales.

I created the texture in Houdini, which let me generate tiling bubbles and streaks geometry with the GameDevTools Mesh Tiler, which I put into a heightfield, then into COPs for channel packing. I also generated tilable noise in COPs.

Obviously the result does not perfectly match the reference, particularly with the depth of colours in the water, but that would have probably required more than 4 texture samples.

Art Compilation Gallery

I was asked to put together some art for an interview, so trawled through the last couple of years and picked some bits and pieces. I’ll try and keep this page updated with sketches and paintings in the future.