HN Theater @HNTheaterMonth

Part 6 is live coding rain drops on glass in ShaderToy.

ShaderToy LiveCoding - The Drive Home - 6. Rain on a Windshield

https://www.youtube.com/watch?v=52TMliAWocY

⬐ dahart

I just love the feel of this shader, it's not as complicated as some of the other nutty shaders you can find on ShaderToy, but it does a lot with a little and has such a nice chill vibe, especially with the music.

When I first saw it, I thought the raindrops must be pretty expensive, but the video shows how cheap they are to compute. There's a nice tiling trick so that the shader only evaluates one drop per pixel, but the tiling grid is moving so it's harder to see where the bounds are.

He's also using the Desmos math webapp to design some of the functions, which is a great reminder for me, I keep forgetting about it, and I need a good function plotter handy when I'm working on shaders.

⬐ Scene_Cast2

I also like Shadron, it has quite a bit more capability (being able to use your own textures is pretty important! I can actually get work done with Shadron, can't do that reasonably with shadertoy). The downsides are the small community size and no automatic sharing / GitHub / OSS integration.

Other features include UI sliders, image saving, pretty decent library, unlimited flexible layers, way easier debugging, and lots more. I'm a huge fan, I'd love for more people to use it too.

⬐ erikpukinskis

I don’t fully understand the code but this appears to be a very brute force way of doing it, which slows down as you add more raindrops, pixels, and lights.

I suspect you could do the same with signed distance fields in a way that runs in constant time irrespective of the number of drops at least.

You could also then scale and distort the car lights and add as many as you like without affecting performance either.

⬐ ttoinou

It's already constant time but he calls the function twice in order to have big bubbles and little bubbles overlapped

⬐ erikpukinskis

Aren't the bubbles in a vector?

⬐ ttoinou

Like an array ? No they aren't. He creates a grid of bubbles and displaces that grid

⬐ pavel_lishin

I'd love to see this as a screensaver.

⬐ johansch

Intrigued by this I visited https://www.shadertoy.com/. There does seem to be a thriving community there.

Problem is, the browse pages have a 4x3 grid of live WebGL previews (rather than e.g. static images) of the shadertoys.

On my home desktop pc (win10, i4790k@4Ghz, GTX1070, 24 GB) running Chrome this means that inevitably, on page one or two, at least one of the shadertoys will use so much GPU computation that it starves out all other functionality, like being able to switch tabs etc.

⬐ adamnemecek

I think that you can opt for image previews if you create an account. It’s in the options (maybe). The feature is there, I just don’t remember where.

⬐ johansch

If that's true, wow, that's some hostility towards newcomers.

⬐ adamnemecek

It’s a side project.

⬐ johansch

Maybe changing the default would be a good idea? Just a thought :)

⬐ None

None

⬐ antoineMoPa

I'm trying to code shadergif https://shadergif.com to fix this but of course, the only community I have yet is "me" and I don't have all shadertoy features. I render gifs and preview videos to avoid spamming GPUs.

The code is open source so anyone who wants new features can actually code it (after all, it's a coder community, why not let it code the tool that shadertoy is).

⬐ aphextron

This is great, how are you doing the GIF rendering?

⬐ antoineMoPa

With a client side library (gifjs). I might switch to video for a better quality though.

⬐ None

None

⬐ gfody

if you sign in, there's a 'use previews' option in config that will replace the live previews with thumbnails

⬐ aphextron

I've tried to bring this point up in the past as well. All they would need to do is add an MP4 rendering job to replace those with video. Although the transcoding would be quite expensive, I'm sure IQ could set up a donation system.

⬐ johansch

Using Firefox instead seems to help. Loading the grid pages is still super slow and rendering is broken, but at least you can use the rest of the browser/other tabs.

⬐ dahart

It is on the roadmap https://trello.com/b/5hM0CjId/shadertoycom-roadmap

And there is a donation system in place https://www.patreon.com/shadertoy

⬐ johansch

I don't think this project needs more money; they need people who give a shit. (There's a setting that makes the site functional, but you have to register to get to it? What?)

⬐ dahart

I'm not affiliated with ShaderToy, though I love it. Would you mind clarifying all three of those points? What does giving a shit mean, do they need volunteers to work on the site? And are you sure they don't need money? $700 / month isn't much; having run a lower profile website myself, I'd be surprised if $700 even covers server costs, and it definitely doesn't pay anyone for their time. And what is this setting that makes the site functional? I want that.

⬐ johansch

I think the technical wtf should become clear if you look at the entire comment tree starting at: https://news.ycombinator.com/item?id=16041209

But yeah, to clarify: What they primarily need is someone who gives a shit about the site being functional, secondarily money to cover operating costs. Before the first need is covered, just blindly giving some loose group money seems like it would have a high potential of going to waste.

⬐ dahart

You just convinced me to donate. ;) ShaderToy is free. I'll have to donate for a while just to cover the value I've already gotten from it, and it is a gold mine of share & remix techniques. It seems a bit cynical to call donating to ShaderToy "blindly giving some loose group money", and to just assume the money would be wasted. Since ShaderToy exists, and since it is pretty awesome, and since I know who made it, and since they have a Patreon account asking for money, I assume it will be used towards making more of the awesomeness they already made, improving the experience of the site, and I assume the money won't go to waste, the potential for that seems fairly low to me. Anyway, if it's not your thing, definitely don't use it and don't donate. But do have a happy new year, Cheers!

⬐ None

None

⬐ adamnemecek

TLDR shaders are lo-to-the-co

⬐ MichailP

Is there a blazingly fast library for ray object intersection? Ideally usable from python? As I understand, ShaderToy uses implicit object description, and calculates ray object intersection numerically. It is somewhat of a abuse of OpenGL, since a scene in ShaderToy only has 2 triangles covering the screen, and the rest is calculated using pixel shader which calculates ray object intersections. I would like to have result of this intermediate calculation (point of ray object intersection).

⬐ boulos

There's Embree, but I don't know (or think) they would have thought to make Python bindings. I'm not sure how fast Mitsuba is, but since Wenzel wrote his own C++ to Python wrapper I'd wager that there are Python bindings for that.

What's your use case?

⬐ MichailP

I want to make simple FDTD mesher, maybe with non rectangular grid. For this I would need ray-object intersections and point to object shortest distance. Thanks for pointing out Embree, I was not familiar with that library.

⬐ gmueckl

I have to second the mention of Embree. Intel poured several man years of optimization into this code. As long as you are fine with being restricted to x86 platforms, you won't find faster open source code for general ray/triangle intersection.

⬐ cma

Unreal Engine 4 uses Embree in its lightmass static lighting builds. They got a big speedup from moving to it.

⬐ 127

I don't know if you can consider it blazingly fast, but Blender has ray intersections from Python, and IIRC it was fast enough to make a 256x256x256 voxel grid in a couple of seconds with raycasts.

⬐ dahart

NVidia's Optix has very fast ray-object intersection via GPU. I don't think there are python bindings though, it's C++ and CUDA.

ShaderToy doesn't come with object descriptions, nor with any specific intersection routines. This is just arbitrary glsl (GPU) code that people are doing cool tricks with. You can do regular ray tracing in ShaderToy, for example here's one of mine ray tracing (not ray marching) spheres: https://www.shadertoy.com/view/XllBRf

You don't get a BVH with ShaderToy, unless you manually write something clever yourself. You need a BVH to make blazingly fast ray object intersections, in general.

That said, it's worth understanding the ray marching algorithm that many folks on ShaderToy are using, because it's very very fast, if you can accept the limitations it comes with, and it does give you the hit location in space.

⬐ andybak

To save others from looking it up:

BVH = https://en.wikipedia.org/wiki/Bounding_volume_hierarchy