Category: Project-11-Composition

afukuda-Project11-Composition

sketch

/* 
 * Name | Ai Fukuda 
 * Course Section | C 
 * Email | afukuda@andrew.cmu.edu
 * Project | 11
 */ 

var myTurtle; 

function setup() {
  createCanvas(400, 400);
  background(193, 228, 221);

  myTurtle = makeTurtle(width/2, height/2);  // set turtle at center of canvas 
  myTurtle.setColor(color(140, 164, 212));   // set stroke color 
  myTurtle.setWeight(1); 
  myTurtle.penDown();                        // initialize turtle 

  frameRate(2);
}


function draw() {
  var sideLength = 20;             // set initial side length of rectangle 

  for (i=0; i<50; i++) {
    myTurtle.forward(sideLength);
    myTurtle.right(90);
    myTurtle.forward(sideLength);
    myTurtle.right(90);
    myTurtle.forward(sideLength);
    myTurtle.right(90);
    myTurtle.forward(sideLength);
    myTurtle.right(90);

    myTurtle.penUp();              // put pen up while rotation of rectangles are occuring 
    myTurtle.right(15);            // rotate rectangle by 30 degrees 
    myTurtle.penDown();            // put pen down 

    sideLength *= 1.05;            // increase side length by 1.05  
  }
}


// Turtle graphics implementation for p5.js:
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 used this week’s lab as an underlying base, as I wanted to develop it further and make it dynamic and more intricate, since I saw a potential for it to become a compelling piece of work. Using ‘Turtle Example 2’ as a guide, each loop creates an array of rotated squares, which is overall rotated to gradually fill the canvas. While working on this project, I was playing around with the value of angle of rotation, and I was intrigued with how a slight change in angle of rotation causes a significant change in the overall affect the aggregate conveys. In the current configuration the angle of rotation is set to 15, which conveys a spiraling, sea-shell like geometry. While an angle of rotation of 30 conveys a more radial aggregation (see below for visuals).

 

 

 

 

[screenshot of final project]

 

 

 

 

[screenshot of project with angle of rotation of 30]

 

 

 

 

[screenshot of lab assignment + initial sketch of project]

 

Project 11- Turtles!

Customwall

var myTurtle; //my turtyle variable
var distToM; //variable for distance between turtle and mouse 
var MyTurtles = []; //turtle array 

function setup() {
    createCanvas(480, 480); //canvas size   
    background(0); //background to black
    frameRate(10); //frame rate to 10

    for (var v =0; v < 6; v ++){
    for (var i = 0; i < 12; i ++){
        var turs = makeTurtle(20+i*(width/12),40+v*(height/6)); //create turtles in array 
        MyTurtles.push(turs);
    }
}
}

function draw() {
    for (var t = 0; t < MyTurtles.length;t++){
        distToM =MyTurtles[t].distanceTo(mouseX,mouseY); // get distance of mouse to each turtle
        var redist = map(distToM,0,600,0,360); //remap the distance 
        MyTurtles[t].penDown(); //pendown to true
        MyTurtles[t].setWeight(2); //set weight to 2
        if (redist < 180){ // if remappe is less than 180 
            MyTurtles[t].right(redist); // turn right with remapped value
        }
        else 
       { MyTurtles[t].left(redist); //if not turn left with remapped value
       }

        MyTurtles[t].forward(5); //constantly moving 5 steps
       
    }
}
function mousePressed(){
    var ran = int(random(0,72)) //get random turtle in array
    MyTurtles[ran].setColor(color(random(0,255),random(0,255),random(0,255))); //random color when mouse pressed 
}


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;}

Iterations: 

For this project, I have thought of the wall paper project that we have done in past. I wanted to see if I could come up with a randomly generating turtles spaced apart that will create certain pattern to create custom wall paper  based on movement of the turtle.

I made the turtles’ color to change randomly whenever user clicks on.

For the movement, I wanted them to keep the constant speed but different direction based on the mouse position. I have calculated the distance from each turtle to the mouse location and let the turtles to turn based on the distance and its decision factor on to turn right or left.

I have came up with two different iteration playing with the code.

Enjoy.

Jihee Kim_SectionD_Project-11-Composition

jiheek1_project11

//Jihee Kim
//15-104 MWF 9:30
//jiheek1@andrew.cmu.edu
//Project-11-Composition
//section D


var myTurtle;
var step = 10; // each tick (segment) is a multiple of 10
var angle = 60; // the turtle almost always turns 60 degrees on its way

var snow = []; // an array of all snow particles



function setup() {
    createCanvas(462, 400);
    // initialize snow
   for (var s = 0; s < 1500; s++){ // loop through snows
       var snowPositionX = random(width); // the x position of the snow is
                                          // random along the width of canvas
       var snowPositionY = random(0, height);
       snow[s] = makeSnow(snowPositionX, snowPositionY);
   }
}


function draw() {
    //gradient background
    // draw the gradient background for the blue snowy sky
    var top = color(188, 232, 231); // light blue
    var bottom = color(35, 232, 227); // darker sky blue
    Gradient(0, width, top, bottom);

    myTurtle1 = makeTurtle(3, 75 * sqrt(3) + 4); // place the first turtle
    myTurtle2 = makeTurtle(3, 150 * sqrt(3) + 4); // place the second turtle
    myTurtle3 = makeTurtle(3, 225 * sqrt(3) + 4); // place the second turtle
    turtleX = 3; // keep track of turtle's x position
    // while the distance between turtle1 and the end of canvas is greater
    // than 0, keep drawing the pattern
    while (myTurtle1.x < width) {
        turtleX = turtleX + 320; //disposition of each Sierpinski tri. is 320
        myTurtle1.penDown(); // snowt Sierpinski Triangle
        myTurtle1.forward(step);
        myTurtle1.left(angle);
        myTurtle1.forward(step);
        myTurtle1.left(angle);
        myTurtle1.forward(step);
        myTurtle1.right(angle);
        myTurtle1.forward(step);
        myTurtle1.right(angle);
        myTurtle1.forward(step);
        myTurtle1.right(angle);
        myTurtle1.forward(step);
        myTurtle1.right(angle);
        myTurtle1.forward(step);
        myTurtle1.left(angle);
        myTurtle1.forward(step);
        myTurtle1.left(angle);
        myTurtle1.forward(step);
        myTurtle1.left(angle);
        myTurtle1.forward(step);
        myTurtle1.right(angle);
        myTurtle1.forward(step);
        myTurtle1.right(angle);
        myTurtle1.forward(step);
        myTurtle1.left(angle);
        myTurtle1.forward(step);
        myTurtle1.left(angle);
        myTurtle1.forward(step);
        myTurtle1.left(angle);
        myTurtle1.forward(step);
        myTurtle1.left(angle);
        myTurtle1.forward(step);
        myTurtle1.right(angle);
        myTurtle1.forward(step);
        myTurtle1.right(angle);
        myTurtle1.forward(step);
        myTurtle1.left(angle);
        myTurtle1.forward(step);
        myTurtle1.left(angle);
        myTurtle1.forward(step);
        myTurtle1.left(angle);
        myTurtle1.forward(step);
        myTurtle1.right(angle);
        myTurtle1.forward(step);
        myTurtle1.right(angle);
        myTurtle1.forward(step);
        myTurtle1.right(angle);
        myTurtle1.forward(step);
        myTurtle1.right(angle);
        myTurtle1.forward(step);
        myTurtle1.left(angle);
        myTurtle1.forward(step);
        myTurtle1.left(angle);
        myTurtle1.forward(step);
        myTurtle1.right(angle);
        myTurtle1.forward(step);
        myTurtle1.right(angle);
        myTurtle1.forward(step);
        myTurtle1.right(angle);
        myTurtle1.forward(step);
        myTurtle1.left(angle);
        myTurtle1.forward(step);
        myTurtle1.left(angle);
        myTurtle1.forward(step);
        myTurtle1.left(angle);
        myTurtle1.forward(step);
        myTurtle1.left(angle);
        myTurtle1.forward(step);
        myTurtle1.right(angle);
        myTurtle1.forward(step);
        myTurtle1.right(angle);
        myTurtle1.forward(step);
        myTurtle1.right(angle);
        myTurtle1.forward(step);
        myTurtle1.left(angle);
        myTurtle1.forward(step);
        myTurtle1.left(angle);
        myTurtle1.forward(step);
        myTurtle1.right(angle);
        myTurtle1.forward(step);
        myTurtle1.right(angle);
        myTurtle1.forward(step);
        myTurtle1.right(angle);
        myTurtle1.forward(step);
        myTurtle1.right(angle);
        myTurtle1.forward(step);
        myTurtle1.left(angle);
        myTurtle1.forward(step);
        myTurtle1.left(angle);
        myTurtle1.forward(step);
        myTurtle1.right(angle);
        myTurtle1.forward(step);
        myTurtle1.right(angle);
        myTurtle1.forward(step);
        myTurtle1.right(angle);
        myTurtle1.forward(step);
        myTurtle1.left(angle);
        myTurtle1.forward(step);
        myTurtle1.left(angle);
        myTurtle1.forward(step);
        myTurtle1.left(angle);
        myTurtle1.forward(step);
        myTurtle1.left(angle);
        myTurtle1.forward(step);
        myTurtle1.right(angle);
        myTurtle1.forward(step);
        myTurtle1.right(angle);
        myTurtle1.forward(step);
        myTurtle1.right(angle);
        myTurtle1.forward(step);
        myTurtle1.left(angle);
        myTurtle1.forward(step);
        myTurtle1.left(angle);
        myTurtle1.forward(step);
        myTurtle1.right(angle);
        myTurtle1.forward(step);
        myTurtle1.right(angle);
        myTurtle1.forward(step);
        myTurtle1.right(angle);
        myTurtle1.forward(step);
        myTurtle1.right(angle);
        myTurtle1.forward(step);
        myTurtle1.left(angle);
        myTurtle1.forward(step);
        myTurtle1.left(angle);
        myTurtle1.forward(step);
        myTurtle1.left(angle);
        myTurtle1.forward(step);
        myTurtle1.right(angle);
        myTurtle1.forward(step);
        myTurtle1.right(angle);
        myTurtle1.forward(step);
        myTurtle1.left(angle);
        myTurtle1.forward(step);
        myTurtle1.left(angle);
        myTurtle1.forward(step);
        myTurtle1.left(angle);
        myTurtle1.forward(step);
        myTurtle1.left(angle);
        myTurtle1.forward(step);
        myTurtle1.right(angle);
        myTurtle1.forward(step);
        myTurtle1.right(angle);
        myTurtle1.forward(step);
        myTurtle1.left(angle);
        myTurtle1.forward(step);
        myTurtle1.left(angle);
        myTurtle1.forward(step);
        myTurtle1.left(angle);
        myTurtle1.forward(step);
        myTurtle1.right(angle);
        myTurtle1.forward(step);
        myTurtle1.right(angle);
        myTurtle1.forward(step);
        myTurtle1.right(angle);
        myTurtle1.forward(step);
        myTurtle1.right(angle);
        myTurtle1.forward(step);
        myTurtle1.left(angle);
        myTurtle1.forward(step);
        myTurtle1.left(angle);
        myTurtle1.penUp(); // end Sierpinski Triangle
    }
    while (myTurtle2.x < width) {
        turtleX = turtleX + 320;
        myTurtle2.penDown(); // snowt Sierpinski Triangle
        myTurtle2.forward(step);
        myTurtle2.left(angle);
        myTurtle2.forward(step);
        myTurtle2.left(angle);
        myTurtle2.forward(step);
        myTurtle2.right(angle);
        myTurtle2.forward(step);
        myTurtle2.right(angle);
        myTurtle2.forward(step);
        myTurtle2.right(angle);
        myTurtle2.forward(step);
        myTurtle2.right(angle);
        myTurtle2.forward(step);
        myTurtle2.left(angle);
        myTurtle2.forward(step);
        myTurtle2.left(angle);
        myTurtle2.forward(step);
        myTurtle2.left(angle);
        myTurtle2.forward(step);
        myTurtle2.right(angle);
        myTurtle2.forward(step);
        myTurtle2.right(angle);
        myTurtle2.forward(step);
        myTurtle2.left(angle);
        myTurtle2.forward(step);
        myTurtle2.left(angle);
        myTurtle2.forward(step);
        myTurtle2.left(angle);
        myTurtle2.forward(step);
        myTurtle2.left(angle);
        myTurtle2.forward(step);
        myTurtle2.right(angle);
        myTurtle2.forward(step);
        myTurtle2.right(angle);
        myTurtle2.forward(step);
        myTurtle2.left(angle);
        myTurtle2.forward(step);
        myTurtle2.left(angle);
        myTurtle2.forward(step);
        myTurtle2.left(angle);
        myTurtle2.forward(step);
        myTurtle2.right(angle);
        myTurtle2.forward(step);
        myTurtle2.right(angle);
        myTurtle2.forward(step);
        myTurtle2.right(angle);
        myTurtle2.forward(step);
        myTurtle2.right(angle);
        myTurtle2.forward(step);
        myTurtle2.left(angle);
        myTurtle2.forward(step);
        myTurtle2.left(angle);
        myTurtle2.forward(step);
        myTurtle2.right(angle);
        myTurtle2.forward(step);
        myTurtle2.right(angle);
        myTurtle2.forward(step);
        myTurtle2.right(angle);
        myTurtle2.forward(step);
        myTurtle2.left(angle);
        myTurtle2.forward(step);
        myTurtle2.left(angle);
        myTurtle2.forward(step);
        myTurtle2.left(angle);
        myTurtle2.forward(step);
        myTurtle2.left(angle);
        myTurtle2.forward(step);
        myTurtle2.right(angle);
        myTurtle2.forward(step);
        myTurtle2.right(angle);
        myTurtle2.forward(step);
        myTurtle2.right(angle);
        myTurtle2.forward(step);
        myTurtle2.left(angle);
        myTurtle2.forward(step);
        myTurtle2.left(angle);
        myTurtle2.forward(step);
        myTurtle2.right(angle);
        myTurtle2.forward(step);
        myTurtle2.right(angle);
        myTurtle2.forward(step);
        myTurtle2.right(angle);
        myTurtle2.forward(step);
        myTurtle2.right(angle);
        myTurtle2.forward(step);
        myTurtle2.left(angle);
        myTurtle2.forward(step);
        myTurtle2.left(angle);
        myTurtle2.forward(step);
        myTurtle2.right(angle);
        myTurtle2.forward(step);
        myTurtle2.right(angle);
        myTurtle2.forward(step);
        myTurtle2.right(angle);
        myTurtle2.forward(step);
        myTurtle2.left(angle);
        myTurtle2.forward(step);
        myTurtle2.left(angle);
        myTurtle2.forward(step);
        myTurtle2.left(angle);
        myTurtle2.forward(step);
        myTurtle2.left(angle);
        myTurtle2.forward(step);
        myTurtle2.right(angle);
        myTurtle2.forward(step);
        myTurtle2.right(angle);
        myTurtle2.forward(step);
        myTurtle2.right(angle);
        myTurtle2.forward(step);
        myTurtle2.left(angle);
        myTurtle2.forward(step);
        myTurtle2.left(angle);
        myTurtle2.forward(step);
        myTurtle2.right(angle);
        myTurtle2.forward(step);
        myTurtle2.right(angle);
        myTurtle2.forward(step);
        myTurtle2.right(angle);
        myTurtle2.forward(step);
        myTurtle2.right(angle);
        myTurtle2.forward(step);
        myTurtle2.left(angle);
        myTurtle2.forward(step);
        myTurtle2.left(angle);
        myTurtle2.forward(step);
        myTurtle2.left(angle);
        myTurtle2.forward(step);
        myTurtle2.right(angle);
        myTurtle2.forward(step);
        myTurtle2.right(angle);
        myTurtle2.forward(step);
        myTurtle2.left(angle);
        myTurtle2.forward(step);
        myTurtle2.left(angle);
        myTurtle2.forward(step);
        myTurtle2.left(angle);
        myTurtle2.forward(step);
        myTurtle2.left(angle);
        myTurtle2.forward(step);
        myTurtle2.right(angle);
        myTurtle2.forward(step);
        myTurtle2.right(angle);
        myTurtle2.forward(step);
        myTurtle2.left(angle);
        myTurtle2.forward(step);
        myTurtle2.left(angle);
        myTurtle2.forward(step);
        myTurtle2.left(angle);
        myTurtle2.forward(step);
        myTurtle2.right(angle);
        myTurtle2.forward(step);
        myTurtle2.right(angle);
        myTurtle2.forward(step);
        myTurtle2.right(angle);
        myTurtle2.forward(step);
        myTurtle2.right(angle);
        myTurtle2.forward(step);
        myTurtle2.left(angle);
        myTurtle2.forward(step);
        myTurtle2.left(angle);
        myTurtle2.penUp(); // end Sierpinski Triangle
    }
    while (myTurtle3.x < width) {
        turtleX = turtleX + 320;
        myTurtle3.penDown(); // snowt Sierpinski Triangle
        myTurtle3.forward(step);
        myTurtle3.left(angle);
        myTurtle3.forward(step);
        myTurtle3.left(angle);
        myTurtle3.forward(step);
        myTurtle3.right(angle);
        myTurtle3.forward(step);
        myTurtle3.right(angle);
        myTurtle3.forward(step);
        myTurtle3.right(angle);
        myTurtle3.forward(step);
        myTurtle3.right(angle);
        myTurtle3.forward(step);
        myTurtle3.left(angle);
        myTurtle3.forward(step);
        myTurtle3.left(angle);
        myTurtle3.forward(step);
        myTurtle3.left(angle);
        myTurtle3.forward(step);
        myTurtle3.right(angle);
        myTurtle3.forward(step);
        myTurtle3.right(angle);
        myTurtle3.forward(step);
        myTurtle3.left(angle);
        myTurtle3.forward(step);
        myTurtle3.left(angle);
        myTurtle3.forward(step);
        myTurtle3.left(angle);
        myTurtle3.forward(step);
        myTurtle3.left(angle);
        myTurtle3.forward(step);
        myTurtle3.right(angle);
        myTurtle3.forward(step);
        myTurtle3.right(angle);
        myTurtle3.forward(step);
        myTurtle3.left(angle);
        myTurtle3.forward(step);
        myTurtle3.left(angle);
        myTurtle3.forward(step);
        myTurtle3.left(angle);
        myTurtle3.forward(step);
        myTurtle3.right(angle);
        myTurtle3.forward(step);
        myTurtle3.right(angle);
        myTurtle3.forward(step);
        myTurtle3.right(angle);
        myTurtle3.forward(step);
        myTurtle3.right(angle);
        myTurtle3.forward(step);
        myTurtle3.left(angle);
        myTurtle3.forward(step);
        myTurtle3.left(angle);
        myTurtle3.forward(step);
        myTurtle3.right(angle);
        myTurtle3.forward(step);
        myTurtle3.right(angle);
        myTurtle3.forward(step);
        myTurtle3.right(angle);
        myTurtle3.forward(step);
        myTurtle3.left(angle);
        myTurtle3.forward(step);
        myTurtle3.left(angle);
        myTurtle3.forward(step);
        myTurtle3.left(angle);
        myTurtle3.forward(step);
        myTurtle3.left(angle);
        myTurtle3.forward(step);
        myTurtle3.right(angle);
        myTurtle3.forward(step);
        myTurtle3.right(angle);
        myTurtle3.forward(step);
        myTurtle3.right(angle);
        myTurtle3.forward(step);
        myTurtle3.left(angle);
        myTurtle3.forward(step);
        myTurtle3.left(angle);
        myTurtle3.forward(step);
        myTurtle3.right(angle);
        myTurtle3.forward(step);
        myTurtle3.right(angle);
        myTurtle3.forward(step);
        myTurtle3.right(angle);
        myTurtle3.forward(step);
        myTurtle3.right(angle);
        myTurtle3.forward(step);
        myTurtle3.left(angle);
        myTurtle3.forward(step);
        myTurtle3.left(angle);
        myTurtle3.forward(step);
        myTurtle3.right(angle);
        myTurtle3.forward(step);
        myTurtle3.right(angle);
        myTurtle3.forward(step);
        myTurtle3.right(angle);
        myTurtle3.forward(step);
        myTurtle3.left(angle);
        myTurtle3.forward(step);
        myTurtle3.left(angle);
        myTurtle3.forward(step);
        myTurtle3.left(angle);
        myTurtle3.forward(step);
        myTurtle3.left(angle);
        myTurtle3.forward(step);
        myTurtle3.right(angle);
        myTurtle3.forward(step);
        myTurtle3.right(angle);
        myTurtle3.forward(step);
        myTurtle3.right(angle);
        myTurtle3.forward(step);
        myTurtle3.left(angle);
        myTurtle3.forward(step);
        myTurtle3.left(angle);
        myTurtle3.forward(step);
        myTurtle3.right(angle);
        myTurtle3.forward(step);
        myTurtle3.right(angle);
        myTurtle3.forward(step);
        myTurtle3.right(angle);
        myTurtle3.forward(step);
        myTurtle3.right(angle);
        myTurtle3.forward(step);
        myTurtle3.left(angle);
        myTurtle3.forward(step);
        myTurtle3.left(angle);
        myTurtle3.forward(step);
        myTurtle3.left(angle);
        myTurtle3.forward(step);
        myTurtle3.right(angle);
        myTurtle3.forward(step);
        myTurtle3.right(angle);
        myTurtle3.forward(step);
        myTurtle3.left(angle);
        myTurtle3.forward(step);
        myTurtle3.left(angle);
        myTurtle3.forward(step);
        myTurtle3.left(angle);
        myTurtle3.forward(step);
        myTurtle3.left(angle);
        myTurtle3.forward(step);
        myTurtle3.right(angle);
        myTurtle3.forward(step);
        myTurtle3.right(angle);
        myTurtle3.forward(step);
        myTurtle3.left(angle);
        myTurtle3.forward(step);
        myTurtle3.left(angle);
        myTurtle3.forward(step);
        myTurtle3.left(angle);
        myTurtle3.forward(step);
        myTurtle3.right(angle);
        myTurtle3.forward(step);
        myTurtle3.right(angle);
        myTurtle3.forward(step);
        myTurtle3.right(angle);
        myTurtle3.forward(step);
        myTurtle3.right(angle);
        myTurtle3.forward(step);
        myTurtle3.left(angle);
        myTurtle3.forward(step);
        myTurtle3.left(angle);
        myTurtle3.penUp(); // end Sierpinski Triangle
        }
     //SNOW
      animateSnow();
      hideSnow();
      addSnow();
}


//BACKGROUND (SKY GRADIENT)
function Gradient (a, b, top, bottom) {
	  // top to bottom gradient (background)
    for (var i = a; i <= height; i++) {
        var mappedC = map(i, a, a+b, 0, 1);
        var c = lerpColor(top, bottom, mappedC);
        stroke(c);
        strokeWeight(2);
        line(a, i, a+b, i);
	  }
}


//SNOW FLAKES FUNCTIONS
function drawSnow() {
	  noStroke();
	  // make snows seem like they're shining by manipulating transparency
	  var transparency = random(20, 100);
	  fill(255, transparency);
	  ellipse(this.x, this.y, 4, 4);
}


function animateSnow() {
    for (var s = 0; s < snow.length; s++) {
        snow[s].move();
        snow[s].draw();
    }
}


function hideSnow() {
    // make the snow particles that are actually within the canvas to stay
    // if not, hide them
    var snowOnCanvas = [];
    for (var s = 0; s < snow.length; s++){ // go through all snow
        // if the snow is on the canvas
        if (0 < snow[s].x < width) {
            snowOnCanvas.push(snow[s]); // draw the snows that are on the
                                        // canvas
        }
    }
    snow = snowOnCanvas; // update the snows to the ones that are actually
                         // on the canvas
}


function addSnow() {
    var randomValSnow = 0.01; // a really small chance of snows randomly
                              // being added/generated
    if (random(0,1) < randomValSnow) { // because it is not that likely for a
                                      // randomly chosen value to be less than
                                      // 0.0001, this will be a rare occasion
        var snowPositionX = random(0, width);
        var snowPositionY = random(0, height);
        snow.push(makeSnow(snowPositionX, snowPositionY)); // generate new
                                                           // snows along
                                                           // the canvas
    }
}


function snowMove() {
	//move snows by updating x coordinate
	this.x += this.speed;
}


function makeSnow(snowPositionX, snowPositionY) {
	  var snow = {x: snowPositionX,
				       y: snowPositionY,
				       speed: -random(0, .005),
				       move: snowMove,
			         draw: drawSnow}
	  return snow;
}


  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);
        strokeJoin(MITER);
        strokeCap(PROJECT);
        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(255),
                    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;
  }

  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);
        strokeJoin(MITER);
        strokeCap(PROJECT);
        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(120, 180, random(180, 255)),
                    weight: 3,
                    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 used a turtle to draw a different form. I used three different turtles that generate lines of Sierpinski triangles. These geometries formed by turtles come together to suggest at a crystal, snowflake-like form. By adding dynamic elements to the colors of the background and the stroke of turtles, as well as adding sparking snowflakes, I was able to create an interesting winter themed pattern. I used this opportunity to apply mathematics to generate natural forms and to create a wallpaper inspired by the movie Frozen, expanding on the project that we had before.

screenshot of project
each component
concept sketch