Rjpark – Project 08 – Computational Portrait

computationalportrait

var image;

function preload() {
	// directly loading image through website (no URL variable)
    image = loadImage("https://scontent.fagc2-1.fna.fbcdn.net/v/t31.0-8/c87.61.576.576/p720x720/27788553_1801115783266418_6212879640355992453_o.jpg?_nc_cat=110&_nc_ht=scontent.fagc2-1.fna&oh=cc9c38dd3d5a14dcb13a012cd0973bd2&oe=5C7EA0C1");
}

function setup() {
    createCanvas(480, 480);
    background(0);

    image.loadPixels();
    // makes the pixels load faster
    frameRate(500000000000000);
}

function draw() {
    var px = random(width);
    var py = random(height);
    var ix = constrain(floor(px), 0, width-1);
    var iy = constrain(floor(py), 0, height-1);
    var color = image.get(ix, iy);

    noStroke();
    fill(color);
    // pixels are smaller to make the portrait more detailed
    rect(px, py, 3, 3);
}

At first, I had trouble finding a photo that would fit well into the 480 by 480 canvas so I had to look through multiple photos on different websites to find a photo that would be the perfect size. However, once I found that photo, it was easy to make a computational portrait out of it. I used 3 by 3 rectangles as my surface treatment. Because I made my rectangles so small, I had to increase frame rate to 500 trillion for the portrait to be drawn faster. The final result is below!!