/** * color pallet */ // let pal = ["#555233","#DF921D","#878937","#CFC52A","#DC2A41"]; let pal = ["#d8a47f","#ef8354","#ee4b6a","#df3b57","#0f7173"]; // let pal = ["#160f29","#246a73","#368f8b","#f3dfc1","#ddbea8"]; // let pal = ["#ff6b35","#f7c59f","#efefd0","#004e89","#1a659e"]; // let pal = ["#dbcdc6","#ead7d1","#dd99bb","#7b506f","#1f1a38"]; let seed = 0; let bgColor; let TIME_STEP = 2; function setup() { createCanvas(windowWidth, windowHeight, P2D); // colorMode(HSB, 360, 100, 100, 100); angleMode(DEGREES); background(255); // noLoop(); let cid = int(random(pal.length)); bgColor = pal[cid]; pal.splice(cid, 1); shuffle(pal); background(bgColor); effect(); // noise effect } function draw() { background(bgColor); // clear auto randomSeed(int(second() / TIME_STEP)); let offset = min(width, height) / 10; let siz = min(width, height) - offset * 2; let x_offset = (width - siz) / 2; let y_offset = (height - siz) / 2; let num = 12; for (let j = 0; j < num; j++) { let x = random(x_offset, width / 2); let y = random(y_offset, height / 2); let w = random(width / 8, width / 4); let h = random(width / 8, width / 4); let d = map(j, 0, num - 1, width * 3e-3, width * 1e-2); // let d = random(2, 10); let bGrad = true; drawShape(x, y, w, h, d, bGrad); } // drawWindow(); } function drawShape(x, y, w, h, d, bGrad) { let cx = x + w * random(0.2, 0.8); let cy = y + h * random(0.2, 0.8); let p = [ [x, y], [cx, y], [cx, y + h], [x + w, y + h], [x + w, cy], [x, cy] ]; // shadow stroke(0, 50); strokeWeight(d); noFill(); beginShape(); for (let i = 0; i < p.length; i++) { vertex(p[i][0] + 5, p[i][1] + 5); } endShape(CLOSE); if (!bGrad) { // crossing window stroke(random(pal)); strokeWeight(d); noFill(); beginShape(); for (let i = 0; i < p.length; i++) { vertex(p[i][0], p[i][1]); } endShape(CLOSE); } else { // crossing window drawing by gradation lines let cid = int(random(4)); let c1 = color(pal[cid]); let c2 = color(pal[(cid + 1) % 4]); for (let i = 0; i < cx - x; i++) { let px = x + i; let py = y; let c = c1; noStroke(); fill(c); circle(px, py, d); } for (let i = 0; i < w; i++) { let px = x + i; let py = cy; let c = lerpColor(c1, c2, map(py, y, y + h, 0, 1)); noStroke(); fill(c); circle(px, py, d); } for (let i = 0; i < w - (cx - x); i++) { let px = cx + i; let py = y + h; let c = c2; noStroke(); fill(c); circle(px, py, d); } for (let i = 0; i < cy - y; i++) { let px = x; let py = y + i; let c = lerpColor(c1, c2, map(py, y, y + h, 0, 1)); noStroke(); fill(c); circle(px, py, d); } for (let i = 0; i < h; i++) { let px = cx; let py = y + i; let c = lerpColor(c1, c2, map(py, y, y + h, 0, 1)); noStroke(); fill(c); circle(px, py, d); } for (let i = 0; i < h - (cy - y); i++) { let px = x + w; let py = cy + i; let c = lerpColor(c1, c2, map(py, y, y + h, 0, 1)); noStroke(); fill(c); circle(px, py, d); } } } function effect() { strokeWeight(1); for (let i = 0; i < width * height * 5 / 100; i++) { stroke(0, 0, 0, 10); let px = random(width); let py = random(height); point(px, py); } } function drawWindow() { noStroke(); fill(255); rect(0, 0, width, 20); rect(0, height - 20, width, 20); rect(0, 0, 20, height); rect(width - 20, 0, 20, height); }

Digital dream circuit