ARTDM 170, Week13: Processing

ARTDM 170, Week 13: Introduction to Processing

Gilbert Guerrero [email_address]

gilbertguerrero.com/blog/artdm-170/

Processing

Affect Browser , by Christian Nold

Strange Weather , by Studio for Urban Projects

Eyebeam Art + Technology Center , New York

On the Origin of Species: The Preservation of Favoured Traces , Ben Fry

Download Processing

http://processing.org

Open Processing

Processing examples

Run a few of the example sketches in Processing.

Go to File > Examples > (then choose an example)

Check out the Exhibition page

Processing basics

To see your sketch in action click Run

To stop it you can close the viewer or click Stop

To create a new sketch, click New

Processing basics

Sketches run as Java Applets

Sketches can be exported to several formats:

Java applet with index.html page for web borwsers

Windows, Mac, and Linux applications

Basic parts of a sketch

/* Notes */

// Setup the variables values float moveX = 50;

// Initialize the sketch void setup() { }

// Loops every frame void draw() { }

Draw a line

void setup() { size(400, 400); stroke(255); background(192, 64, 0); } void draw() { line(150, 25, 270, 350); }

Follow the mouse

void setup() { size(400, 400); stroke(255); background(192, 64, 0); } void draw() { line(150, 25, mouseX, mouseY); }

Clearing the screen

void setup() { size(400, 400); stroke(255); }

void draw() { background(192, 64, 0); line(150, 25, mouseX, mouseY); }

Bouncing Ball Sketch

void draw() { background(0); if(ballX > width - ballWidth/2 || ballX < ballWidth/2){ moveX = -moveX; //change direction } if(ballY > height - ballWidth/2 || ballY < ballWidth/2){ moveY = -moveY; //change direction }

// Move the ball ballX = ballX + moveX; ballY = ballY + moveY;

fill(255,100); noStroke(); ellipse(ballX, ballY, ballWidth, ballWidth); }

Random color

Comment out the background refresh

// background(0);

Change the fill color to a random rgb value

fill(random(0,255), random(0,255), random(0,255), random(0,255));

Final Projects December 2 9 16 25 18 11 November Last day of class Present final projects (two days) Design background and game elements. Embed in game symbol Script user interaction and movement of game elements Add scoring and game over trigger

Homework, due Nov 18