ashleyc1-Section C-Project-07-Curves

sketch

//Ashley Chan
//Section C
//ashleyc1@andrew.cmu.edu
//Project-07-Curves

var width = 480;

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

}

function draw() {

    background(220);

    drawAstroid();
    drawRanunculoid();

}

//first "shape"
function drawAstroid() {

    var x; 
    var y;
    var b = 40; 

    stroke(255);
    strokeWeight(.5);
    noFill(0);
    beginShape();

    push();
    translate(width/2, height/2);
        for(var i = 0; i < 500; i ++) {

            //llows for lots of different ways shape is being drawn
            var theta = map(i, 0, width, constrain(mouseX, 0, 480) + 600, TWO_PI);

            //astroid parametric formulas
            x = (3 * b * cos(theta)) + (b * cos(3* theta));
            y = (3 * b * sin(theta)) - (b * sin(3* theta));

            vertex(x, y);

            }
            endShape(CLOSE);
            pop();
}

//second "shape"
function drawRanunculoid() {

    var x;
    var y;
    var a = 5; //scales shape

    stroke(200);
    strokeWeight(.5);
    beginShape();
    translate(width/2, height/2);
        for(var i = 0; i < 75; i ++) {

            var theta = map(i, 0, width, 2 * constrain(mouseX, 0, 480) + 600, TWO_PI);

            //ranunculoid parametric formulas
            x = a * (6 * cos(theta)) + (cos(6* theta));
            y = a * (6 * sin(theta)) - (sin(6* theta));

            vertex(x, y);

        }

        endShape(CLOSE);

    //same shape but bigger and falls outside of astroid
    beginShape();
        for(var i = 0; i < 75; i ++) {

            var theta = map(i, 0, width, 2 * constrain(mouseX, 0, 480) + 600, TWO_PI);

            x = 50 * (6 * cos(theta)) + (cos(6* theta));
            y = 50 * (6 * sin(theta)) - (sin(6* theta));

            vertex(x, y);

            }

            endShape(CLOSE);
        
}

I had a lot of fun with this project. My process was just a lot of exploring the different functions via mathworld and playing around with which functions look nice with one another. It was a nice refresher to look at math formulas and think about how they corresponded with the visual compositions it was creating. I also spent a lot of time learning about map() and how to draw complex “shapes” using vertex(). I think there’s a lot of potential of using math as a way to create compelling and dynamic visuals.

Some Stills: