fractalkitty looking for math? fractalkitty.com

weekly creative coding

splotchy chalk

#random#trig#animation#accumulates#letters#wcc

letterstestLetters

let t = 0;

function setup() {
  cnv = createCanvas(600, 600);
  background(70);
  angleMode(DEGREES);
  rectMode(CENTER);
  noStroke();
  describe(
    "a through z lower case letters being drawn on a dark grey canvas with a splotchy random chalk effect"
  );
}

function draw() {
  t += randomGaussian(2, 1);
  translate(0, height / 12);
  testLetters();
}

function letters(l, w, r) {
  push();
  fill(40, 40, 40, 2);
  rect(0, 0, w * 1.5, w * 3);
  noStroke();
  translate(0, -w / 2);
  s = w / 20 + randomGaussian(0, w / 20);

  fill(255 - random(30), 255 - random(30), 255 - random(10));
  t1 = t + r + random(-20, 20);
  if (l === "a") {
    circle((w / 3) * cos(t1), w / 2 + (w / 3) * sin(t1), s);
    circle(w / 2 - (w / 2 - w / 3), w / 2 + (w / 2.5) * sin(t1), s);
  }
  if (l === "b") {
    circle((w / 3) * cos(t1), w / 2 + (w / 3) * sin(t1), s);
    circle(-w / 2 + (w / 2 - w / 3), (w / 1.2) * sin(t1), s);
  }
  if (l === "c") {
    t2 = 180 - 140 * sin(t1);
    circle((w / 3) * cos(t2), w / 2 + (w / 3) * sin(t2), s);
  }
  if (l === "d") {
    circle((w / 3) * cos(t1), w / 2 + (w / 3) * sin(t1), s);
    circle(w / 2 - (w / 2 - w / 3), (w / 1.2) * sin(t1), s);
  }
  if (l === "e") {
    t2 = 190 - 140 * sin(t1);
    circle((w / 3) * cos(t2), w / 2 + (w / 3) * sin(t2), s);
    circle((-w / 4) * cos(t1), w / 3, s);
  }
  if (l === "f") {
    t2 = 240 - 60 * sin(t1);
    circle(w / 5 + (w / 5) * cos(t2), -w / 2 + (w / 3) * sin(t2), s);
    circle(w / 5 + (-w / 5) * cos(t1) - w / 5, 0, s);
    circle(w / 5 + -w / 2 + (w / 2 - w / 5), (w / 1.4) * cos(t1) + w / 5, s);
  }
  if (l === "g") {
    t2 = 90 + 90 * sin(t1);
    circle((w / 3) * cos(t1), w / 2 + (w / 3) * sin(t1), s);
    circle(w / 2 - (w / 2 - w / 3), w / 2 + (w / 2.2) * sin(t1), s);
    circle((w / 3) * cos(t2), w + (w / 3) * sin(t2), s);
  }
  if (l === "h") {
    t2 = -90 + 90 * sin(t1);
    circle((w / 3) * cos(t2), w / 2 + (w / 3) * sin(t2), s);
    circle(-w / 2 + (w / 2 - w / 3), (w / 1.2) * sin(t1), s);
    circle(w / 2 - (w / 2 - w / 3), w / 1.45 + (w / 6.5) * sin(t1), s);
  }
  if (l === "i") {
    circle(0, w / 2 + (w / 3) * sin(t1), s);
    circle((w / 20) * cos(t1), -w / 5 + (w / 20) * sin(t1), s);
  }
  if (l === "j") {
    t2 = 240 + 180 - 60 * sin(t1 - 90);
    circle(0, w / 1.6 + (w / 2.5) * sin(t1), s);
    circle((w / 20) * cos(t1), -w / 5 + (w / 20) * sin(t1), s);
    circle(-w / 2 + w / 3.4 + (w / 5) * cos(t2), w + (w / 3) * sin(t2), s);
  }
  if (l === "k") {
    x1 = -w / 12 + (w / 4) * cos(t1);
    y1 = x1 + w / 1.5;
    x2 = -w / 12 + (w / 4) * cos(t1 + 90);
    y2 = -x2;
    circle(x1, y1, s);
    circle(x2, y2, s);
    circle(-w / 2 + (w / 2 - w / 3), (w / 1.2) * sin(t1), s);
  }
  if (l === "l") {
    circle(0, (w / 1.2) * sin(t1), s);
  }
  if (l === "m") {
    t2 = -90 + 90 * sin(t1);
    circle(w / 4 + (w / 4) * cos(t2), w / 2 + (w / 3) * sin(t2), s);
    circle(-w / 4 - (w / 4) * cos(t2), w / 2 + (w / 3) * sin(t2), s);

    circle(
      w / 5.5 + w / 2 - (w / 2 - w / 3),
      w / 1.45 + (w / 6.5) * sin(t1),
      s
    );
    circle(
      -w / 5.5 - w / 2 + (w / 2 - w / 3),
      w / 1.45 + (w / 6.5) * sin(t1),
      s
    );
  }
  if (l === "n") {
    t2 = -90 + 90 * sin(t1);
    circle((w / 3) * cos(t2), w / 2 + (w / 3) * sin(t2), s);
    circle(-w / 2 + (w / 2 - w / 3), w / 2 + (w / 3) * sin(t1), s);
    circle(w / 2 - (w / 2 - w / 3), w / 1.45 + (w / 6.5) * sin(t1), s);
  }
  if (l === "o") {
    circle((w / 3) * cos(t1), w / 2 + (w / 3) * sin(t1), s);
  }
  if (l === "p") {
    circle((w / 3) * cos(t1), w / 2 + (w / 3) * sin(t1), s);
    circle(-w / 2 + (w / 2 - w / 3), w + (w / 2) * sin(t1), s);
  }
  if (l === "q") {
    circle((w / 3) * cos(t1), w / 2 + (w / 3) * sin(t1), s);
    circle(w / 2 - (w / 2 - w / 3), w + (w / 2) * sin(t1), s);
  }
  if (l === "r") {
    t2 = -90 + 45 * sin(t1);
    circle((w / 3) * cos(t2), w / 2 + (w / 3) * sin(t2), s);
    circle(-w / 2 + (w / 2 - w / 3), w / 2 + (w / 3) * sin(t1), s);
  }
  if (l === "s") {
    t2 = -90 + 45 * sin(t1);
    circle((w / 3) * cos(t2), w / 2 + (w / 3) * sin(t2), s);
    t2 = 90 + 45 * sin(t1);
    circle((w / 3) * cos(t2), w / 2 + (w / 3) * sin(t2), s);
    x1 = (w / 6) * cos(t1);
    y1 = x1 + w / 2;
    circle(x1, y1, s);
  }
  if (l === "t") {
    circle(w / 5 + (-w / 5) * cos(t1) - w / 5, 0, s);
    circle(w / 5 + -w / 2 + (w / 2 - w / 5), (w / 1.4) * cos(t1) + w / 5, s);
  }
  if (l === "u") {
    t2 = 90 + 90 * sin(t1);
    circle((w / 3) * cos(t2), w / 2 + (w / 3) * sin(t2), s);
    circle(w / 2 - (w / 2 - w / 3), w / 2 + (w / 3) * sin(t1), s);
    circle(-w / 2 + (w / 2 - w / 3), w / 3 + (w / 5) * sin(t1), s);
  }
  if (l === "v") {
    x1 = -w / 5 + (w / 6) * cos(t1);
    y1 = 2 * x1 + w / 1.1;
    x2 = w / 5 - (w / 6) * cos(t1);
    y2 = -2 * x2 + w / 1.1;
    circle(x1, y1, s);
    circle(x2, y2, s);
  }
  if (l === "w") {
    t2 = 90 + 90 * sin(t1);
    circle(w / 4 + (w / 4) * cos(t2), w / 2 + (w / 3) * sin(t2), s);
    circle(-w / 4 - (w / 4) * cos(t2), w / 2 + (w / 3) * sin(t2), s);

    circle(w / 5.5 + w / 2 - (w / 2 - w / 3), w / 3 + (w / 6.5) * sin(t1), s);
    circle(-w / 5.5 - w / 2 + (w / 2 - w / 3), w / 3 + (w / 6.5) * sin(t1), s);
  }
  if (l === "x") {
    x1 = (w / 3) * cos(t1);
    y1 = x1 + w / 2;
    x2 = (w / 3) * cos(t1 + 90);
    y2 = -x2 + w / 2;
    circle(x1, y1, s);
    circle(x2, y2, s);
  }
  if (l === "y") {
    x1 = -w / 5 + (w / 6) * cos(t1);
    y1 = 2 * x1 + w / 1.1;
    x2 = (w / 3) * cos(t1);
    y2 = -2 * x2 + w / 1.1;
    circle(x1, y1, s);
    circle(x2, y2, s);
  }
  if (l === "z") {
    circle((w / 3) * cos(t1), w / 6, s);
    circle((w / 3) * cos(t1), w / 1.1, s);
    x1 = (w / 3) * cos(t1);
    y1 = 0.9 * x1 + w / 2;
    circle(x1, y1, s);
  }

  pop();
}

function testLetters() {
  w1 = 40;
  w2 = w1 * 1.6;
  push();
  translate(50, 80);
  letters("a", w1, 20);
  translate(w2, 0);
  letters("b", w1, 40);
  translate(w2, 0);
  letters("c", w1, 50);
  translate(w2, 0);
  letters("d", w1, 80);
  translate(w2, 0);
  letters("e", w1, 150);
  translate(w2, 0);
  letters("f", w1, 120);
  translate(w2, 0);
  letters("g", w1, 100);
  translate(w2, 0);
  letters("h", w1, 90);
  translate(w2, 0);
  letters("i", w1, 110);
  translate(-width + w1 * 3, w1 * 2 + w2 / 1.2);
  letters("j", w1, 140);
  translate(w2, 0);
  letters("k", w1, 120);
  translate(w2, 0);
  letters("l", w1, 110);
  translate(w2, 0);
  letters("m", w1, 100);
  translate(w2, 0);
  letters("n", w1, 0);
  translate(w2, 0);
  letters("o", w1, 190);
  translate(w2, 0);
  letters("p", w1, 150);
  translate(w2, 0);
  letters("q", w1, 50);
  translate(-width + w1 * 3, w1 * 2 + w2 / 1.2);
  letters("r", w1, 250);
  translate(w2, 0);
  letters("s", w1, 350);
  translate(w2, 0);
  letters("t", w1, 220);
  translate(w2, 0);
  letters("u", w1, 10);
  translate(w2, 0);
  letters("v", w1, 110);
  translate(w2, 0);
  letters("w", w1, 160);
  translate(w2, 0);
  letters("x", w1, 30);
  translate(w2, 0);
  letters("y", w1, 230);
  translate(w2, 0);
  letters("z", w1, 310);
  pop();
}