HTTP/2 200 date: Sat, 11 Oct 2025 10:31:11 GMT content-type: text/html server: cloudflare last-modified: Thu, 28 Oct 2010 14:02:44 GMT cf-cache-status: DYNAMIC vary: Accept-Encoding nel: {"report_to":"cf-nel","success_fraction":0.0,"max_age":604800} report-to: {"group":"cf-nel","max_age":604800,"endpoints":[{"url":"https://a.nel.cloudflare.com/report/v4?s=H56SL7zOODC7kDiH36%2FzI0W7rG%2BYxlCGu29gFj92Iz0OC%2BJz716NFjhWAjfQ8%2BLI%2BjWNbQ20OWI%2BHOslJuQVTzJ9dRc7HdtzC2pb9tk%3D"}]} content-encoding: gzip cf-ray: 98cdafb42c3e45ed-BOM alt-svc: h3=":443"; ma=86400

Processing.js

Pattern

Move the cursor over the image to draw with a software tool which responds to the speed of the mouse.

Original Processing.org Example: Pattern

// All Examples Written by Casey Reas and Ben Fry
// unless otherwise stated.
void setup()
{
  size(200, 200);
  background(102);
  smooth();
}
void draw() 
{
  // Call the variableEllipse() method and send it the
  // parameters for the current mouse position
  // and the previous mouse position
  variableEllipse(mouseX, mouseY, pmouseX, pmouseY);
}
// The simple method variableEllipse() was created specifically 
// for this program. It calculates the speed of the mouse
// and draws a small ellipse if the mouse is moving slowly
// and draws a large ellipse if the mouse is moving quickly 
void variableEllipse(int x, int y, int px, int py) 
{
  float speed = abs(x-px) + abs(y-py);
  stroke(speed);
  ellipse(x, y, speed, speed);
}