​

​

​

let points;

let bounds;

let font;

let fr = 60;

​

​

​

​

function preload() {

  font = loadFont("assets/le-murmure.otf");

}

​

​

​

​

​

function setup() {

  createCanvas(540, 540);

  textFont(font);

  const n = 'growth';

  const s = 200;

  points = font.textToPoints(n, 0, -30, s, {

    sampleFactor: 1,

    simplifyThreshold: 0.0

  });

  bounds = font.textBounds(n, 0, 0, s);

  console.log(bounds)

}

​

​

​

​

​

​

function draw() {

  background(33,33,33);

  translate(width/2, height/2);

  drawLetterShape();

}

​

​

​

​

​

​

function drawLetterShape() {

  push();

  translate(-bounds.w/2, bounds.h/2);

  let x = 0;

  let y = 0;

  let n = points.length;

  let res = 2;

  for (let i = 0; i < n; i += res) {

    x = points[i].x;

    y = points[i].y;

    push();

    translate(x, y);

    strokeWeight(0.3);

    fill(0,10);

    circle(-15,-5, 5);

    pop();

    push();

    translate(x, y);

    strokeWeight(0.1);

    fill(212, 225, 87, 2);

    circle(-15,-5, (frameCount * sin(0.1))*4);

    pop();

    push();

    translate(x, y);

    noStroke();

    fill(103, 58, 183, 1);

    circle(-10, 0, (frameCount * sin(0.1))*2);

    pop();

    push();

    translate(x, y);

    noStroke();

    fill(255, 87, 34, 1);

    circle(-5,5, (frameCount * sin(0.1))*3);

    pop();

  }

  if (frameCount % 5 == 0) {

    background(33,33,33,20);

  }

  pop();

}

​

​

​

​

​

​

​

​

​

​

​

​

​

​

​

​

​