Stacked Sines

2025-09-13

Sterk Hvalros creates a lot of art around the ideas of ripples and waves, and documents his process of making these pieces.

Watching them, I wanted to experiment with some procedural generation along those lines.

I thought about and tried some ways of representing and propagating perturbations like in the video, and my eventual idea was to generate pieces of sine waves for each horizontal line, and to “dampen” them to generate their ripple effects on all other lines.

Sine waves make this pretty nice, mathematically. If you have a function of y(x) = amplitude * sin((x - start) / width), you can vary the amplitude and width parameters to control the size.

⁂

Then, the idea is that you generate a set of such sine perturbations at random lines and at random starting positions, and add their effect (y(x)) to each line, dampened by how far the line being rendered is from the origin line of that perturbation.

For each stage of dampening, reduce the amplitude by a constant, increase the width by 2 units, and decrease the start position by π units.​ (The choice to increase width by 2 units is arbitrary.)  ​ (Still, whatever our choice for the increase in width, we can calculate the corresponding decrease in starting coordinate which will keep the peaks aligned by equating (x-s)/w and (x-s')/w' both to π/2.)  That lets it spread out while still being on-center.

⁂

Thus far this looks simplistic, but when adding multiple randomly-generated sines to one image, the effect is cool.