Connor McGaffin – Project 03 – Dynamic Drawing

sketch

/*
Connor McGaffin
Section C
cmcgaffi@andrew.cmu.edu
Project-03
*/

var a = 0
var angle = 0

function setup() {
    createCanvas(640, 480);
}

//opening elevator door
function mousePressed(){
        a += 20;
}

function draw() {

    //change background color changes upon horizontal movement
    var c = mouseX / 2 * 2
    background(c, c, 100);

    //floors
    rectMode(CORNER);
    fill(240,0,0);
    rect(0,100,width,10);
    rect(0,240,width,10);
    rect(0,380,width,10);
    
    //shaft
    rectMode(CENTER);
    fill(0);
        rect(width / 2, height / 2,100,height)

    //clockwise shaft gears
        fill(80);
        push();
        translate(width / 2,100);
        rotate(radians(angle));
        rectMode(CENTER);
        rect(0,0,40,40);
        pop();

        push();
        translate(width / 2,0);
        rotate(radians(angle));
        rectMode(CENTER);
        rect(0,0,50,50);
        pop();

        angle = angle + 1;


    //elevator moves on vertical inverse
    //cable
    fill(250);
        rect(width / 2, height - 340 - mouseY, 10,height);

    //elevator room
    fill(200,200,255);
    strokeWeight(0);
        //elevator shell
        rect(width / 2,height - mouseY,100, 150);
        //elevator couple
        rect(width / 2, height - 85 - mouseY, 50,30);
    
    //elevator room
    fill(230,100,0);
        rect(width / 2, height - mouseY, 90, 130)


    //elevator door gap
    rectMode(CORNER);
    fill(0);
    rect(width / 2 + 45, height - mouseY - 65, 5, a);


}

In this project, I was inspired by an old iOS game I played as a child called “Tiny Tower” where the primary interface of navigation was via a cross-section of an elevator. In this sketch, I allowed for the inverse control of the elevator through vertical movement of the mouse while it is pressed. Horizontal movement changes the wallpaper color. Clicking on screen opens the door of the elevator. Gears in the elevator shaft run constantly.