// Jamie Park (jiminp) Project 9
// Section E
var myPic;
function preload(){
//preload image from imgur
var meURL = "https://i.imgur.com/XmiI0Iq.jpg";
myPic = loadImage(meURL);
}
function setup(){
//createCanvas and fill in the background
createCanvas(400, 300);
background(0);
//load the pixels of the image
myPic.loadPixels();
frameRate(60);
}
function draw(){
//draw rectangles at random points
var px = random(width);
var py = random(height);
//crate variables that would fit into acquiring the colors of the image
var cx = constrain(floor(px), 0, width);
var cy = constrain(floor(py), 0, height);
var colorLocation = myPic.get(cx, cy);
//generate rectangular color blocks
noStroke();
fill(colorLocation);
var ran = random(20);
rect(px, py, ran, ran, random(10));
}
I created a computational portrait of a picture of me. In addition to randomizing the size of the squares, I randomized the degrees of angle in the edges, layering soft and hard rectangles on top of each other.
I really enjoyed this coding process and it was nice to see the final product come together and create a picture of me.
Process (left) and final product (right)
The photo I used to code my project