Algorithmic Art: Infinite Boxes

Continuing the series on algorithmic art, this shader takes the raymarching technique further by introducing infinite tiling and procedurally animated geometry. Instead of rendering a single scene, the world is repeated endlessly using modular arithmetic, creating a vast field of boxes stretching in every direction.

The camera sweeps through the scene on a sinusoidal path, giving the viewer a sense of flying over an ocean of pulsing cubes. Each box's height is driven by a function of its grid position and time, producing a wave-like animation across the entire field.

The key trick for the infinite grid is the map function. It uses mod to fold space back on itself, so that any point in 3D space maps to a local position within a single repeating cell:

float map(vec3 p)
{
	float grid = 1.5;
	float grid_half = grid*0.5;
	vec3 side = vec3(0.6);
	float h = heigth(p.xz, grid);

	float plane = sdPlane(vec3(0.0, 300.0, 0.0) + p, normalize(vec4(0.0, 1.0, 0.0, 1.0)));
	p.xz = mod(p.xz, vec2(grid)) - vec2(grid_half);
	float c1 = udBox(p, side - vec3(0,h,0));
	return min(c1, abs(plane));
}

The height of each box is determined by its integer grid coordinates i and j, combined with time. The nested sin calls create a chaotic yet smooth oscillation:

float heigth(vec2 p, float grid) {
	float i = ceil(p.x/grid);
	float j = ceil(p.y/grid);
	float h = sin(sin(i*j+i+j+time))*.1;
	return h;
}

Lighting is computed from the surface normal using the gradient of the distance field, then combined with two separate color passes that modulate the warm golden tones you see in the final image.

© 2025 Jaksa Vuckovic. Built with SvelteKit