P5 Playground

// P5.js Sketch Example function setup() { createCanvas(400, 400); background(240); strokeWeight(2); } function draw() { // Clear with semi-transparent background for trails background(240, 240, 240, 10); // Draw a bouncing shape fill(255, 100, 100); noStroke(); ellipse(x, y, 30, 30); // Draw a moving trail stroke(100, 100, 255); line(px, py, x, y); // Update position x += xSpeed; y += ySpeed; // Store previous position px = x; py = y; // Bounce off edges if (x > width || x < 0) { xSpeed *= -1; } if (y > height || y < 0) { ySpeed *= -1; } } // Initialize variables let x = 100; let y = 100; let px = x; let py = y; let xSpeed = 5; let ySpeed = 3;