Steven Fei-Project 09-Portrait

sketch

//Steven Fei
//Project 09
//Section - A
//zfei@andrew.cmu.edu
var underlyingImage;

function preload() {
    // preload the photo
    var myImageURL = "https://i.imgur.com/GI56Ww2.jpg";
    underlyingImage = loadImage(myImageURL);
}

function setup() {
    // setting up the canvas according to the dimensions of the photo
    createCanvas(600, 450);
    background("pink");
    underlyingImage.loadPixels();
    frameRate(400);
}

function draw() {
    
    var px = random(width); // random points to have strokes
    var py = random(height); // random points to have strokes
    var count = int(px) % 2; // decide the conditionals when to apply the two drawing schedules
    var colorAt = underlyingImage.get(px, py); // retrieve the pixel of the photo
    var brightnessAt = brightness(colorAt); // retrieve the brightness of the point
    var light = lightness(colorAt); // retrieve the lightness of the point
    var cR = map(brightnessAt, 0, 255, 4, 12); // maping the corresponding radius and size of the circles and rectangles
    var angle = random(0, PI); // give a random stroke angle 
    noStroke();
    //conditionals to draw some grey scale dirt points when count is 0
    if(count == 0){
        push();
        fill(light, px % width * 0.07);
        translate(px,py);
        circle(0,0,cR * 0.8);
        pop();
    }
    //conditionals to draw the rectangular strokes to re-portray the original photo
    if(count == 1){
        push();
        fill(colorAt, px % width * 0.5);
        rectMode(RADIUS);
        translate(px, py);
        rotate(angle);
        rect(0,0,cR,cR);
        pop();
        //draw a random trace to represent the brush stroke
        stroke(colorAt, px % width * 0.2);
        strokeWeight(2);
        line(px + random(10), py + random(10), px + random(10), py + random(10));
    }
    
    
}

This project is my approach to create an impressionist paintings while giving the drawing some “old-looking” effect by adding the dirt points according to the lightness of each pixel in the original image. Random lines are drawn with the same pixel color to imply a sense of brush or pencil stroking. The larger rectangles are the protagonists in the drawing to fulfill the portrait by occupying relatively large pixel areas.