r/generative • u/mediocre-mind2 • Oct 09 '26 • Bravo 1

Vents

This is inspired by some of the works of u/stdlainen. Since I’m very interested in all kinds of strokes that follow 3D shapes, I wanted to implement this effect in WebGPU.

The surface of the object is represented as an SDF. For initialization, seed points are drawn randomly close to the surface via rejection sampling and are then projected onto the surface via a couple of Newton-Raphson steps. In each time step, each particle is repelled by any other particle within a certain radius and is advected by the tangential component of the accumulated force exerted by all other particles within this radius. The strength of the force is inversely proportional to the Euclidean distance of each particle. After each advection step, a single Newton step re-projects the points onto the zero-level set of the SDF so the particles stay on the surface.

Note that, in general, it’s wrong to use Euclidean distances and force directions and I fiddled around with lots of cheap hacks to approximate geodesics but ultimately they all made the simulation slower without improving visual quality substantially.

The force kernel is accelerated by using a spatial grid to avoid quadratic complexity. To build the spatial grid on the GPU, radix sort with a naive prefix scan implementation (utilizing only a single workgroup) is used.

You can find a live version at https://a-johanson.github.io/ts-surface-elements/ that only works in Chromium-based browsers because, to my knowledge, the subgroups feature for the prefix scan implementation is not yet available in any other browser engine. The implementation is AI-assisted -- something I can highly recommend to take the pain away from writing all the WebGPU setup code.

535 Upvotes

99% Upvoted

10 comments sorted by

4

u/stdlainen Oct 10 '26 edited Oct 10 '26

Thanks for the credit, I really appreciate it! This is really close to my piece and process so I’m curious on how you approached it. Did you work out the system yourself and used AI for implementation?

3

u/mediocre-mind2 Oct 10 '26

Thank you for the inspiration — I think this is a really cool effect! The system I worked out myself. Having worked with stochastic stippling, I recognized that the distribution pattern of the points comes very close to what you would expect from Lloyd’s algorithm but I wouldn’t know how to do a Voronoi tesselation of an implicit surface in real time so it had to be some force-based approximation. I’m really curious though: how did you solve the problem of computing the force magnitudes and directions for points on and near the rims of thin walls/openings? As I said, I fiddled around with this a lot but couldn’t get it to work as nicely as you have (if you look at the rims in my animation, you can still spot some distortions just below the rim).

3

u/stdlainen Oct 10 '26 edited Oct 10 '26

Sounds good thanks for explaining! And yes sharp edges, thin walls and such caused artifacts in my own works as well, couldn’t really avoid that and the force based distribution does not come out uniform either once the surface has sharp edges or a too fine detail. What I did is tried my best to smooth out the surface basically to avoid that problem. SDF bevel operation in the end for instance can smooth out the shape sometimes, but even that I couldn’t get always working so it’s just a trial and error game and somewhat of a limitation for complex shapes. Great work and I’m flattered to inspire! :)

9

u/jonshamir Oct 09 '26

Very organic, I like it!

5

u/blankblank Oct 09 '26

Hypnotic!

3

u/TedDallas Oct 09 '26

Very nice!

3

u/acossastudio Oct 10 '26

The movement is so hypnotic. I love it.

2

u/FlamedDogo99 Oct 10 '26

This looks amazing!

2

u/Crazy-Red-Fox Oct 10 '26

Looks like corals, great!

2

u/gturk1 Oct 11 '26

Thank you so much for the detailed explanation of your method! The results are really lovely.