PANDA DANCE!! Processing and Pure Data

PANDA DANCE! from Eva Daly on Vimeo.

I created my visuals through Processing. I scaled the data between 1-0 which ment if I wanted the colour of the ellipses to change, It would be multiplied 255.  Processing then recieved messages from pure data.

I drew ellipses into processing that would change position, with different frequency that were being sent from pure data.  I also assigned different coloured backgrounds to the different frequency.  I then imported images I had drawn, scanned, then photoshoped.  Different images would also appear at different frequency to make it appear as if the panda was dancing in time with the music. 

Pure Data

                    Above are the different frequencies being sent form Pure Data to Processing.

Music Loaded in Pure Data "Put on your dancing shoes" by Arctic Monkeys.

Here is the code for Processing.

	import oscP5.*;
	import netP5.*;
	OscP5 oscP5;
	NetAddress myRemoteLocationIn;
	NetAddress myRemoteLocationOut;
	PImage myImage1, myImage2, myImage3, myImage4, myImage5;
	color oldPixelColour;
	color updatedPixelColour;
	float r,g,b;
	float freq;
	int xPos;
	int speedX = 15;
	void setup(){
	background(#FC1FF9);
	frameRate(15);
	size (1650,1000);
	myImage1 = loadImage("pandabear1new.png");
	myImage2 = loadImage("pandabear2.png");
	myImage3 = loadImage("pandabear3.png");
	myImage4 = loadImage("dance.png");
	myImage5 = loadImage("pandafont.png");
	oscP5 = new OscP5(this,12000);
	myRemoteLocationIn = new NetAddress("127.0.0.1",12000);
	}
	void draw(){
	fill(random(255),random(255),random(200));
	ellipse(300,500,freq,freq);
	ellipse(1000,700,freq,freq);
	//image(myImage1, 100, 100);
	xPos = xPos + speedX;
	//position of the images, they will only move in the bottom left corner of the screen
	if (xPos > (width-1550)){
	// speedX = speedX *-1;
	speedX = -15;
	}
	if (xPos < 0){
	//speedX = speedX * - 1;
	speedX = 15;
	}
	//colour and size of ellipses will be determined be frequency
	//also they will change frame when the frequecy is at a certain level e.g freq < 100, freq < 200 and so on.
	if (freq < 100){
	background(#FC1FF9);
	noStroke();
	fill(random(255),random(255),random(255),random(200));
	ellipse(825,250,freq,freq);
	ellipse(618,375,freq,freq);
	ellipse(1031,375,freq,freq);
	ellipse(412,500,freq,freq);
	ellipse(825,500,freq,freq);
	ellipse(1237,500,freq,freq);
	ellipse(618,625,freq,freq);
	ellipse(1031,625,freq,freq);
	ellipse(825,750,freq,freq);
	image(myImage1, xPos, 250);
	}
	if (freq > 100 && freq < 200){
	background(#FBFF24);
	noStroke();
	fill(random(255),random(255),random(255),random(200));
	ellipse(150,100,freq,freq);
	ellipse(250,800,freq,freq);
	ellipse(825,500,freq,freq);
	ellipse(1500,100,freq,freq);
	ellipse(1400,800,freq,freq);
	image(myImage2, xPos, 300);
	}
	if (freq > 200 && freq < 300){
	background(#24FFEF);
	noStroke();
	fill(random(255),random(255),random(255),random(200));
	ellipse(800,20,freq,freq);
	image(myImage3, xPos, 200);
	}
	if (freq > 300 && freq < 600){
	background(#89FF24);
	ellipse(1000,600,freq,freq);
	ellipse(620,300,freq,freq);
	image(myImage4, xPos, 200);
	}
	if ( freq > 600){
	background(#FF9900);
	ellipse(825,250,freq,freq);
	ellipse(618,375,freq,freq);
	ellipse(1031,375,freq,freq);
	ellipse(412,500,freq,freq);
	ellipse(825,500,freq,freq);
	ellipse(1237,500,freq,freq);
	ellipse(618,625,freq,freq);
	ellipse(1031,625,freq,freq);
	ellipse(825,750,freq,freq);
	image(myImage5, xPos, 300);
	}
	println("Freq is: " + freq);
	}
	void oscEvent(OscMessage theOscMessage) {
	if(theOscMessage.checkAddrPattern("/freq"))
	{
	freq = theOscMessage.get(0).floatValue();
	}
	}

view raw gistfile1.txt hosted with ❤ by GitHub