test

Prompt

let particles = []; let numParticles = 75; class Particle { constructor(id) { this.id = id; this.pos = createVector(random(50, width - 280), random(50, height - 50)); this.vel = createVector(random(-2, 2), random(-2, 2)); this.acc = createVector(0, 0); this.score = random(15, 45); } applyForce(force) { this.acc.add(force); } update() { this.vel.add(this.acc); let maxSpeed = 9; this.vel.limit(maxSpeed); this.pos.add(this.vel); this.acc.mult(0); // Bounce an den Rändern (Board-Bereich ausgespart) if (this.pos.x < 15 || this.pos.x > width - 245) { this.vel.x *= -0.85; this.pos.x = constrain(this.pos.x, 15, width - 245); } if (this.pos.y < 15 || this.pos.y > height - 15) { this.vel.y *= -0.85; this.pos.y = constrain(this.pos.y, 15, height - 15); } } } function setup() { createCanvas(920, 620); colorMode(HSB, 360, 100, 100, 100); textFont('monospace'); for (let i = 1; i <= numParticles; i++) { particles.push(new Particle(i)); } } function draw() { background(12, 12, 22); // Mausgeschwindigkeit berechnen let mouseVel = createVector(mouseX - pmouseX, mouseY - pmouseY); let mouseSpeed = mouseVel.mag(); let isFast = mouseSpeed > 7.5; // === PHYSIK UPDATE === for (let p of particles) { let toMouse = p5.Vector.sub(createVector(mouseX, mouseY), p.pos); let d = toMouse.mag(); if (d < 1) d = 1; toMouse.normalize(); // Kraftstärke abhängig von Mausgeschwindigkeit let baseForce = map(d, 0, 450, 1.1, 0.15); let forceStrength = isFast ? baseForce * 1.65 : baseForce * 0.75; // Bei schneller Maus zusätzlicher Jitter (Chaos) if (isFast) { toMouse.add(createVector(random(-0.6, 0.6), random(-0.6, 0.6))); } p.applyForce(toMouse.mult(forceStrength)); // Leichte Dämpfung p.vel.mult(isFast ? 0.975 : 0.965); p.update(); // === SCORE / RANKING METRIK === let closeness = max(0, 180 - d); let kinetic = p.vel.mag(); if (isFast) { // Schnell = volatil, belohnt hohe eigene Energie p.score = lerp(p.score, p.score + kinetic * 1.1 + random(-1.8, 2.2), 0.28); } else { // Langsam = stabil, belohnt Nähe + Kontrolle p.score = lerp(p.score, p.score + closeness * 0.035 + kinetic * 0.4, 0.12); } p.score = constrain(p.score, 5, 220); } // === ZEICHNEN DER PARTIKEL === for (let p of particles) { let kinetic = p.vel.mag(); let hueVal = map(p.score, 5, 180, 195, 320); // cyan → magenta let sat = isFast ? 85 : 65; let bri = map(kinetic, 0, 9, 70, 100); fill(hueVal, sat, bri, 92); noStroke(); ellipse(p.pos.x, p.pos.y, 13, 13); // Richtungslinie (Velocity) stroke(hueVal, 40, 100, 70); strokeWeight(1.5); let dir = p.vel.copy().mult(2.2); line(p.pos.x, p.pos.y, p.pos.x + dir.x, p.pos.y + dir.y); // NUMMER (ID) direkt auf dem Partikel fill(0, 0, 100); noStroke(); textSize(8); textAlign(CENTER, CENTER); text(p.id, p.pos.x, p.pos.y - 1); } // === LIVE RANKING BOARD === let boardX = width - 225; let boardY = 18; let boardW = 210; let boardH = 520; // Board Hintergrund fill(18, 18, 28, 245); stroke(60, 60, 80); strokeWeight(2); rect(boardX, boardY, boardW, boardH, 6); // Header fill(0, 0, 100); noStroke(); textSize(13); textAlign(LEFT, TOP); text("LIVE RANKING", boardX + 12, boardY + 12); textSize(10); fill(200); text("Mouse Speed: " + mouseSpeed.toFixed(1), boardX + 12, boardY + 30); text("Mode: " + (isFast ? "AGITATED" : "CALM"), boardX + 12, boardY + 44); text("Particles: " + numParticles, boardX + 12, boardY + 58); // Trennlinie stroke(70); strokeWeight(1); line(boardX + 10, boardY + 72, boardX + boardW - 10, boardY + 72); // Sortierte Top 10 let sorted = [...particles].sort((a, b) => b.score - a.score); textSize(10); for (let i = 0; i < min(12, sorted.length); i++) { let p = sorted[i]; let y = boardY + 90 + i * 17; // Rang + ID + Score let rankColor = i < 3 ? color(45, 90, 100) : color(0, 0, 95); fill(rankColor); text((i + 1) + ". #" + p.id, boardX + 14, y); fill(180); text(p.score.toFixed(1), boardX + 115, y); // Kleiner Balken für visuelle Stärke let barWidth = map(p.score, 5, 200, 0, 70); fill(200, 70, 85, 180); noStroke(); rect(boardX + 155, y - 3, barWidth, 5, 2); } // Footer Hinweis fill(120); textSize(8); text("schnelle Maus = volatile Rankings", boardX + 12, boardY + boardH - 18); }

A system prompt was added to support web rendering