Algorithmic Ornamentation

Studies in algorithmically generated visual structures inspired by flow, field, and symmetry

Year : 2025
Author : Chan Yen Fen
Medium : JavaScript(P5JS)



This is a computer-generated drawing algorithm inspired by Rafael Araujo’s meticulous geometric compositions, which he constructs using only a compass and straightedge. The algorithm pays homage to the precision and elegance of hand-drawn geometry through code.

Through noise and manipulation of the planar field, delicate strokes—like those of a light pencil—layer continuously. The uneven weight and density of lines gradually evoke a sense of three-dimensional depth. Unlike Rafael Araujo, who achieves geometric precision through countless compass-and-ruler lines, this algorithm operates with a fixed logic but ever-changing parameters, embracing controlled randomness as its drawing principle.

Sample code is shown below, or…

create your own generative sketch by clicking here.

// ---------------------------
// Flow Field Function
// This generative drawing system uses tileable Perlin noise to produce a flow field, 
// which guides particles in radial symmetry. 
// The motion is visualized via mirrored trail rendering, 
// inspired by traditional ornamental forms but generated algorithmically.

function updateFlowField() {
  let yoff = 0;
  for (let y = 0; y < rows; y++) {
    for (let x = 0; x < cols; x++) {
      let idx = x + y * cols;
      let bias = (x - cols/2) * 0.05;
      let angle = noise(x, y, zoff) * TWO_PI * 3 + bias;
      flowfield[idx] = p5.Vector.fromAngle(angle).setMag(0.5);
    }
    yoff += 0.5;
  }
  zoff += 0.001;
}