/* Inspired by works from Frieder Nake's Matrix Multiplication Series */ //cell let cellSize; let sign; let seed = 2; //CENTER & angle function setup() { createCanvas(windowWidth, windowHeight); rectMode(CENTER); angleMode(DEGREES); noFill(); stroke(0); strokeWeight(2); } // 1/10, repeat for 10 times function draw() { background(255); randomSeed(seed); cellSize = min(width / 10, height / 10); //CENTER, affect start poiot for (let x = cellSize / 2; x < width; x += cellSize) { for (let y = cellSize / 2; y < height; y += cellSize) { push(); //translate the location, rather use xy in square! translate(x, y); //create 2 situation , half-half let chance = random(1); if (chance < 0.5) { sign = 1; } else { sign = -1; } //rotate +-60 degree let angle = random(0, -60 * sign); rotate(angle); //when the square rotate-degree size will be a little smaller if (angle < 0) { square(0, 0, cellSize * random(0.5, 1)); } else { square(0, 0, cellSize); } pop(); } } } function mousePressed() { seed = random(50000); } function windowResized() { resizeCanvas(windowWidth, windowHeight); }
Preview:
downloadDownload PNG
downloadDownload JPEG
downloadDownload SVG
Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!
Click to optimize width for Twitter