Processing: Mouse Droppings

OK, we’ve finally got a bit of interaction going on… This sketch presents a blank canvas, until you click the mouse button, and then you get a circle filled with some random color. As you moved the mouse (with the button held down) it’ll make more circles and before you know it, you’re drawing!

See it in action here!

You can start over by pressing the ‘Q’ key, which will blank out the canvas. You can also adjust the size of the circle by using the up and down arrow keys.

/*
 * 20110506.pde
 */

void setup() {
  size(800,600);
  background(0);
}

color myColor = color(0,0,0);
int mySize = 50;

void draw() {
  fill(myColor);
  stroke(myColor);
  strokeWeight(1);
  
  if(keyPressed) {
    if (key == 'q' || key == 'Q') {
      background(0);
      myColor = color(0,0,0);
      mySize = 50;
    }
    if (key == CODED) {
      if (keyCode == UP) {
        mySize = mySize + 1;
      }
      else if (keyCode == DOWN) {
        mySize = mySize - 1;
      }
    }
    if (mySize < 1) {
      mySize = 1;
    }
    if (mySize > 800) {
      mySize = 800; 
    }
  }
  
}

void mouseClicked() {
  myColor = color(random(50,255), random(50,255), random(50,255));
}

void mouseDragged() {
  myColor = color(random(50,255), random(50,255), random(50,255));
  ellipse(mouseX, mouseY, mySize, mySize);
}

This is still a pretty minimal sketch. I did have to add in the upper and lower value limits on the size of the circle or things started to go in reverse if you held the key down too long.