katieche-project 09

katieche-09

var underlyingImage;

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

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

function draw() {
    var px = random(width);
    var py = random(height);

    var w = random(0,20);
    var h = random(0,20);

    var ix = constrain(floor(px), 0, width);
    var iy = constrain(floor(py), 0, height);
    var theColorAtLocationXY = underlyingImage.get(ix, iy);

    noStroke();
    fill(theColorAtLocationXY);
    arc(px, py, w, h, PI+QUARTER_PI, TWO_PI);
    arc(px, py, w, h, PI+QUARTER_PI, TWO_PI);
    arc(px, py, w, h, PI+QUARTER_PI, TWO_PI);
    arc(px, py, w, h, PI+QUARTER_PI, TWO_PI);
    arc(px, py, w, h, PI+QUARTER_PI, TWO_PI);
    arc(px, py, w, h, PI+QUARTER_PI, TWO_PI);

    var theColorAtTheMouse = underlyingImage.get(mouseX, mouseY);
    fill(theColorAtTheMouse);
    noStroke();
    var z = random(0,80);
    var d = random(0, 10);
    ellipse(mouseX, mouseY, d,d);
    arc(pmouseX, pmouseY, w, h, PI+QUARTER_PI, TWO_PI);
}

My code creates lots of small arcs in random areas like scales. I was inspired by when you run your finger through scales and the sheen on them changes. The mouse also creates small ellipses like a brush, if you’d like to speed up the image creation process.