210324b

let url = [

  // "https://coolors.co/e63946-f1faee-a8dadc-457b9d-1d3557",

  "https://coolors.co/fec5bb-fcd5ce-fae1dd-f8edeb-e8e8e4-d8e2dc-ece4db-ffe5d9-ffd7ba-fec89a",

  // "https://coolors.co/8ecae6-219ebc-023047-ffb703-fb8500",

];

let palette;

​

function setup() {

  createCanvas(800, 800, WEBGL);

  angleMode(DEGREES);

​

  ortho(-width / 2, width / 2,

    -height / 2, height / 2,

    -1000, 1000);

​

  palette = createPalette(random(url));

}

​

function draw() {

  background(0);

​

  orbitControl();

  randomSeed(frameCount/200);

  directionalLight(color(100), 0, 0, -1);

  // rotateX(frameCount/10);

  rotateY(frameCount/20);

  // rotateZ(frameCount/20);

​

​

  scale(0.65);

  translate(-width / 2, -height / 2, 0);

​

  let offset = width / 10;

  let xMin = offset;

  let xMax = width - offset;

  let xMid = width / 2;

  let yMin = offset;

  let yMax = height - offset;

​

​

  for (let i = 0; i < 10; i++) {

    let z = map(i, 0, 10 - 1, -100, 100);

​

    let x, y, xStep, yStep;

    y = yMin;

    while (y < yMax) {

      yStep = random((yMax - yMin) / 40, (yMax - yMin) / 3);

      if (y + yStep > yMax || yMax - (y + yStep) < (yMax - yMin) / 20) yStep = yMax - y;

      x = xMin;

      while (x < xMid) {

        let c = random(palette);

        xStep = random((xMax - xMin) / 40, (xMax - xMin) / 2);

​

        let sx = random(60);

        let sy = random(60);

​

        let angle = random(90, 270);

        let counter_angle = angle > 180 ? angle + abs(270 - angle) * 2 : angle - abs(angle - 90) * 2;

​

        if (x + xStep > xMid || xMid - (x + xStep) < (xMax - xMin) / 10) xStep = xMid - x;

        push();

        translate(x + xStep / 2, y + yStep / 2, z);

        rotateX(angle);

        rotateY(counter_angle);

        // scale(0.85);

        fill(c);

        // stroke(0, 0, 0);

        noStroke();

        shearX(sx);

        shearY(sy);

        specularMaterial(c);

        ellipsoid(xStep / 2, yStep / 2, 50);

        pop();

​

        push();

        translate(xMax + xMin - x - xStep / 2, y + yStep / 2, z);

        scale(-1, 1, 1);

        rotateX(angle);

        rotateY(counter_angle);

        shearX(sx);

        shearY(sy);

        // stroke(0, 0, 0);

        noStroke();

        specularMaterial(c);

        ellipsoid(xStep / 2, yStep / 2, 50);

        pop();

        x += xStep;

      }

      y += yStep;

    }

  }

  // save();

  // noLoop();

}

​

function createPalette(_url) {

  let slash_index = _url.lastIndexOf('/');

  let pallate_str = _url.slice(slash_index + 1);

  let arr = pallate_str.split('-');

  for (let i = 0; i < arr.length; i++) {

    arr[i] = color('#' + arr[i]);

  }

  return arr;

}