var pal = ['#20222f','#20222f','#20222f','#1a1f56','#2c1e7d','#0134aa','#0060e8','#0297fb','#00befa','#83def3','#d1ecf7','#f2f6f9','#f2f6f9','#f2f6f9','#fce503','#fe6d02','#e7011d','#4b0f31']; var gray_pal = ['#080808','#181818','#383838','#404040','#505050','#696969','#787878','#989898','#B0B0B0','#C8C8C8','#D3D3D3','#E8E8E8','#F5F5F5','#FFFFFF']; var x_offset, y_offset, scale; function setup() { createCanvas(windowWidth, windowHeight); rectMode(CENTER); ellipseMode(CENTER); textAlign(CENTER); noStroke(); noLoop(); textFont("Comfortaa"); textSize(20); drawingContext.shadowBlur = 10; drawingContext.shadowOffsetY = 2; drawingContext.shadowColor = "#000000"; x_offset = width * 0.12; y_offset = height * 0.1; scale = 18; } function mouseClicked() { clear(); redraw(); } function draw() { background(240, 245, 250); let startXArr = []; let startYArr = []; for (let x = x_offset; x <= width - x_offset; x += scale) { append(startXArr, x); } for (let y = y_offset * 4; y <= height - y_offset * 4; y += scale) { append(startYArr, y); } grain(5000); let palette = pal; for (let i in startXArr) { let startY = y_offset + scale * int(random(-2, 2)); let num = int(random(scale * 1.5, scale * 1.8)); let offset = int(i % palette.length); let offsetRnd = random(); if (offsetRnd < 0.7) { offset += int(random(-2, 2)); } else if(offsetRnd < 0.9) { offset = 0; } drawGradBar(startXArr[i], startY, num, offset, palette); } palette = gray_pal; let HorizontalBar_num = random(4, 8); for (let i = 0; i < HorizontalBar_num; i++) { let sX = startXArr[int(random(0, startXArr.length * 3 / 5))]; let sY = startYArr[int(random(0, startYArr.length))]; drawGrayBar(sX, sY, int(random(8, 12)), palette); } fill(10); text("■ Inspired by Felipe Pantone", width / 2, height * 16 / 17); } function drawGradBar(_x, _startY, _num, _offset, _pal) { let y = _startY; let idx = _offset; for (let i = 0; i < _num; i++) { y = _startY + i * scale; if (idx < _pal.length - 1) { idx += 1; } else { idx = 0; } let cd = _pal[idx]; fill(cd); if(random() < 0.98) { rect(_x, y, scale, scale); } else { push(); translate(_x, y); rotate(45); rect(0, 0, scale, scale); pop(); } } } function drawGrayBar(_startX, _y, _num, _pal) { let x = _startX; let idx = 0; for (let i = 0; i < _num; i++) { x = _startX + i * scale; if (idx < _pal.length - 1) { idx += 1; } else { idx = 0; } let cd = _pal[idx]; fill(cd); rect(x, _y, scale, scale); } } function grain(_n) { for (let i = 0; i < _n; i++) { let c = color(random(30, 50), 30); let x = random(1) * width; let y = random(1) * height; let w = random(5, 50); let h = random(1); noStroke(); fill(c); ellipse(x, y, w, h); } }

週刊p5js - 11