let particles = [];

let img;

​

function preload() {

    // font = loadFont('https://cdnjs.cloudflare.com/ajax/libs/top-coat/0.8.0/font/SourceCodePro-Regular.otf');

    // img = loadImage('path_to_extracted_frame.png'); // Use the path to your extracted frame

}

​

function setup() {

    createCanvas(windowWidth, windowHeight);

    // textFont(font);

    textSize(192);

    fill(255);

    noStroke();

    let points = font.textToPoints('Your Text', 100, 200, 192, {

        sampleFactor: 0.1

    });

​

    for (let pt of points) {

        let particle = new Particle(pt.x, pt.y);

        particles.push(particle);

    }

}

​

function draw() {

    background(0);

    for (let particle of particles) {

        particle.update();

        particle.show();

    }

}

​

class Particle {

    constructor(x, y) {

        this.pos = createVector(x, y);

        this.target = createVector(x, y);

        this.vel = p5.Vector.random2D();

        this.acc = createVector();

        this.r = 8;

    }

​

    update() {

        this.vel.add(this.acc);

        this.pos.add(this.vel);

        this.acc.mult(0);

    }

​

    show() {

        fill(255);

        ellipse(this.pos.x, this.pos.y, this.r * 2);

    }

}

​