Scribble_231016

// by SamuelYAN

// more works //

// https://twitter.com/SamuelAnn0924

// https://www.instagram.com/samuel_yan_1990/

​

​

let mySize, margin;

let seed = Math.random() * 99999;

let colors1 = "fef9fb-fafdff-fcfbf4-f9f8f6".split("-").map((a) => "#" + a);

let colors2;

let colors3;

let colors_tone1 = "D9751E-D94D1A-F2BF27-F2D027-D99B29".split("-").map((a) => "#" + a);

let colors_tone2 = "03258C-034AA6-0468BF-0477BF-0378A6".split("-").map((a) => "#" + a);

let colors_tone3 = "141F40-085933-05401F-277332-808C23".split("-").map((a) => "#" + a);

let newTone01 = "FF9494-FFD1D1-FFE3E1-FFF5E4".split("-").map((a) => "#" + a);

let newTone02 = "967E76-D7C0AE-EEE3CB-B7C4CF".split("-").map((a) => "#" + a);

let newTone03 = "EEF1FF-D2DAFF-AAC4FF-B1B2FF".split("-").map((a) => "#" + a);

let newTone04 = "E38B29-F1A661-FFD8A9-FDEEDC".split("-").map((a) => "#" + a);

let newTone05 = "FFC3A1-F0997D-D3756B-A75D5D".split("-").map((a) => "#" + a);

let newTone06 = "374259-545B77-5C8984-F2D8D8".split("-").map((a) => "#" + a);

let newTone07 = "675D50-ABC4AA-F3DEBA-A9907E".split("-").map((a) => "#" + a);

let newTone08 = "F5F5F5-E8E2E2-F99417-5D3891".split("-").map((a) => "#" + a);

let newTone09 = "EAE0DA-F7F5EB-A0C3D2-EAC7C7".split("-").map((a) => "#" + a);

let newTone10 = "FFED00-16FF00-0F6292-202020".split("-").map((a) => "#" + a);

let newTone11 = "82954B-BABD42-EFD345-FFEF82".split("-").map((a) => "#" + a);

let newTone12 = "146C94-19A7CE-B0DAFF-FEFF86".split("-").map((a) => "#" + a);

​

​

let colorset = [];

let color_shadow = "D99B29-095225-090f52-fef9fb-fafdff-fcfbf4-f9f8f6".split("-").map((a) => "#" + a); // dark

let filter1;

let t, par_bg, par_num, par_num2, count;

let originalGraphics;

let bgGraphics;

​

function color_set() {

  colors2 = random([colors_tone1, colors_tone2, colors_tone3, newTone01, newTone02, newTone03, newTone04, newTone05, newTone06, newTone07, newTone08, newTone09, newTone10, newTone11, newTone12]);

  colors3 = random([colors_tone1, colors_tone2, colors_tone3, newTone01, newTone02, newTone03, newTone04, newTone05, newTone06, newTone07, newTone08, newTone09, newTone10, newTone11, newTone12]);

  colorset[0] = random(colors3);

  colorset[1] = random(colors3);

  colorset[2] = random(colors2);

  colorset[3] = random(colors2);

  colorset[4] = random(colors2);

  colorset[5] = random(colors3);

  colorset[6] = random(colors2);

  colorset[7] = random(colors3);

  colorset[8] = random(colors2);

  colorset[9] = random(colors3);

}

​

function setup() {

  // pixelDensity(4);

  frameRate(25);

  randomSeed(seed);

  // mySize = 800;

  mySize = min(windowWidth, windowHeight) * 0.9;

  margin = mySize / 100;

  createCanvas(mySize, mySize);

  originalGraphics = createGraphics(width, height);

  bgGraphics = createGraphics(width, height);

  color_set();

  background(random(colors1));

  makeFilter();

  t = 0;

  count = 0;

}

​

function draw() {

  randomSeed(seed);

​

  //bg

  par_bg = random(100, 600);

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

    bgGraphics.fill(str(random(colorset)) + "1a");

    bgGraphics.noStroke();

    if (frameCount % 2 == 0) {

      bgGraphics.stroke(str(random(colorset)) + "0d");

      bgGraphics.strokeWeight(random(0.25, 0.1));

      bgGraphics.noFill();

    }

    bgGraphics.drawingContext.shadowColor = str(random(color_shadow)) + "1a";

    bgGraphics.drawingContext.shadowOffsetX = 1 + frameCount * 0.05;

    bgGraphics.drawingContext.shadowOffsetY = 1 + frameCount * 0.05;

    bgGraphics.drawingContext.shadowBlur = 0;

​

    let xAngle = map(0, 0, width, -random(0.1, 1) * PI, random(0.1, 1) * PI, true);

    let yAngle = map(height, 0, height, -random(0.5, 1) * PI, random(0.5, 1) * PI, true);

    let angle = xAngle * width + yAngle * height;

​

    let myX = width / 2 + mySize / 2 * sin(random(0.5, 1.5) * TAU * t + angle);

    let myY = height / 2 + mySize / 2 * cos(random(0.5, 1.5) * TAU * t + angle);

​

    bgGraphics.push();

    bgGraphics.translate(myX + sin(random(0.5, 1.5) * TAU * t + angle), myY + cos(random(0.5, 1.5) * TAU * t + angle));

    bgGraphics.rotate(random(t) * PI / 10);

    bgGraphics.ellipse(0, 0, random(0.55, 1.25) * (1 - sqrt(random(random(1)))));

    bgGraphics.pop();

  }

  image(bgGraphics, 0, 0);

​

​

  let title_size = 1 * random([2, 8, 4, 6]);

  let rio = random([2, 3, 4]);

  par_num = int(random(5, 20)) * rio;

  par_num2 = int(random(20, 5)) * rio;

  let color_x = int(random(0, title_size + 1));

  let color_y = int(random(title_size + 1, 0));

  originalGraphics.push();

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

  // originalGraphics.rotate(t/5);

  // originalGraphics.drawingContext.setLineDash([1, 1]);

  originalGraphics.strokeCap(SQUARE);

  let sizemargin = 0.25;

  for (let x = width * sizemargin; x <= width * (1.0 - sizemargin); x += (width / par_num)) {

    let color_num_x = int(map(x / (width * (1.0 - sizemargin)), 0, 1, 0, title_size));

    for (let y = height * sizemargin; y <= height * (1.0 - sizemargin); y += (height / par_num2)) {

      let color_num_y = int(map(y / (height * (1.0 - sizemargin)), 0, 1, 0, title_size));

      if (color_num_x == color_num_y) {

        originalGraphics.stroke(str(colorset[color_num_x]) + "1a");

        originalGraphics.strokeWeight(random(0.1, 0.05));

        originalGraphics.noFill();

        originalGraphics.drawingContext.shadowColor = random(color_shadow);

        originalGraphics.drawingContext.shadowOffsetX = random(-1, 1);

        originalGraphics.drawingContext.shadowOffsetY = random(-1, 1);

        originalGraphics.drawingContext.shadowBlur = 0;

​

        originalGraphics.push();

        originalGraphics.translate(x - t * random([2.5, -5, 5]), y + t * random([5, 5, 5, 5, 5, 5]));

        // originalGraphics.line(0, 0, mySize * random(0.01, 0.03) / rio, 0);

        for (let n = 0; n < int(TAU / (PI / 24)); n++) {

          originalGraphics.push();

          originalGraphics.rotate((PI / 24) * n + random(TAU));

          originalGraphics.arc(0, 0, mySize * random(0.01, 0.03) / rio, mySize * random(0.01, 0.03) / rio, -PI / 12, PI / 12);

          originalGraphics.pop();

        }

        originalGraphics.pop();

​

​

​

      } else if (color_num_x < color_num_y && color_num_y <= color_x) {

        originalGraphics.stroke(str(colorset[color_num_x]) + "0d");

        originalGraphics.strokeWeight(random(0.1, 0.5));

        originalGraphics.noFill();

        originalGraphics.drawingContext.shadowColor = random(colorset);

        originalGraphics.drawingContext.shadowOffsetX = random(-1, 1);

        originalGraphics.drawingContext.shadowOffsetY = random(-1, 1);

        originalGraphics.drawingContext.shadowBlur = 0;

​

        originalGraphics.push();

        originalGraphics.translate(x - t * random([-5, 2.5, 5, 5]), y + t * random([5, 5, 5, 5, 5, 5]));

        // originalGraphics.rotate(random([PI / 2, PI, PI / 2 * 3, 0]));

        for (let n = 0; n < int(TAU / (PI / 24)); n++) {

          originalGraphics.push();

          originalGraphics.rotate((PI / 24) * n + random(TAU));

          originalGraphics.arc(0, 0, mySize * random(0.05, 0.03) / rio, mySize * random(0.01, 0.03) / rio, -PI / 12, PI / 12);

          originalGraphics.pop();

        }

        // originalGraphics.line(-mySize * random(0.05, 0.03) / rio, 0, 0, 0);

        originalGraphics.pop();

      } else if (color_num_x < color_num_y && color_num_y >= color_x) {

        originalGraphics.stroke(str(colorset[color_num_y]) + "0d");

        originalGraphics.strokeWeight(1 * random(0.4, 0.05));

        originalGraphics.noFill();

        originalGraphics.drawingContext.shadowColor = random(colorset);

        originalGraphics.drawingContext.shadowOffsetX = random(-1, 1);

        originalGraphics.drawingContext.shadowOffsetY = random(-1, 1);

        originalGraphics.drawingContext.shadowBlur = 0;

​

        originalGraphics.push();

        // if (int(x / (width / par_num)) == 2) {

        // originalGraphics.translate(x - t * random([3.5, 1.5, 2, 2.5, 3]), y + t * (-5));

        // } else {

        originalGraphics.translate(x - t * random([5, -2.5, 5, 5]), y + t * random([5, 5, 5, 5, 5, 5]));

        // }

        // originalGraphics.rotate(random([PI / 2, PI, PI / 2 * 3, 0]));

        for (let n = 0; n < int(TAU / (PI / 24)); n++) {

          originalGraphics.push();

          originalGraphics.rotate((PI / 24) * n + random(TAU));

          originalGraphics.arc(0, 0, mySize * random(0.01, 0.02) / rio, mySize * random(0.01, 0.03) / rio, -PI / 12, PI / 12);

          originalGraphics.pop();

        }

        // originalGraphics.line(0, 0, mySize * random(0.02, 0.01) / rio, 0);

        originalGraphics.pop();

      } else if (color_num_x > color_num_y && color_num_x <= color_y) {

        originalGraphics.stroke(str(colorset[color_num_x]) + "0d");

        originalGraphics.strokeWeight(1 * random(0.1, 0.2));

        originalGraphics.noFill();

        originalGraphics.drawingContext.shadowColor = random(colorset);

        originalGraphics.drawingContext.shadowOffsetX = random(-1, 1);

        originalGraphics.drawingContext.shadowOffsetY = random(-1, 1);

        originalGraphics.drawingContext.shadowBlur = 0;

​

        originalGraphics.push();

        originalGraphics.translate(x - t * random([5, 5, -5]), y + t * random([5, 5, 5, 5, 5, 5]));

        // originalGraphics.rotate(random([PI / 2, PI, PI / 2 * 3, 0]));

        // originalGraphics.line(-mySize * random(0.02, 0.03) / rio, 0, 0, 0);

        for (let n = 0; n < int(TAU / (PI / 24)); n++) {

          originalGraphics.push();

          originalGraphics.rotate((PI / 24) * n + random(TAU));

          originalGraphics.arc(0, 0, mySize * random(0.02, 0.03) / rio, mySize * random(0.01, 0.03) / rio, -PI / 12, PI / 12);

          originalGraphics.pop();

        }

        originalGraphics.pop();

      } else if (color_num_x > color_num_y && color_num_x >= color_y) {

        originalGraphics.stroke(str(colorset[color_num_y]) + "0d");

        originalGraphics.strokeWeight(random(0.01, 0.5));

        originalGraphics.noFill();

        originalGraphics.drawingContext.shadowColor = random(color_shadow);

        originalGraphics.drawingContext.shadowOffsetX = random(-1, 1);

        originalGraphics.drawingContext.shadowOffsetY = random(-1, 1);

        originalGraphics.drawingContext.shadowBlur = 0;

​

        originalGraphics.push();

        originalGraphics.translate(x - t * random([5, 5, 2.5, -5]), y + t * random([5, 5, 5, 5, 5, 5]));

        // originalGraphics.rotate(random([PI / 2, PI, PI / 2 * 3, 0]));

        // originalGraphics.line(0, 0, mySize * random(0.05, 0.03) / rio, 0);

        for (let n = 0; n < int(TAU / (PI / 24)); n++) {

          originalGraphics.push();

          originalGraphics.rotate((PI / 24) * n + random(TAU));

          originalGraphics.arc(0, 0, mySize * random(0.05, 0.03) / rio, mySize * random(0.01, 0.03) / rio, -PI / 12, PI / 12);

          originalGraphics.pop();

        }

        originalGraphics.pop();

      }

​

    }

  }

  originalGraphics.pop();

  image(originalGraphics, 0, 0);

  image(overAllTexture, 0, 0);

​

  t += 0.05 / 4;

  if (int(sin(t) * 10) == 0) {

    count++;

  }

​

  if (count == 10) {

    noLoop();

    blendMode(BLEND);

    image(overAllTexture, 0, 0);

    // blendMode(ADD);

    // strokeWeight(random(0.10, 0.5) / 1);

    // stroke(str(random(colorset)) + "05");

    // noFill();

    // drawingContext.setLineDash([1, 4, 1, 3]);

    // drawOverPattern();

    drawingContext.setLineDash([0, 0]);

    blendMode(BLEND);

​

    noFill();

    strokeWeight(margin);

​

    rectMode(CORNER);

    stroke("#202020");

​

    rect(0, 0, width, height);

  }

}