P5

var x = 0; // X-Wert des Punktes
var d = 80; // Durchmesser des Punktes

function setup() {
  createCanvas(960, 200);
  background(255);
  noStroke();
  frameRate(30); // 30 Bilder pro Sekunde
}

// dies läuft immer wieder ab
// abhängig von der "frameRate) dauert dies unterschiedlich lang
function draw(){
  background(255);

  // Zufallswert zwischen -40 und 40
  // nur ganze Zahlen durch "int()"
  var z = int(random(-40,40));
  textSize(18);
  textFont("Verdana");
  fill(190);
  text("Zufallszahl: " + z, 10, height-20);

  fill(255,0,0);

  // Position des Kreises, hier mit Zufallswert
  ellipse(x, height/2 + z, d, d);

  // hiermit bewegt sich der waagrecht
  // ebenfalls mit Zufallswert
  x = x + 6 + z;
}

// Damit fängt die Animation wieder von vorne an
function mousePressed(){
  background(255);
  x = 0;
}