Iterations
A generative design system is not developed as a whole in one coding session, nor does it happen overnight. It needs to be taken care of in small steps, because each time we try to run a code, it might not work as previously seen. Each step is a new exploration of a previous step. In the context of computation, this is called an iteration. Basically speaking, the process of repeating a mathematical or computing process or set of instructions again and again, each time applying it to the result of the previous stage. Due to its nature, the process of iterating is closely intertwined with trial & error.
Nesting parameters
When iterating, we might start adding more parameters to our transformation. If we take the previous grid and nest the parameter density and the parameter displacement with each other, we get an even greater number of possible results. In the following example, the parameters density has not only been divided into two dimensions but also combined with the parameter displacement to create a new iteration of the grid transformation.
var diameter = 50;
var densX = 1.5;
var densY = 0.8
function setup() {
createCanvas(600, 600);
background(0);
var margin = diameter;
for (var y = margin; y < width - margin; y +=diameter*densX){
for (var x = margin; x < height - margin; x +=diameter*densY) {
var disp = 10;
ellipse(random(x - disp, x + disp), random(y - disp, y + disp), diameter);
}
}
}