Category Archives: Pixels

**Heart Eyes**

Screen Shot 2014-04-13 at 2.49.53 PMScreen Shot 2014-04-13 at 2.45.08 PM

For this assignment, I wanted play with something that tracks your eyes and places hearts above them, similar to the popular heart eyes emoticon.persons-0007  I tried using the eye detector codes that were up online.. But I couldn’t get any of them to work. I also tried to somehow manipulate the face detection coding.. But that also wasn’t working..  I was getting very annoyed and defeated so I left it alone for awhile and then came back to it and decided to just fiddle with the tracking color.  This however also gave me some problems.  It didn’t help that my hair color is very similar to my eye color at this point in time.. So I had to resort to covering my hair to some degree.. Work can still be done to it… It doesn’t work amazingly, but it’s decent.

 

PImage heart; 
import processing.video.*;
Capture video;
color trackColor; 

void setup() {
  size(640, 480);
  video = new Capture(this, width, height);
  video.start();
  trackColor = color(255, 0, 0);
  heart = loadImage("heart.png");

}

void draw() {
  if (video.available()) {
    video.read();
  }
  video.loadPixels();
  image(video, 0, 0);

  float worldRecord = 1000; 

  int closestX = 0;
  int closestY = 0;

  for (int x = 0; x < video.width; x ++ ) {
    for (int y = 0; y < video.height; y ++ ) {
      int loc = x + y*video.width;
      color currentColor = video.pixels[loc];
      float r1 = red(currentColor);
      float g1 = green(currentColor);
      float b1 = blue(currentColor);
      float r2 = red(trackColor);
      float g2 = green(trackColor);
      float b2 = blue(trackColor);

      float d = dist(r1, g1, b1, r2, g2, b2); 

      if (d < worldRecord) {
        worldRecord = d;
        closestX = x;
        closestY = y;
      }
    }
  }

  if (worldRecord < 1000) { 
    fill(trackColor);
    image(heart, closestX,closestY, 150, 150);
    image(heart, closestX+200,closestY, 150, 150);

  }
}

void mousePressed() {
  int loc = mouseX + mouseY*video.width;
  trackColor = video.pixels[loc];
}

 

Spring!

This game was supposed to be a simple “Welcome” to the spring and a farewell to the winter. I used the color tracking technique, so the player is a bird. In the background, the snow and rain fall. The bird must simply catch the sun and then slowly the bad weather will clear.

To downlaod the e

import processing.video.Capture;
Capture cam;// 
int threshold = 20; 
int aveX, aveY;
float objectR =255;
float objectG = 0;
float objectB = 0;

Shape self;
ArrayList<Shape> sun;
ArrayList<Shape> rain;
ArrayList<Shape> snow;

PFont text;
PImage spring;

int count;

boolean start;
boolean win;

void setup() {
  size(1280, 720);
  println(Capture.list());
  cam = new Capture(this, width, height);
  cam.start();

  //GAME STUFF:
  spring = loadImage("spring.jpg");
  self = new Shape(0, aveX, aveY);
  sun = new ArrayList<Shape>();
  for (int i=0;i<30; i++) {
    sun.add(new Shape(1));
  }

  rain = new ArrayList<Shape>(); 
  for (int i=0;i<40; i++) {
    rain.add(new Shape(3));
  }
  snow = new ArrayList<Shape>();
  for (int i=0;i<20; i++) {
    snow.add(new Shape(2));
  }
  count = 0;

  text = loadFont("HanziPenSC-W5-48.vlw");
  //win = loadImage;

  start = false;
  win = false;
}
void draw() {
  if (cam.available()) {
    cam.read();
    int totalFoundPixels= 0;  //we are going to find the average location of change pixes so
    int sumX = 0;  //we will need the sum of all the x find, the sum of all the y find and the total finds
    int sumY = 0;
    //enter into the classic nested for statements of computer vision
    for (int row = 0; row < cam.height; row++) {
      for (int col = 0; col < cam.width; col++) {
        //the pixels file into the room long line you use this simple formula to find what row and column the sit in 

        int offset = row * cam.width + col;
        //pull out the same pixel from the current frame 
        int thisColor = cam.pixels[offset];

        //pull out the individual colors for both pixels
        float r = red(thisColor);
        float g = green(thisColor);
        float b = blue(thisColor);

        //in a color "space" you find the distance between color the same whay you would in a cartesian space, phythag or dist in processing
        float diff = dist(r, g, b, objectR, objectG, objectB);

        if (diff < threshold) {  //if it is close enough in size, add it to the average
          sumX = sumX + col;
          sumY= sumY + row;
          totalFoundPixels++;
          //if (debug) cam.pixels[offset] = 0xff000000;//debugging
        }
      }
    }
    if (totalFoundPixels > 0) {
      aveX = sumX/totalFoundPixels;
      aveY = sumY/totalFoundPixels;
    }

    if (start==false && win == false) {
      image(cam, 0, 0);
      textFont(text, 32);
      text("Mouse click to begin tracking. Then press '1' to begin the game!", 250, 100);
      self.self_move(aveX, aveY, 0); 
    }
    else if (start == true && win == false) {//begin game
      background(70, 130, 180);
      System.out.println("1");
      //GAME CODE:
      if (count < 10) {
        //40 rain, 20 snow
        //MOVE WEATHER: 
        for (int i=0;i<snow.size()-1; i++) {
          snow.get(i).moveWeather(2);
          if (snow.get(i).checkBoundaries()) {
            snow.get(i).reset_position();
          }
        }
        for (int i=0;i<rain.size()-1; i++) {
          rain.get(i).moveWeather(3);
          if (rain.get(i).checkBoundaries()) {
            rain.get(i).reset_position();
          }
        }
       System.out.println(count);
        for (int i=0;i<sun.size()-1; i++) {
          sun.get(i).moveWeather(1);
          if (sun.get(i).checkBoundaries()) {
            sun.get(i).reset_position();
          }
          if (sun.get(i).check_Collision(self)) {
            count++;
            System.out.println(count);
            sun.remove(i);
          }
        }
        self.self_move(aveX, aveY, 0);
      }//end of score 1 (count < 10)

      else if (count < 15 && count >= 10) { //other score:
      System.out.println("2");
        background(133, 228, 247);
        //30 rain, 10 snow
        for (int i = 0; i<rain.size()-10; i++) {
          rain.remove(i);
        }
        for (int i = 0; i<snow.size()-10; i++) {
          snow.remove(i);
        }
        //MOVE WEATHER:
        for (int i=0;i<snow.size()-1; i++) {
          snow.get(i).moveWeather(2);
          if (snow.get(i).checkBoundaries()) {
            snow.get(i).reset_position();
          }
        }
        for (int i=0;i<rain.size()-1; i++) {
          rain.get(i).moveWeather(3);
          if (rain.get(i).checkBoundaries()) {
            rain.get(i).reset_position();
          }
        }

        for (int i=0;i<sun.size()-1; i++) {
          sun.get(i).moveWeather(1);
          if (sun.get(i).checkBoundaries()) {
            sun.get(i).reset_position();
          }
          if (sun.get(i).check_Collision(self)) {
            count++;
            sun.remove(i);
          }
        }
        self.self_move(aveX, aveY, 0);
      }// End of Score 

      else if (count <  20 && count >= 15) { //other score
      System.out.println("3");
        background(131, 205, 247);
        //25 rain drops, 5 snow
        for (int i = 0; i<rain.size()-4; i++) {
          rain.remove(i);
        }

        for (int i = 0; i<snow.size()-4; i++) {
          snow.remove(i);
          if (snow.get(i).checkBoundaries()) {
            snow.get(i).reset_position();
          }
        }
        for (int i=0;i<rain.size()-1; i++) {
          rain.get(i).moveWeather(3);
          if (rain.get(i).checkBoundaries()) {
            rain.get(i).reset_position();
          }
        }

        for (int j=0;j<snow.size()-1; j++) {
          snow.get(j).moveWeather(2);
          if (snow.get(j).checkBoundaries()) {
            snow.get(j).reset_position();
          }
        }

        for (int i=0;i<sun.size()-1; i++) {
          sun.get(i).moveWeather(1);
          if (sun.get(i).checkBoundaries()) {
            sun.get(i).reset_position();
          }
          if (sun.get(i).check_Collision(self)) {
            count++;
            sun.remove(i);
          }
        }
        self.self_move(aveX, aveY, 0); 
      } //End of Score

      else if (count >= 20) { //other score: 
      System.out.println("4");
        //15 RAIN DROPS
        background(135, 206, 250);
        for (int i = 0; i<rain.size()-4; i++) {
          rain.remove(i);
        }
        snow.clear();
        System.out.println("This is count "+ count);
        //MOVE WEATHER:
        for (int i=0;i<rain.size()-1; i++) {
          rain.get(i).moveWeather(3);
          if (rain.get(i).checkBoundaries()) {
            rain.get(i).reset_position();
          }
        }
        for (int i=0;i<sun.size()-1; i++) {
          sun.get(i).moveWeather(1);
          if (sun.get(i).checkBoundaries()) {
            sun.get(i).reset_position();
          }
          if (sun.get(i).check_Collision(self)) {
            count++;
            sun.remove(i);
          }
        }
        self.self_move(aveX, aveY, 0);
      } //End of Score

      else if (count == 30) {
        System.out.println("5");
         win = true;
         start = false;
        self.self_move(aveX, aveY, 0);
      }
    }//END OF GAME START
    else if(win == true && start == false){
      sun.clear();
      rain.clear();
      background(0, 191, 255);
      image(spring, 0, 0);
      textFont(text, 32);
      text("Happy Spring! Enjoy the warmth.", 500, 100);
      self.self_move(aveX, aveY, 0);
      //draw other image?
    }
       }//End of camera available
  }//End of draw
  void mousePressed() {
    //if they click, use that picture for the new thing to follow
    int offset = mouseY * cam.width + mouseX;
    //pull out the same pixel from the current frame 
    int foundColor = cam.pixels[offset];

    //pull out the individual colors for both pixels
    objectR = red(foundColor);
    objectG = green(foundColor);
    objectB = blue(foundColor);
  }
  void keyPressed() {
    if (key == '1') {
      println("Start the game");
      start = true;
    }
  }

 

Here is my SHAPE class.

 

class Shape {
  //shape color: 
  int r;
  int g;
  int b;

  //shape size
  int shape_width;
  int shape_height;
  int shape_size;

  //shape position
  int x;
  int y; 

  //shape speed
  float velocity_x;
  float velocity_y;

  //Images:
  PImage sun;
  PImage snow;
  PImage bird;

  //for rain: 
  int radius;

  //Constuctor 2: for SNOW + SUN + RAIN
  Shape (int type) {
    switch(type)
    {
    case 1: 
      sun = loadImage("Sun.png"); 
      shape_width = 50; 
      shape_height=50;
      x = (int)random(width); 
      y = 0 - shape_height;  
      velocity_y=(int)random(1, 9);
      break;
    case 2: 
      snow = loadImage ("snowflake.png");
      shape_width = 50; 
      shape_height=50; 
      x = (int)random(width); 
      y = 0 - shape_height; 
      velocity_y = (int)random(1, 9);
      break;
    case 3: 
      radius = 8;
      x = (int)random(width); 
      y= -r*4;
      velocity_y = (int)random(1, 9); 
      shape_height = r*4;
      break;
    }
  }

Shape(int type, int _x, int _y){
      bird = loadImage("Bird.png");
      shape_width=75;
      shape_height=75;
      x = _x;
      y = _y;
}

  void drawshape(int type) {
    stroke(0, 0, 255);
    fill(0, 0, 255);
    switch (type) {
    case 0: 
      image(bird, x, y);
      break;
    case 1: 
      image(sun, x, y);
      break;
    case 2: 
      image(snow, x, y);
      break;
    case 3: 
      for (int i = 2; i < radius; i++ ) {
        ellipse(x, y + i*4, i*2, i*2);
      }
      break;
    }
  }

  //MOVING shape: 
  //for "INPUTS"
  void self_move(int input_x, int input_y,int _type) {
    x=input_x;
    y=input_y;
    this.drawshape(_type);
  }

  void moveWeather(int type) {
    y+=velocity_y;
    this.drawshape(type);
  }

  boolean checkBoundaries() {
    boolean out_of_bounds = false;
    //BOTTOM
    if (y>(height+(1.25*shape_height))) {
      out_of_bounds = true;
    }
    return out_of_bounds;
  }

 void reset_position(){
   y = 0 - shape_height;
   x = (int)random(width);
 }

  //Getter Methods for collision detection 
  int get_X_Position() {
    return x;
  }
  int get_Y_Position() {
    return y;
  }
  int get_shape_Height() {
    return shape_height;
  }

  int get_shape_Width() {
    return shape_width;
  }

  //COLLISION
  boolean check_Collision(Shape temporary) {
    boolean signal = false;
    int temp_x = temporary.get_X_Position();
    int temp_y = temporary.get_Y_Position();
    int temp_shape_height = temporary.get_shape_Height();
    int temp_shape_width = temporary.get_shape_Width();

    if (x < (temp_x + temp_shape_width) && (x+shape_width) > (temp_x )) {   
      if (y < (temp_y + temp_shape_height) && (y+shape_height) > (temp_y )) {
        signal = true;
      }
      else {
        signal = false;
      }
    }
    return signal;
  }
}// End of shape class

 

 

the fuzz

import processing.video.*;
Capture video;

// keep track of the previous frame of video
PImage prevFrame;

// threshold to qualify a pixel as being different
int threshold = 30;

void setup()
{
  size(640, 480);
  video = new Capture(this, 640, 480); 
  video.start(); 
  noStroke();

  // create a previous frame PImage
  prevFrame = new PImage(640, 480);
}

void draw()
{

  if (video.available())
  {
    // take the current frame of video and copy it into our previous frame of video
    video.loadPixels();
    prevFrame.loadPixels();
    arrayCopy(video.pixels, prevFrame.pixels);
    prevFrame.updatePixels();

    // now read a new frame of video
    video.read();
  }

  // display the current frame of the video on the stage
  image(video, 0, 0);

  // load the pixels on the stage 
  loadPixels();

  int woot = 0;

  // now we can figure out which pixels are different between the previous frame and our current frame
  video.loadPixels();
  prevFrame.loadPixels();
  for (int x = 0; x < video.width; x++)
  {
    for (int y = 0; y < video.height; y++)
    {
      // determine our location
      int location = x + y*video.width;

      // compare the pixels
      float curRed   = red(video.pixels[location]);
      float curGreen = green(video.pixels[location]);
      float curBlue  = blue(video.pixels[location]);
      float prevRed   = red(prevFrame.pixels[location]);
      float prevGreen = green(prevFrame.pixels[location]);
      float prevBlue  = blue(prevFrame.pixels[location]);
      float difference = dist(curRed, curGreen, curBlue, prevRed, prevGreen, prevBlue);
      if (difference > threshold)
      {
       //give color so we can see movement 
        pixels[location] = color(163, 255, 240);
        woot++;
      }
    }
  }

  // update the pixels on the screen
  updatePixels();

  //border

  //left
  fill(163, 255, 240);
  rect(0, 0, 20, 480);

  //right
  fill(163, 255, 240);
  rect(620, 0, 20, 480);

  //bottom
  fill(163, 255, 240);
  rect(0, 460, 640, 20);

  //top
  fill(163, 255, 240);
  rect(0, 0, 640, 20);
}

I made a simple motion detector making images out of previous frames. The change in RGB color is detected and then given a color to emphasize the change.

 

Video

This party is so not happening

I tried to use face detect to control the paddle in the Zoolander game. I got stuck  🙁

import processing.video.*;
// Import the library
import gab.opencv.*;

//audio
import ddf.minim.*;
AudioPlayer player;
Minim minim;

//declare variables
PImage bgdimg;
PImage mugatu;
PImage primeMini;
float circleA = 100;
float circleB = 50;
float speedA = 5;
float speedB = 2;
int new_x;
int xpos;
int points = 0;
int miss = 0;

// Library object
OpenCV opencv;

// Capture object
Capture cam;

// Array of faces found
Rectangle[] faces;

void setup() {
  size(595, 325, P2D);
  bgdimg = loadImage("magnum.jpg");
  mugatu = loadImage("mugatu.png");
  primeMini = loadImage("prime_minister.jpg");
  smooth();

  //insert video stuff here
  // Start capturing
  cam = new Capture(this, 320, 240);
  cam.start();

  // Create the OpenCV object
  opencv = new OpenCV(this, cam.width, cam.height);

  // Which "cascade" are we going to use?
  opencv.loadCascade(OpenCV.CASCADE_FRONTALFACE);  
  //opencv.loadCascade(OpenCV.CASCADE_EYE);  
  //opencv.loadCascade(OpenCV.CASCADE_NOSE);

  //initialize minim
  minim = new Minim(this);
  player = minim.loadFile("Relax.mp3", 2048);
  player.play();
}
// New images from camera
void captureEvent(Capture cam) {
  cam.read();
}
void draw() {
  float paddle = 1000 / (points + 10);
  background (bgdimg);
  opencv.loadImage(cam);
  // Detect the faces
  faces = opencv.detect();

  //figure out what to do here
  // If we find faces, draw them!
  if (faces != null) {
    for (int i = 0; i < faces.length; i++) {
      //strokeWeight(2);
      //stroke(255,0,0);
      //noFill();
      rect(faces[i].x, faces[i].y, faces[i].width, faces[i].height);
    }

    // ye olde paddle stuff
    if (circleA < 0 || circleA > width)
      speedA = -speedA;
    if (circleB > height) {
      speedB = -speedB;
      float distance = abs(faces[i].x - circleA);
      if (distance < paddle)
        points += 1;
      else miss += 1;
    }
    else
      speedB += 1; 

    circleA = circleA + speedA;
    circleB = circleB + speedB;

    rect(xpos-paddle, height-10, 100, 125);
    fill(225, 10, 50);
    image(mugatu, circleA, circleB);

    if (miss > 5 && miss < 15) {
      textSize(18);
      text("KILL THE MALAYSIAN PRIME MINISTER!", width/4, height/2);
    }
    if (miss > 20) {
      textSize(18);
      fill (0);
      text("YOU'VE LOST", width/2, height/2);
      background(primeMini);
    }
  }
}

 

Janky Sticker Tracking

jankystickerMy intention this week was to use color tracking to track the weird sticker I found. Simply by copying and pasting the color tracking code and making a few small adjustments, I was able to get my camera to track the weird sticker I found successfully. I learned a lot from this, and started to understand the code, but it’s nothing new. However, what I hoped for was to use a mouse click to change the background entirely so that the only thing we see is the color that’s being tracked.  That way, it can sort of be used as a little identification card so if someone wears it in a crowd of people, we only see the sticker/or the tracker. Another step to this would be to track the movement of whoever is wearing the sticker by drawing a line from their various positions. Unfortunately, I couldn’t figure out how to activate this. Here’s the basic code for the color tracing though (it’s not exactly original though!)

import processing.video.*;

// Variable for capture device
Capture video;

// A variable for the color we are searching for.
color trackColor; 

void setup() {
  size(320, 240);
  video = new Capture(this, width, height);
  video.start();
  // Start off tracking for red
  trackColor = color(255, 0, 0);
}

void draw() {
  // Capture and display the video
  if (video.available()) {
    video.read();
  }
  video.loadPixels();
  image(video, 0, 0);

  // Before we begin searching, the "world record" for closest color is set to a high number that is easy for the first pixel to beat.
  float worldRecord = 500; 

  // XY coordinate of closest color
  int closestX = 0;
  int closestY = 0;

  // Begin loop to walk through every pixel
  for (int x = 0; x < video.width; x ++ ) {
    for (int y = 0; y < video.height; y ++ ) {
      int loc = x + y*video.width;
      // What is current color
      color currentColor = video.pixels[loc];
      float r1 = red(currentColor);
      float g1 = green(currentColor);
      float b1 = blue(currentColor);
      float r2 = red(trackColor);
      float g2 = green(trackColor);
      float b2 = blue(trackColor);

      // Using euclidean distance to compare colors
      float d = dist(r1, g1, b1, r2, g2, b2); // We are using the dist( ) function to compare the current color with the color we are tracking.

      // If current color is more similar to tracked color than
      // closest color, save current location and current difference
      if (d < worldRecord) {
        worldRecord = d;
        closestX = x;
        closestY = y;
      }
    }
  }

  // We only consider the color found if its color distance is less than 10. 
  // This threshold of 10 is arbitrary and you can adjust this number depending on how accurate you require the tracking to be.
  if (worldRecord < 5) { 
    // Draw a circle at the tracked pixel
    fill(trackColor);
    strokeWeight(4.0);
    stroke(0);
    ellipse(closestX, closestY, 16, 16);
  }
}

void mousePressed() {
  // Save color where the mouse is clicked in trackColor variable
  int loc = mouseX + mouseY*video.width;
  trackColor = video.pixels[loc];

}

 

It’s Raining, It’s Pouring (Brain Tracking)

So I was busy and just kept my program simple. I just took the color tracking program, made the ellipse into a bucket, and added falling raindrops. If you catch 20 raindrops “Winner!” shows up on the screen. I tried to add sound but I kept getting a NullPointerException so I just am using external sound. I also tried to have an image appear that said “Winner!” instead of just text but it gave the same error. As for the brain, well I just had it laying around and needed something colorful.

Here is the program in action.
Here is the program in action.

And here’s the code, I didn’t clean it up because I was busy, but it works!

//tracking the average pixel makes it shake less
//Sound and winning sign I wanted not working.
import processing.video.Capture;
Capture cam;// regular processing libary
int threshold = 20; //255 is white, 0 is black
int aveX, aveY; //this is what we are trying to find
float objectR =255;
float objectG = 0;
float objectB = 0;
boolean debug = true;
int lastTime, ellapsedTime; //for checking performance
//import ddf.minim.*;
//Minim m;
//AudioPlayer raindropFalling;
//PImage winning;

Raindrop[] rain = new Raindrop[20];
int howManyCaught = 0;
void setup() {
  size(640, 480);
  println(Capture.list());
  cam = new Capture(this, width, height);
  cam.start();

  //m = new Minim(this);
  //raindropFalling = m.loadFile("raindrops-processing.wav",1024);

  for (int i = 0; i<20; i++) {
    rain[i] = new Raindrop();
  }
  //winning = loadImage("http://bbsimg.ngfiles.com/1/24409000/ngbbs50e4c4e6e051d.jpg");
}
void draw() {
  //raindropFalling.play();
  //raindropFalling.rewind();
  if (cam.available()) {
    ellapsedTime = millis() - lastTime;  //find time since last time, only print it out if you press "t"
    lastTime = millis();  //reset timer for checking time next fram
    cam.read();
    int totalFoundPixels= 0;  //we are going to find the average location of change pixes so
    int sumX = 0;  //we will need the sum of all the x find, the sum of all the y find and the total finds
    int sumY = 0;
    //enter into the classic nested for statements of computer vision
    for (int row = 0; row < cam.height; row++) {
      for (int col = 0; col < cam.width; col++) {
        //the pixels file into the room long line you use this simple formula to find what row and column the sit in 

        int offset = row * cam.width + col;
        //pull out the same pixel from the current frame 
        int thisColor = cam.pixels[offset];

        //pull out the individual colors for both pixels
        float r = red(thisColor);
        float g = green(thisColor);
        float b = blue(thisColor);

        //in a color "space" you find the distance between color the same whay you would in a cartesian space, phythag or dist in processing
        float diff = dist(r, g, b, objectR, objectG, objectB);

        if (diff < threshold) {  //if it is close enough in size, add it to the average
          sumX = sumX + col;
          sumY= sumY + row;
          totalFoundPixels++;
          if (debug) cam.pixels[offset] = 0xff000000;//debugging
        }
      }
    }
    image(cam, 0, 0);
    if (totalFoundPixels > 0) {
      aveX = sumX/totalFoundPixels;
      aveY = sumY/totalFoundPixels;
      stroke(255);
      fill(100);
      quad(aveX, aveY, aveX+20, aveY+100, aveX+80, aveY+100, aveX+100, aveY);
    }
  }
  for (int i = 0; i<20; i++) {
    rain[i].drop();
    catchdrop(i);
  }
  if (howManyCaught >= 20) {
    textSize(160);
    fill(0,255,0);
    text("Winner!", 50, 200);
    //image(winning, 640, 480);
  }
}

void catchdrop(int tempNum) {
  if ( dist(aveX+55, aveY, rain[tempNum].x, rain[tempNum].y) <= 50) {
    rain[tempNum].y = -20;
    howManyCaught++;
  }
}

/*void stop() {
  raindropFalling.close();
  m.stop();
  super.stop();
}*/

void mousePressed() {
  //if they click, use that picture for the new thing to follow
  int offset = mouseY * cam.width + mouseX;
  //pull out the same pixel from the current frame 
  int thisColor = cam.pixels[offset];

  //pull out the individual colors for both pixels
  objectR = red(thisColor);
  objectG = green(thisColor);
  objectB = blue(thisColor);
  println("Chasing new color  " + objectR + " " + objectG + " " + objectB);
}
void keyPressed() {
  //for adjusting things on the fly
  if (key == '-') {
    threshold--;
    println("Threshold " + threshold);
  } 
  else if (key == '=') {
    threshold++;
    println("Threshold " + threshold);
  }
  else if (key == 'd') {
    background(255);
    debug = !debug;
    println("Debug " + debug);
  }
  else if (key == 't') {
    println("Time Between Frames " + ellapsedTime);
  }
  else if (key == 'r') {
    howManyCaught = 0;
  }
}

 

 

Popping Bubbles

hello earthlings

this week i decided to pop bubbles with video

//tracking the average pixel makes it shake less
import processing.video.Capture;
Capture cam;// regular processing libary
int threshold = 20; //255 is white, 0 is black
int aveX, aveY; //this is what we are trying to find
float objectR =255;
float objectG = 0;
float objectB = 0;
Bubble [] theBubbles = new Bubble[30];
Mouse theMouse;

void setup() {
  size(640, 480);
  println(Capture.list());
  cam = new Capture(this, width, height);
  cam.start();
  theMouse = new Mouse();
  for (int i=0; i<theBubbles.length; i++) {
    theBubbles[i] = new Bubble (50);
  }
}

void draw() {
  for (int i=0; i<theBubbles.length; i++) {
    theBubbles[i].move();
    theBubbles[i].display();
    theBubbles[i].boundary();
  }
  if (cam.available()) {
    cam.read();
    int totalFoundPixels= 0;  //we are going to find the average location of change pixes so
    int sumX = 0;  //we will need the sum of all the x find, the sum of all the y find and the total finds
    int sumY = 0;
    //enter into the classic nested for statements of computer vision
    for (int row = 0; row < cam.height; row++) {
      for (int col = 0; col < cam.width; col++) {
        //the pixels file into the room long line you use this simple formula to find what row and column the sit in 

        int offset = row * cam.width + col;
        //pull out the same pixel from the current frame 
        int thisColor = cam.pixels[offset];

        //pull out the individual colors for both pixels
        float r = red(thisColor);
        float g = green(thisColor);
        float b = blue(thisColor);

        //in a color "space" you find the distance between color the same whay you would in a cartesian space, phythag or dist in processing
        float diff = dist(r, g, b, objectR, objectG, objectB);

        if (diff < threshold) {  //if it is close enough in size, add it to the average
          sumX = sumX + col;
          sumY= sumY + row;
          totalFoundPixels++;
        }
      }
    }
    image(cam, 0, 0);
    if (totalFoundPixels > 0) {
      aveX = sumX/totalFoundPixels;
      aveY = sumY/totalFoundPixels;

      for (int i=0; i<theBubbles.length; i++) {

        if (theMouse.intersect(theBubbles[i])) {
          theBubbles[i].pop();
        }
      }
    }
  }
}
void mousePressed() {
  //if they click, use that picture for the new thing to follow
  int offset = mouseY * cam.width + mouseX;
  //pull out the same pixel from the current frame 
  int thisColor = cam.pixels[offset];

  //pull out the individual colors for both pixels
  objectR = red(thisColor);
  objectG = green(thisColor);
  objectB = blue(thisColor);
  println("Chasing new color  " + objectR + " " + objectG + " " + objectB);
}

}

 

class Bubble {
  float x;
  float y;
  float ySpeed;
  float d = 5;

  Bubble(float tempD) {
    x = random(0, width);
    y = height;
    ySpeed = random(0.5, 1.5);
    d = tempD;
  }

  void move() {
    x = x + random(-1, 1);
    y = y -ySpeed;
  }

  void display() {
    strokeWeight(5);
    stroke(0, 0, 255, 180);
   fill(0, 0, 255, 180);
    ellipse(x, y, d, d);
  }

void pop(){
  x = width * 2;
  y = height * 2;
  ySpeed = 0;
}
  void boundary() {
    if (y < d/2) {
      y = height;
    }
  }
}

 

class Mouse {
  float mousex, mousey;
  float r;
  float m;

  Mouse() {
    r = 5;
  }

  boolean intersect(Bubble b) {
    float distance = dist(aveX-10, (aveY-10), b.x, b.y);
    if (distance < r + b.d) {
      return true;
    } 
    else
    {
      return false;
    }
  }
}

 

Music Video redefined

Video feed where certain pixels change color based on their brightness, which the color being based on MUSIC. MUSIC. VIDEO. get it?

I realized I have no idea how sound works, so this is very bruteish.

CALEB IS DOG

K so…

1. Pick an mp3 from your music library

2. Copy/paste this code into processing, save it under whatever name you want

3. Add a folder titled “data” to the folder containing the .pde filde

4. rename your favorite mp3 file “crispy.mp3” and place it in the data folder

5. Run da trackkkkkkkkkk

import processing.video.*;
import ddf.minim.analysis.*;
import ddf.minim.*;
float musicColor;

Capture     video;
Minim       minim;
AudioPlayer crispy;
FFT         fft;

void setup() {
  size(600, 600/*, P3D*/);
  video = new Capture(this, 320, 240);
  minim = new Minim(this);
  video.start();
  crispy = minim.loadFile("crispy.mp3", 1024);
  crispy.loop();
  fft = new FFT(crispy.bufferSize(), crispy.sampleRate());
}

void draw( ) {
  fft.forward(crispy.mix);
  for(int j = 0; j < fft.specSize(); j++)
      musicColor = fft.getBand(j)*750;
      print(musicColor);
      println();
  if ( video.available() ) {
    video.read();  //read in the new image if it is available
  }
  for (int i = 0; i < video.pixels.length;  i++) {  //you can ask the pixel array how long it is
    if (brightness(video.pixels[i]) < 140 && brightness(video.pixels[i]) > 80) {  //check the brightness of the pixel
      video.pixels[i] = color(random(0,musicColor), random(0,musicColor), random(0,musicColor), random(0,150));  //set the pixel to purble if it is bright
    }
  }
  image(video, 0, video.height);
}

 

zip_a_dee_do0_dah

I decided to switch out my last travolta post with a different one. I wanted to make to I could have a bird (a bluebird) perched on my shoulder. So I wrote a little bit of code to make that possible…

I kind of ran into similar issues that I had with my previous Travolta mask. This time, I used a pink post it note as my distinct color for the bird image to attach to. However, because the image of the bird (even though its a PNG/transparent image) is larger than the bird itself, the image wouldn’t lock directly onto the pink square. Instead, it fell about a few pixels below (as you can see with the screenshot below.) Thus, my original plan to stick the post it note to my shoulder failed…

 

Screen Shot 2014-05-05 at 3.31.37 AM

 

The bird still moves around a bit. When it’s on my other shoulder…It kind of looks like its pecking at my head. I think this is because there is a bit of pink in my skin/lips.

here’s my code:

PImage bluebird; 
import processing.video.*;
Capture video;
color trackColor; 

void setup() {
  size(800, 480);
  video = new Capture(this, width, height);
  video.start();
  trackColor = color(255, 130, 251);
  bluebird = loadImage("bluebird.png");  
}

void draw() {
  if (video.available()) {
    video.read();
  }
  video.loadPixels();
  image(video, 0, 0);

  float worldRecord = 500; 

  int closestX = 0;
  int closestY = 0;

  for (int x = 0; x < video.width; x ++ ) {
    for (int y = 0; y < video.height; y ++ ) {
      int loc = x + y*video.width;
      color currentColor = video.pixels[loc];
      float r1 = red(currentColor);
      float g1 = green(currentColor);
      float b1 = blue(currentColor);
      float r2 = red(trackColor);
      float g2 = green(trackColor);
      float b2 = blue(trackColor);

      float d = dist(r1, g1, b1, r2, g2, b2); 

      if (d < worldRecord) {
        worldRecord = d;
        closestX = x;
        closestY = y;
      }
    }
  }

  if (worldRecord < 1000) { 
    fill(trackColor);
    image(bluebird,closestX, closestY, 250, 250);
  }
}

void mousePressed() {
  int loc = mouseX + mouseY*video.width;
  trackColor = video.pixels[loc];
}

 

 

Sex Bomb

IMG_2355

For this week, I used the camera to detect a light on my dogs head, and used processing to place a crown there, thus making him a pretty, pretty princess. It’s a pretty simple design, and I mostly used/modified Dan’s color pixel chase code. The LED is just an LED hooked up to two batteries with some tape. I found it works better when following a light. It would be cool to explore that with infrared as well, but I had a hard time getting my IR LED to work right.

IMG_2357

video!

http://youtu.be/zgxtE626SjI

code!

import ddf.minim.spi.*;
import ddf.minim.signals.*;
import ddf.minim.*;
import ddf.minim.analysis.*;
import ddf.minim.ugens.*;
import ddf.minim.effects.*;

import processing.video.*;//this library downloads with processing
Capture cam;
float idealRed = 17; 
float idealGreen = 123; 
float idealBlue = 184;
PImage tiara;

Minim minim;
AudioPlayer sou; //variable name;

void setup() {
  size(640, 480);
  minim = new Minim(this);
  sou = minim.loadFile("Sex bomb.mp3");
  sou.loop();
  cam = new Capture(this,Capture.list()[0]);
  cam.start();     
  tiara = loadImage ("tiara 2.png");
}
void mousePressed(){
  //click to pick a color to chase
  int thisPixel = cam.pixels[mouseY* cam.width + mouseX];
  idealRed = red(thisPixel);
  idealGreen = green(thisPixel);
  idealBlue =  blue(thisPixel);
  println("ideal" + idealRed+ " " + idealGreen + " " + idealBlue);
}
void draw() {
  if (cam.available()) {
    cam.read();

    float closestSoFar = 65000; //start out very far away
    int winnerX = 0;
    int winnerY = 0;
    for(int row = 0; row < cam.height; row++){
      for(int col = 0; col < cam.width; col++){
        int offset = row*cam.width + col;
        int thisPixel = cam.pixels[offset];
        //color comes out as one big number, have to tease out component colors
        float currentR = red(thisPixel);
        float currentG = green(thisPixel);
        float currentB = blue(thisPixel);
        //find the distance in color space between the current pixel and ideal
        float closeness = dist(currentR,currentG,currentB,idealRed, idealGreen, idealBlue);
        //check to see if this beats the world record for best match so far
        if (closeness < closestSoFar ){
          winnerX = col;
          winnerY = row;
          closestSoFar = closeness; //update the world record to this match
        }
      }
    }
    image(cam,0,0);
    //fill(255,0,0);
    image(tiara, winnerX -50 , winnerY -50 ,100,100); //draw a tiara over the winner

  }
}

 

STAY SEXY GUYS!!!

brightness & tint

is this the right section? i’m not sure. here is one of the things i tried to do with video this week, which is to change the tint of the video depending on the amount of brightness change. i also made a few other programs that all add a video filter type of thing depnding on motion, but haven’t been able to do anything very interesting. what i really want right now is to change the tint of the whole video to different colors depending on location of the movement on the screen. this is really just mr. shiffman’s example of total motion

brightness tint video

import processing.video.*;

Capture video;
PImage prevFrame;
float threshold = 50;

void setup() {
  size(1280,720);
  video = new Capture(this, width, height, 15);
  prevFrame = createImage(video.width,video.height,RGB);
  video.start();
}

void draw() {
  background(0);

  image(video,0,0);

  if (video.available()) {
    prevFrame.copy(video,0,0,video.width,video.height,0,0,video.width,video.height);
    prevFrame.updatePixels();
    video.read();
  }

  loadPixels();
  video.loadPixels();
  prevFrame.loadPixels();

  float totalMotion = 0;

  for (int i = 0; i < video.pixels.length; i ++ ) {
    color current = video.pixels[i];

    color previous = prevFrame.pixels[i];

    float b1 = brightness(current); 
    float b2 = brightness(previous);
    float diff = dist(b1,b1, b2, b2);
    totalMotion += diff; 
  }

 float avgMotion = totalMotion / video.pixels.length; 

//change tint depending on how much motion there is
 tint(avgMotion*4, 0, avgMotion*4);

}