BrandonHyun-Project09

sketch

//Brandon Hyun
//Section B
//bhyun1@andrew.cmu.edu
//project09-PixelArt

var underlyingImage;

function preload() {
  //brings image from Imgur
    var ImageURL = "https://i.imgur.com/oSC8MC5.jpg";
    underlyingImage = loadImage(ImageURL);
}

function setup() {
    //creates canvas that fits the size of the picture
    createCanvas(778, 1219);
    background(0);
    underlyingImage.loadPixels();
    //draws the rectangles in certain speed
    frameRate(150);
}

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 theColorAtLocationXY = underlyingImage.get(ix, iy);

    noStroke();
    fill(theColorAtLocationXY);
    rect(px, py, 30, 70);



}

The portrait gets drawn onto the canvas is a rectangle that creates a mosaic of an image and the following image has the fast FrameRate that reveals the image quickly. I did not want the image to reveal so slowly since its hard for the viewers to view it. I also created the rectangles quite largely so the image can get revealed more quickly.