Procedural real-time webgl animation showing approximately 10,000 individually animated cubes. All cubes together render a voxel representation of a three-dimensional object.

Initially, each cube is randomly placed in a three-dimensional grid and has a maximum of six directions in which it can move; left, right, up, down, front, and back; see image below. The cubes may not leave the minimum and maximum dimensions of the grid and may not share their position with any other cube.

Based on their current position, the cubes have to find their way to their predefined target position.

The path from the current position to the target position is unknown, which means that it's not animated by hand, but based on a number of ground rules. This kind of computer animation is known as a procedural animation.

As long as a cube has not reached his target position, it has one, two or three preferred directions in which it can move to reach its target position.

If the vertical position differs from the vertical target position – left image – the only preferred direction is vertical. If the position above the current position is not occupied, the cube can be moved upwards, towards the target position.

If the current vertical and horizontal positions differ from the horizontal and vertical target positions – middle image – the number of preferred directions is two. One of these directions is randomly chosen. If the chosen direction is not available – because it's occupied by another cube – the other direction, if available, may be used.

If the current horizontal, vertical and depth positions differ from all of the horizontal, vertical and depth target positions, the cube can be moved in three directions towards the predefined target position. Again, one of these preferred directions is randomly chosen, if the new position to which the cube will be moved is available.

The are sometime no preferred directions available because these are occupied by one of the other cubes. In this case, one of the non-preferred directions is randomly chosen. The cube will move away from the target position for a short time. As soon as a direction towards the target position is available, the cube will move towards the target position.

The described procedure will be repeated until all the cubes have reached their target position. Once all the cubes have reached their target position, a new model will be loaded and the whole procedure will be repeated.