Read through the book. It will help a great deal!

https://dl.dropboxusercontent.com/u/3235343/Teaching/GettingStartedWithProcessing.pdf

Go through the examples for Processing Primer 1 and 2:

https://dl.dropboxusercontent.com/u/3235343/Teaching/DMA/Java13/Intro_Java1_Day1.zip

• mousedraw

// basic drawing app 
 
void setup () {
  background(0); // set background color to black
  size (400, 400); // set background size to 400 by 400 pixels
  strokeWeight(3); // set stroke weight to 3
  stroke(255);
}
 
void draw() {
  if (mousePressed == true) 
    line (pmouseX, pmouseY, mouseX, mouseY);  // draw a point at mouse location
 
  // code that prints out the values of mouseX and mouseY to the console.
  println("mouseX: " + mouseX + " , mouseY: " + mouseY);
}

• keypress

void setup() {
  size (200, 200);
  rectMode(CENTER);
  ellipseMode(CENTER);
  //noStroke();
}
 
void draw() {
  background(168, 234, 233); // why is this in draw()?
 
  if (keyPressed == true) {
    fill(13, 185, 14);
    textSize(20); 
    text("You pressed: ", 40, 100); //place text starting at (40, 100)
    textSize(40); // change the text sixe to 40 pixels
    text(key, 90, 150); // display the key value at position (90, 150)
 
    if(key == 'a' || key == 'A'){
      fill(100, 0, 0);
      ellipse(100, 40, 30, 30);
    }
 

• loops

 
  //setup
  size(200, 200);
  background(255);
  noFill();
  ellipseMode(CENTER);
  rectMode(CENTER);
 
 
  for(int i=1; i < 10; i++) {
      //rect(100, 100, 20*i, 20*i);
      ellipse(100, 100, 20*i, 20*i);
      println("value of i: " + i);
      println("width/height of ellipse: " + (20*i));
  }
}

Get your Happy Face working from OpenProcessing.org

• The “floating effect” is under “easing” in Chapter 5 of the Processing book

Happy Face Project inspired by: http://www.openprocessing.org/sketch/101925