Recitation 11 Documentation–Blog 14

In this recitation, I experienced a different one. Instead of having a regular exercise-based one, we are arranged to different workshops according to our own needs. For me, I choose the image and video manipulation one because we are going to present images in Processing during our final project. In this workshop, I learnt how to let Processing to monitor the movement of the figures appeared in the video(more precisely the camera) by finding the changes of the color of pixels that are extracted from the images of videos. Moreover, I learnt how to add a circle that will bounce according to the movement of myself, both my hands and my head. After learning the code, I could let the ball bounce when I used my hand or head to hold it, just like how people held the letters in the video that Rudi showed to us last week. The most useful thing that I learnt when the instructor taught us how to create this effect was how to make the ball bounce. I have been curioused about this for quite a long time, but now I know that the key is to add “spdX = -spdX”. 

When considering our final project, I haven’t figure out how to apply this knowledge into it because in our project we don’t need to use the camera of the computer as an input of Processing. But after we finish the important parts of our project and when thinking about how to make the animation more vivid and interesting in Processing, I will try to use this knowledge to improve our project.

video for the workshop:

code for the workshop:

import processing.video.*;
String[] cameras = Capture.list();
Capture cam;
PImage prevCam;
float u;
float v;
float speedV = 5;

void setup() {
  size(640, 480);
  cam = new Capture(this, cameras[0]);
  cam.start();
  prevCam = createImage(cam.width, cam.height, RGB);
  u = random(width);
  v = 100;
}

void draw() {
  if (cam.available()) {
    prevCam.copy(cam, 0, 0, cam.width, cam.height, 0, 0, cam.width, cam.height);
    prevCam.updatePixels();
    cam.read();
  }

  loadPixels();
  for (int x = 0; x < cam.width; x++) {
    for (int y = 0; y < cam.height; y++) {
      int index = x+y*cam.width;
      color currentColor = cam.pixels[index];
      color prevColor = prevCam.pixels[index];
      float rc = red(currentColor);
      float gc = green(currentColor);
      float bc = blue(currentColor);

      float rp = red(prevColor);
      float gp = green(prevColor);
      float bp = blue(prevColor);

      float dist = dist(rc, gc, bc, rp, gp, bp);
      float d = dist(u, v, x, y);
      if (dist > 100) {
        // pixels[index] = color(0);
        //   pixels[index] = color(255);
        if (d<50) {
          speedV = -speedV;
        }
      }
    }
  }
  updatePixels();
  image(cam, 0, 0);
  noStroke();
  circle(u, v, 100);
  v = v+speedV;
  if (v<0 || v> height) {
    speedV = -speedV;
  }
}