Fallon Creech-Project-09-Portrait

sketch

//Fallon Creech
//Section B
//fcreech@andrew.cmu.edu
//Project-09

var underlyingImage;

function preload() {
    var myImageURL = "https://i.imgur.com/nmxNHkl.jpg?1";
    underlyingImage = loadImage(myImageURL);
}

function setup() {
    createCanvas(500, 500);
    background(0);
    underlyingImage.loadPixels();
    frameRate(10);
}

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);
    textStyle(NORMAL);
    textSize(random(15, 25));
    text("sketch", px, py);

    var theColorAtTheMouse = underlyingImage.get(mouseX, mouseY);
    stroke(theColorAtTheMouse);
    textStyle(BOLDITALIC);
    textSize(random(25, 35));
    text("doodle", pmouseX, pmouseY);
}

For this project, I used a picture of a friend sketching in her sketchbook. I decided to differentiate between interactions of the animation by using different text styles and words; the animation randomly generates the word “sketch,” but the word “doodle” appears at the mouse’s location, giving the animation some visual complexity.