Processing Evolved

    function setup() {
        let canvas = createCanvas(600, 600, WEBGL);
        canvas.parent('animation-holder');
    resizeAnimation();
    resizeAnimation();
    resizeAnimation();
    obstacles = [];
    for (let i = 0; i < 10; i++) {
        obstacles.push(createVector(random(-width/2, width/2), random(-height/2, height/2)));
    }
    }

    let particles = [];

    function draw() {
        background(150);
        
        let numParticles = 50;
        for (let i = 0; i < numParticles; i++) {
            let newParticle = new Particle(random(-width/2, width/2), -height/2);
            particles.push(newParticle);
        }
        
        for (let i = particles.length - 1; i >= 0; i--) {
            particles[i].update();
            particles[i].show();
            for (let j = 0; j < obstacles.length; j++) {
                if (dist(particles[i].x, particles[i].y, obstacles[j].x, obstacles[j].y) < 16) {
                    particles[i].vx = random(-2, 2);
                    particles[i].vy = random(2, 8);
                }
            }
            if (particles[i].finished()) {
                particles.splice(i, 1);
            }
        }
    }

    class Particle {
        constructor(x, y) {
            this.x = x;
            this.y = y;
            this.vx = random(-2, 2);
            this.vy = random(2, 8);
            this.alpha = 255;
        }

        finished() {
            return this.y > height/2 || this.alpha < 0;
        }

        update() {
            this.x += this.vx;
            this.y += this.vy;
            this.vy += 0.1;
            this.alpha -= 5;
        }

        show() {
            noStroke();
            fill(255, 0, 0, this.alpha);
            ellipse(this.x, this.y, 16, 16);
        }
    }