Jenny Hu — Project 11: Composition

jenny’s sketch

//Jenny Hu
//Section E
//jjh1@andrew.cmu.edu
//Project 11

var myTurtle;
var startFrame;
var newWeight;
var newColor;
var randWeight;

function setup() {
    createCanvas(400, 400);
    background(250);
    myTurtle = makeTurtle(width / 2, height / 2);
    myTurtle.setColor(color(20));
    myTurtle.penDown();

    resetCanvas();
    frameRate(10);
}

function draw() {
    var step = (frameCount - startFrame)/30.0;
    // timePassed();
    //change the grayness of the turtle
    newColor = random(0 , 70);
    myTurtle.setColor(color(newColor));

    //change the weight of the turtle
    newWeight = random(0,1);
    ink(myTurtle);

    //move my turtle
    myTurtle.forward(step);
    myTurtle.left(16.0);
  
    //stops, so you can admire the cute fingerprint composition
    if (myTurtle.y < 100) {
      myTurtle.penUp();
  }
}

//reset the turtle when you click
function mousePressed(){
     resetCanvas();
}

//reset the turtle
function resetCanvas() {
    background(250);
    startFrame = frameCount;
    myTurtle.penUp();
    myTurtle.goto(width / 2, height / 2);
    myTurtle.penDown();
}

//changes the weight of the turtle to resemble ink
function ink(myTurtle){
  randWeight = random(0 , 2);
  newWeight = newWeight + randWeight;
  myTurtle.setWeight(newWeight);
}

///API Below///


function turtleLeft(d) {
    this.angle -= d;
}


function turtleRight(d) {
    this.angle += d;
}


function turtleForward(p) {
    var rad = radians(this.angle);
    var newx = this.x + cos(rad) * p;
    var newy = this.y + sin(rad) * p;
    this.goto(newx, newy);
}


function turtleBack(p) {
    this.forward(-p);
}


function turtlePenDown() {
    this.penIsDown = true;
}


function turtlePenUp() {
    this.penIsDown = false;
}


function turtleGoTo(x, y) {
    if (this.penIsDown) {
      stroke(this.color);
      strokeWeight(this.weight);
      line(this.x, this.y, x, y);
    }
    this.x = x;
    this.y = y;

}


function turtleDistTo(x, y) {
    return sqrt(sq(this.x - x) + sq(this.y - y));
}


function turtleAngleTo(x, y) {
    var absAngle = degrees(atan2(y - this.y, x - this.x));
    var angle = ((absAngle - this.angle) + 360) % 360.0;
    return angle;
}


function turtleTurnToward(x, y, d) {
    var angle = this.angleTo(x, y);
    if (angle < 180) {
        this.angle += d;
    } else {
        this.angle -= d;
    }
}


function turtleSetColor(c) {
    this.color = c;
}


function turtleSetWeight(w) {
    this.weight = w;
}


function turtleFace(angle) {
    this.angle = angle;
}


function makeTurtle(tx, ty) {
    var turtle = {x: tx, 
                  y: ty,
                  angle: 0.0, 
                  penIsDown: true,
                  color: color(128),
                  weight: 1,
                  left: turtleLeft, 
                  right: turtleRight,
                  forward: turtleForward, 
                  back: turtleBack,
                  penDown: turtlePenDown, 
                  penUp: turtlePenUp,
                  goto: turtleGoTo, 
                  angleto: turtleAngleTo,
                  turnToward: turtleTurnToward,
                  distanceTo: turtleDistTo, 
                  angleTo: turtleAngleTo,
                  setColor: turtleSetColor, 
                  setWeight: turtleSetWeight,
                  face: turtleFace};
    return turtle;
}

For this project, I wanted to do something akin to a ‘computer’s fingerprint’. I was interested to give it the feeling of ink, which makes each print feel unique. Unlike humans where each print is different, a computer is capable of making ‘perfect’ geometries— which makes the spiral feel fitting. Each generation of this spiral is unique though, due to the random generation of both width of each stroke and tone of gray.

Click the mouse anywhere to reset.