A portrait in stripes

What if a Processing sketch would be monitoring a webcam stream, painting and updating an image with vertical stripes. Something like this.


What is going on here? The sketch is drawing vertical stripes every 16 pixels. It is looking at the brightness of the video image at each point, and then drawing a short vertical stroke. Lighter points result in a lighter, thinner stroke, darker points in a darker, broader stroke.

When we look at the resulting image, it looks like the vertical lines would have been hand painted with ink, but actually the lines consist of short vertical strokes of varying thickness and brightness.

If we draw the same image with horizontal strokes instead, we get a completely different picture. The features of the face that can be seen in the picture are simply different. I can recognize myself in the picture with vertical stripes, but not in this one.


In fact, this image with horizontal lines reminds me of Nipkow disk, a primitive attempt to implement television in the 1930s using a rotating disk with holes.

So I’ll rather stick with vertical strokes, and perhaps pour me a glass of good Calvados:



The basic idea in a code snippet:

    background(237, 237, 237, 100) ;
    noSmooth() ;
    int delta = 16 ;
    for(int x1 = delta; x1 < width; x1 = x1 + delta) { 
       for (int y1 = 0; y1 < height; y1 = y1 + 2) {
         color c2 = video.pixels[int(x1) + int(y1)*video.width] ;
         w = int((255 - brightness(c2))/255 * 16) ;     
         w = constrain(w, 1, 16) ;
         line(x1, y1, x1, y1+1) ;                     


Leave a Reply

Your email address will not be published. Required fields are marked *