Recitation 10: Making a Media Controller-Rahmon Chapoteau (Leon)

For this recitation, I wanted to make a controller that would control the size of the circles in the processing sketch, which would make the live video look either more or less pixelated. The first thing I tired to do was make and control the color and placement of rectangles since I still did not really understand serial communication between Arduino and Processing:

 

After I had a better understanding of this, I got a lot of help from the fellows on how to fill the screen with the circles/pixels, and multiply them as I moved my potentiometer. Although I had trouble understanding how to fill the screen with circles based on how much the potentiometer moved, I did start to have a better understanding of the serial communication between Arduino and Processing. Here is the final result of my project:

Processing 

import processing.video.*;
Capture cam;

int sizeX = 10;

int sizeY = 10;

import processing.serial.*;


Serial myPort;
int valueFromArduino;

void setup() {
  size(640, 480);
  cam = new Capture(this, 640, 480);
  cam.start();
  myPort = new Serial(this, Serial.list()[ 3 ], 9600);
}

void draw() {
   while ( myPort.available() > 0) {
    valueFromArduino = myPort.read();
    println(valueFromArduino);
  }
  
  if (cam.available()) {
    cam.read();
    //can load pixels of camera input
    //just like how we load pixels of an image
    cam.loadPixels();

    int sizeArduino = int(map(valueFromArduino, 0, 255, 5, 20));
    int w = cam.width;
    int h = cam.height;
    for (int y = 0; y < h; y +=sizeArduino) {
      for (int x = 0; x < w; x+=sizeArduino) {


        int i =  x + y*w; // *** IMPORTANT ***

        float r =  red(cam.pixels[i]); 
        float g =  green(cam.pixels[i]);
        float b = blue(cam.pixels[i]);
        float brightness = map(mouseX, 0, width, 0, 255);
        //cam.pixels[i] = color(r+brightness, g+brightness, b+brightness); 

        fill(r, g, b);
        ellipse(x, y, sizeArduino, sizeArduino);


        //include size variable. 
        //if mouseX > ..., decrease size 


        //if ((mouseX <160)) {
        //  sizeX = 5;
        //  sizeY = 5;
        //} else if ((mouseX > 160) && (mouseX <320)) {

        //  sizeX = 10;
        //  sizeY = 10;
        //  //ellipse(x, y, sizeX, sizeY);
        //} else if ((mouseX > 160) && (mouseX <320)) {

        //  sizeX = 10;
        //  sizeY = 10;
        //  //ellipse(x, y, sizeX, sizeY);
        //} else if ((mouseX >320) && (mouseX <480)) {

        //  sizeX = 15;
        //  sizeY = 15;
        //} else if ((mouseX >480) && (mouseX <640)) {
        //  sizeX = 20;
        //  sizeY = 20;
        //}



        //1023 highest for potentiometer, can use map
      }
    }
    cam.updatePixels();
  }
}

//void captureEvent(Capture cam) {
//  cam.read();
//}

Leave a Reply