I chose to explore what could be done with pixels from uploaded to processing images.
Here is a page from Processing website i studied:
https://processing.org/tutorials/pixels/
The idea of exploding pixels in 3d space looks like the perfect respond to the performance I chose last week.
PImage img;
void setup() {
size(300, 300, P3D);
img = loadImage(“ballerina1.jpg”);
}
void draw() {
background(0);
loadPixels();
for ( int x = 0; x < width;x++) {
for ( int y = 0; y < height;y++) {
int loc = x + y*width; // Pixel array location
color c = img.pixels[loc]; // Grab the color
// Calculate a z position as a function of mouseX and pixel brightness
// the brighter the pixel the more it moves to the front
float z = (mouseX/(float)width) * brightness(img.pixels[loc]) – 300.0;
//float z = (500/(float)width) * brightness(img.pixels[loc]) – 300.0;
// Translate to the location (moves pixel), set fill and stroke, and draw the rect
pushMatrix();
translate(x,y,z);
fill(c);
noStroke();
//rectMode(CENTER);
rect(0,0,1,1);
popMatrix();
}
}
// saveFrame(“pixeldance.jpg”); // saves the image
}
Interactivity with sound library:
One of my interests is ability to translate sounds into visuals. I installed Sound and Minim libraries.
http://code.compartmental.net/minim/audioinput_class_audioinput.html
First, I wanted to use sound input received from computer mic to change opacity of the image – make it blink. That sketch does it –
import ddf.minim.*;
PImage img;
Minim minim;
AudioInput in;
void setup()
{
size(400, 400, P3D);
img = loadImage(“ballerina.jpg”);
minim = new Minim(this);
// use the getLineIn method of the Minim object to get an AudioInput
in = minim.getLineIn();
}
void draw()
{
background(0);
stroke(255);
float level = in.mix.level();
tint(255, 255*level);
image(img, 0, 0);
}
Further I tried to combine this idea with last week’s sketch, where pixels created explosive movement by reacting on mouse movement, so this time i decided make them react to sound instead of mouse, here is what I got –
import ddf.minim.*;
PImage img;
//float myOpacity;
Minim minim;
AudioInput in;
float bufferSizeMy;
int i = 0;
void setup()
{
size(400, 400, P3D);
img = loadImage(“ballerina.jpg”);
minim = new Minim(this);
// use the getLineIn method of the Minim object to get an AudioInput
in = minim.getLineIn();
}
void draw()
{
background(0);
//stroke(255);
loadPixels();
// Begin loop for columns
for ( int x = 0; x < width;x++) {
// Begin loop for rows
for ( int y = 0; y < height;y++) {
int loc = x + y*width; // Pixel array location
color c = img.pixels[loc]; // Grab the color
// myOpacity = map ( abs(in.mix.get(i)), 0, .7, 0, 255);
float level = in.mix.level();
// Calculate a z position as a function of mouseX and pixel brightness
float z = level*5 * brightness(img.pixels[loc]) – 100.0;
// Translate to the location, set fill and stroke, and draw the rect
pushMatrix();
translate(x,y,z);
fill(c);
noStroke();
rectMode(CENTER);
rect(0,0,1,1);
popMatrix();
}
}
}
}
The output is pretty much the same (but controlled with the live sound):
