Hi, I'm the author of the rain effect (not of the website itself though).
You can see the original effect here[1], along with an explanation here[2].
If you like it, you can see a few more effects and experiments on my portfolio here[3], although it's been a couple of years now since I've done anything of the sort (that I can post publicly, that is).
Is the submission actually adding anything of substance to your work then? It seems basically the same but with a background image, and parameterisation sliders (that I can't get to work anyway).
I have a somewhat unrelated question. Do you ever see the world moving to rendering content completely on a WebGL canvas, for better control and with the ability to circumvent ad blockers?
Hmmm I'm not sure if it could be properly used to circumvent ad blocking, after all the ads will still probably come from a separate request which one could block.
However I do see it being used for web apps that prioritise performance--in terms of providing a smooth experience, rather than load times. I think Figma already does that (through emscripten or wasm, I'm not sure); for it to be more widespread, only the tooling has to catch up (e.g. React Native).
There's no good reason, to my shame. But now that you mention, I think I'll get around to it and do it this week. Might be a good opportunity to round down a few rough edges here and there as well.
The drops flicker in OSX Chrome 84 for me. Works in other browsers.
Not surprising though. This 2017 Macbook Pro's integrated gfx (Intel Iris Plus Graphics 640 1536 MB) seems incapable of rendering any 3D games after 2010 without flickering at some point. It's one reason I'm still playing Morrowind (2002).
It _is_ really weird, that didn't use to happen either. Started happening after some update of either Chrome or macOS, I'm not certain which.
In fact I think this is one of the most frustrating things of working with WebGL (or any of those slightly less common browser APIs, really), lots of small weird compatibility issues and instabilities.
Not sure if it is the original but the source where I first saw this rain effect was on ShaderToy - The Drive Home by Martijn Steinrucken aka BigWings[1]
The accompanying video tutorial[2] is super interesting too as well as the HN discussion at the time [3].
It has already been posted by jeffschofield, but the original is here[1], along with a brief article breaking down the effect[2].
The one you posted is in many ways nicer though due to it all being a single shader, however it has the downside of the drops not interacting with each other.
Hahha i was like. This is the "drive home"
Martijn is an exceptional explainer I like his channel a lot. A great resource if you want to start programming shaders.
Toggling the options seems to add records to the browser history, which means it takes a bunch of taps on the back button in safari to get out of the app. Otherwise, really cool!
Lovely effect! Particularly enjoyed how it seems to 'fake' refraction by sampling higher or lower from the background based on the drop shape. The trails squishing back into raindrops to simulate surface tension is also a pretty nice touch, though perhaps a bit over-exaggerated.
One caveat is the merging of the drops sometimes looks quite unnatural, but I'm not sure there's any simple way to represent that as just a couple of textures and a transformation, as real drops would have attractive forces on a molecular level pulling them towards one another once they're bridged, deforming pretty unevenly.
This reminded me of the different site I liked so much: https://1976design.com/. On the top there is header which used to reflect the real weather conditions outside. It is no longer functional, but you can read some about it in the colophon: https://1976design.com/blog/colophon/
Man that's crazy, trying to figure out how you make something look like glass/water. Also moving your mouse around on desktop gives it added feel of depth/realism the pane of glass.
Pretty cool!. Only one glitchy part, the bottom of the screen seems to have a few drops that appear and disappear at random, that's the only thing that took me out of the realism.
neat! I particularly love the visual appeal of night mode - reminds me of "Night" scenes in old movies where you still could see shadows and sunlit surfaces because of daylight filming: https://en.wikipedia.org/wiki/Day_for_night
You can see the original effect here[1], along with an explanation here[2].
If you like it, you can see a few more effects and experiments on my portfolio here[3], although it's been a couple of years now since I've done anything of the sort (that I can post publicly, that is).
[1] https://tympanus.net/Development/RainEffect/
[2] https://tympanus.net/codrops/2015/11/04/rain-water-effect-ex...
[3] http://lbebber.github.io/