Hacker News new | ask | show | jobs
by haxiomic 2147 days ago
Hey, I feel bad for not updating this demo in 6 years! Back then it wouldn't run on iOS, today it could run with no trouble

For people on iOS, here's another version with rainbow colors and multi-touch https://haxiomic.github.io/demos/rainbow-fluid/index.html

If you like this sort of thing and want to learn more about it I recommend checking out https://www.shadertoy.com/ for more demos and https://thebookofshaders.com/ for tutorials

And if GPU simulations is your thing then I think you'll enjoy what these two amazing guys are doing with shaders:

- https://www.shadertoy.com/user/michael0884

- https://www.shadertoy.com/user/wyatt

3 comments

FWIW the rainbow link gives this console error in Firefox on a Surface Book with Intel graphics:

    Uncaught TypeError: rgHalfFloatLinear is null
I assume that means it doesn't support 16-bit float pixel formats; maybe this is something that could be detected and shown as an error message in the page?

The original HN link works great, though, very cool!

Ahh that's a shame, yeah looks like 16-bit float textures aren't supported but 32 bit are. Thanks for the heads up – I should really be checking if either are supported here!
This is beautiful. Can you say how this is different from [0] if at all in terms of implementation?

[0] https://paveldogreat.github.io/WebGL-Fluid-Simulation/

Similar implementation from a physics perspective – Pavel uses the same technique for simulating Navier–Stokes (Jo Stam Real-Time Fluid Dynamics for Games [0]). Pavel's has an extra step to enhance vorticity which gives you those higher detail swirls and uses a slightly different approach for input

The big difference is in the rendering however, Pavel has added light shafts and bloom which are really neat effects. Additionally, he actually got round to publishing a native app which I think has been great for him!

[0] https://pdfs.semanticscholar.org/847f/819a4ea14bd789aca8bc88...

The iOS demo is amazing and I’m shocked no one is saying so! Thanks for making it.

Is the code up anywhere?

Hey :), full code isn't up yet but I can share the color pattern:

http://thebookofshaders.com/edit.php?log=200806194314

The technique is called "sine puke", and it works by starting with a gradient (in this case a rainbow) and warping the domain when drawing that gradient by sine functions repeatedly (check the for loop)

In the fluid demo I blend new frames with the previous so you get this slower, softer pattern