```
//Steph Chun
//Section A
//heeseoc@andrew.cmu.edu
//Project-11
var turtle, turtle2;
var angle = 20;
var side = 5;
var angle2 = 160;
var side2 = 10;
function setup(){
createCanvas(400,400);
background(20,20,50);
frameRate(10);
//circular geometric shape
turtle = makeTurtle(random(0,width), random(0,height));
//spikey geometric shape expanding from the center
turtle2 = makeTurtle(width/2, height/2);
}
function draw(){
stroke(255);
strokeWeight(.8);
textSize(14);
text("click anywhere!", 5, 20);
//circular geometric shape
for (var i = 0; i < 30; i++){
turtle.setColor(color(random(150,255), random(200,255), random(200,255)));
turtle.penDown();
turtle.setWeight(.2);
turtle.left(angle);
turtle.forward(side);
}
turtle.right(10);
side += .5;
//spikey geometric shape expanding from the center
turtle2.setColor(color(random(150,255), random(200,255), random(100,255)));
turtle2.penDown();
turtle2.setWeight(.3);
turtle2.left(angle2);
turtle2.forward(side2);
turtle2.right(5);
side2 += 2;
}
//creating spiral shape on mouseclick
function mousePressed(){
turtle = makeTurtle(mouseX, mouseY);
}
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;}
```

While I was exploring what I can do with turtles, I noticed how I can make interesting spirals through drawing lines and manipulating angles. At first, I was trying to execute these (not-so-exactly) circular spirals with some random factors on mouseclick, but then it looked somewhat boring with only those on a dark background. So I re-generated one of the spirals that I thought was interesting and placed it at the center. After a while I left the code alone, it made this interesting circular shape even though it started off as a rather angular and spikey shape, which I thought resonated with the circular shapes that are being created on mouseclick. I liked how it has an interactive component, but later on, the user is like swallowed by the dense spiral and notice the connection between the two seemingly different elements.