Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Mehackit Visual arts with Processing, Chapter 0: Self portrait
/*
* Visual arts with Processing
* Chapter 0, The Beginning
* Otso Sorvettula, Mehackit (CC BY-SA 4.0)
*
* This program takes the webcam feed and transforms it into a binary image.
You can draw on the by image using the mouse.
*
* Change the threshold by pressing '+' and '-'.
* Toggle webcam feed on and off with 't'.
* Save image with 's'
*
*/
// Import external libraries
import processing.video.*; // Import a library for webcam
// Create global variables for the whole program to use
Capture cam;
boolean webcamFeedOn = true;
int threshold = 100;
/*
* The setup-function is executed once when the program starts
*
* Check that a camera is found and start camera.
*/
void setup() {
size(640, 480);
String[] cameras = Capture.list();
if (cameras.length == 0) {
println("No cameras found. Exiting.");
exit();
} else {
cam = new Capture(this, 640, 480, 30);
cam.start();
}
}
/*
* The draw-function is looped again and again as long as the program runs.
*
* Draw next image in the webcam feed if the feed is toggled on and draw mouse actions.
*/
void draw() {
drawWebcamImage(); // Manipulate and draw the webcam image
// Draw something on top of the image if the mouse is pressed. You can try to change, comment or uncomment some of these lines.
if (mousePressed) {
stroke(0, 20); // set stroke to almost transparent black
// noStroke(); // turn stroke (outlines) off
// fill(random(100, 255), random(100, 255), random(200, 255), 5); // generate and set almost random fill color
// float r = random(0, 50); // Generate a random value and save it to a variable
// ellipse(mouseX, mouseY, r, r); // Draw a circle to the mouse location with the random diameter
line(mouseX, mouseY, mouseX + random(-50,50), mouseY + random(-50,50)); // Draw a line from the mouse location to a point in 50 pixel radius
}
}
/*
* Manipulate and draw the webcam image
*
* Draw webcam image if webcam feed is toggled on and there's a new image in the webcam feed.
* The new frame is loaded as an array of pixels and the array is iterated over with for loops.
* The brightness on each pixel is checked against a threshold.
* If the brightness is lower than the threshold the pixel is set black, otherwise white.
*/
void drawWebcamImage() {
if (cam.available() && webcamFeedOn) {
cam.read();
loadPixels();
// Iterate through all the pixels of the frame
for (int x = 0; x < cam.width; x++) {
for (int y = 0; y < cam.height; y++) {
int coordinate = x + y * cam.width;
float pixelBrightness = brightness(cam.pixels[coordinate]); // Calculate the brightness of the given pixel in the cameras new frame
if (pixelBrightness < threshold) { // If the pixel is darker than the threshold...
pixels[coordinate] = color(0); // ...set the color of the pixel to this
} else { // If the pixel is lighter than the threshold...
pixels[coordinate] = color(255); // ...set the color of the pixel to this
}
}
}
updatePixels();
}
}
/*
* Listen to key presses and match keys to actions.
*/
void keyPressed() {
if (key == '+') {
threshold++;
threshold = min(threshold, 255);
println("Threshold set to " + threshold);
} else if (key == '-') {
threshold--;
threshold = max(threshold, 0);
println("Threshold set to " + threshold);
} else if (key == 't' || key == 'T') {
webcamFeedOn = !webcamFeedOn;
println("Update screen set to " + String.valueOf(webcamFeedOn));
} else if (key == 's' || key == 'S') {
saveFrame("Processing-portrait-###.png");
println("Image saved");
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment