240520a - OpenProcessing

mySketch
xxxxxxxxxx
 
let str = "flow from shape to  shape";
let font;
function preload(){
  font = loadFont("TMT-CaffeineVF.ttf");
}
function setup() {
  createCanvas(windowWidth, windowHeight);
}
​
function draw() {
  background(255);
​
  let rows = [];
  let row_num = 5;
  let col_num = 5;
  let scl = 0.9;
​
  let row_sum = 0;
  let z = 0;
  for (let i = 0; i < row_num; i++) {
    let cols = [];
    let m =
      noise(i * 9900, frameCount / 800) *
      map(
        sin(((i / row_num) * TWO_PI) / 4 + sin(radians(frameCount) % TWO_PI)),
        -1,
        1,
        0,
        1
      );
    row_sum += m;
    for (let j = 0; j < col_num; j++) {
      let s = str.substr(z++%str.length, 1);
      let n =
        noise(i * 99, j * 99, frameCount / 4000) *
        map(
          sin(
            (i / row_num) * TWO_PI + (j / col_num) * TWO_PI + frameCount / 55
          ),
          -1,
          1,
          0.2,
          0.8
        );
      n = sq(n);
      cols.push({ h: m, w: n, s: s });
    }
    rows.push(cols);
  }
​
  let y = 0;
  let h = 0;
  for (let i = 0; i < row_num; i++) {
    let col_sum = 0;
    for (let j = 0; j < col_num; j++) {
      let obj = rows[i][j];
      h = (obj.h / row_sum) * height;
      col_sum += obj.w;
      obj.h = h;
      obj.y = y;
    }
    let x = 0;
    for (let j = 0; j < col_num; j++) {
      let obj = rows[i][j];
      let w = (obj.w / col_sum) * width;
      obj.x = x;
      obj.w = w;
      x += obj.w;
    }
    y += h;
  }
​
  push();
  translate(width / 2, height / 2);
  scale(scl);
  translate(-width / 2, -height / 2);
  strokeWeight(1 / scl);
  // rect(0, 0, width, height);
  for (let cols of rows) {
    for (let obj of cols) {
      push();
      translate(obj.x + obj.w / 2, obj.y + obj.h / 2);
      if (min(obj.w, obj.h) > 1) {
        textAlign(CENTER, CENTER);
        textFont(font);
        scale(obj.w/12,obj.h/12);
        text(obj.s, 0, 0);
      }
      pop();
    }
  }
  pop();
}
​