Yiran Xuan – Looking Outwards – 11

I am a fan of a wide variety of music, including American folk music and Chinese folk music. In the middle of switching between Sanxian (Chinese traditional 3-string banjo) playlists to bluegrass playlists, I suddenly noticed that there was a great many similarities between the two genres. Both featured fast, colorful strings that operated in the major scales, often pentatonic scales, giving them energetic but grounded feelings. The topic of the songs are also similar, describing longings of home, the beauty of rural environments, and amusing interpersonal relationships. What this meant to me was despite the genres being folk, there was room for new growth and cross-cultural synthesis, and that the two cultures I have grown up were strangely bridged.

I searched for any realized union of the two genres, and I was happily surprised to find Redgrass:
The Chinese musical group featured frequently experiments with combining traditional Chinese instrumentation with the music from other cultures, including American jazz, Malaysian percussion, and experimental electronic music.

Website

(Completed with 2-day extension)

Yiran Xuan – Project 11 – Composition

This sketch is based off of my favorite drawing tool in FireAlpaca, the Mirror Brush. It initializes two different turtles that move to the mouse’s position when the mouse is clicked. Buttons on the keyboard can affect the pen’s path; pressing ‘p’ will toggle the penUp and penDown, ‘w’ and ‘t’ will widen and thin the pen tracks respectively, while ‘r’, ‘b’, ‘g’, ‘l’ change the color of the tracks.

(Completed with 2-day extension)

sketch

/*
Yiran Xuan
Section A
yxuan@andrew.cmu.edu
Project 11
*/

//Goal: Create mirroring paint tool that uses the turtle graphics

var brushturtle; //turtle that corresponds to mouse movements
var mirrorturtle; //turtle that mirrors brushturtle

var targetx = 0; //x coord of where brush turtle should go
var targety = 0; //y coord of both turtles
var mirrorx = -targetx; 

var brushweight = 5;

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

    translate(240, 0);

    brushturtle = makeTurtle(0, 0); //initialize turtles
    mirrorturtle = makeTurtle(0,0);

    brushturtle.setColor('black');
    
    mirrorturtle.setColor('black');
    mirrorturtle.setWeight(brushweight);

}

function draw(){
	translate(240, 0); //needs to be constantly retranslated so that 0 line is down the middle of canvas

	brushturtle.setWeight(brushweight);
	mirrorturtle.setWeight(brushweight);

	brushturtle.goto(targetx, targety); //transport brush
	mirrorturtle.goto(mirrorx, targety); //transport mirror
}

function mouseClicked() {
	targetx = mouseX - 240; //mouse coords ignores translate, so needs compensation
	targety = mouseY;
	mirrorx = -targetx;
}



function keyPressed(){
	if(key == 'p'){ //pressing 'p' switches between pen position 
		penUporDown();
	}

	if(key == 'w'){
		penWider();
	}

	if(key == 't'){
		penThinner();
	}

	if(key == 'r'){ //changing pen colors
		brushturtle.setColor('red');
		mirrorturtle.setColor('red');
	}

	if(key == 'g'){
		brushturtle.setColor('green');
		mirrorturtle.setColor('green');
	}

	if(key == 'b'){
		brushturtle.setColor('blue');
		mirrorturtle.setColor('blue');
	}

	if(key == 'l'){
		brushturtle.setColor('black');
		mirrorturtle.setColor('black');
	}

}

function penUporDown(){ //lifts or puts down pen
	if(brushturtle.penIsDown){
			brushturtle.penUp();
			mirrorturtle.penUp();
		}
	else if(brushturtle.penIsDown == false){
		brushturtle.penDown();
		mirrorturtle.penDown();
		}
}

function penWider(){ //widens penstroke
	brushweight+= 0.5;
}

function penThinner(){ //thins penstroke
	if(brushweight > 1){
		brushweight -= 0.5;
	}
}

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

 

Yingyang Zhou-LookingOutwards-11

For week 4 looking outwards, I wrote about Ryoji Ikeda, I really appreciate his work with full of beauty of math. His work is more “sound art” than music, becuase there are a lot of visual element invovled and it needs you to “interpretate” it instead of only “listen” to it. I want to talk about another piece of his work I really like, “datamatics [prototype-ver.2.0]”.

Using pure data as a source for sound and visuals, datamatics combines abstract and mimetic presentations of matter, time and space. datamatics is the second audiovisual concert in the datamatics series. Projecting dynamic computer-generated imagery in pared down black and white with striking colour accents, the intense yet minimal graphic renderings of data progress through multiple dimensions. From 2D sequences of patterns derived from hard drive errors and studies of software code, the imagery transforms into dramatic rotating views of the universe in 3D, whilst in the final scenes four-dimensional mathematical processing opens up spectacular and seemingly infinite vistas. A powerful and hypnotic soundtrack reflects the imagery through a meticulous layering of sonic components to produce immense and apparently boundless acoustic spaces.

datamatics [ver 2.0] is the full–length version of this audiovisual concert. With a commissioned second part added, datamatics [ver.2.0] is significantly developed from the earlier version of this piece which premiered in March 2006. Driven by the primary principles of datamatics, but objectively deconstructing its original elements – sound, visuals and even source codes – this work creates a kind of meta–datamatics. Real–time program computations and data scanning are employed to create an extended new sequence that is a further abstraction of the original work. The technical dynamics of the piece, such as its extremely fast frame rates and variable bit depths, continue to challenge and explore the thresholds of our perceptions.

Katherine Hua – Project 11 – Composition

sketch

/* Katherine Hua
Section A
khua@andrew.cmu.edu
Project-11-Composition */

//global variables
var ttl1;
var ttl2;
var ttl3;
var ttl4;
var ttl5;

function setup() {
    createCanvas(480, 480);
    background(35);
    //starting positions of turtle
    ttl1 = makeTurtle(267, 302);
    ttl2 = makeTurtle(260, 280);
    ttl3 = makeTurtle(280, 407);
    ttl4 = makeTurtle(267, 277);
    ttl5 = makeTurtle(278, 360);
    strokeCap(PROJECT);
    strokeJoin(MITER);
    frameRate(1);
}

function draw() {
	//turtle 5
	ttl5.setColor('skyblue');
	ttl5.setWeight(1);
	for (var n = 0; n < 10; n ++) {
		ttl5.forward(30);
		ttl5.left(55);
		ttl5.forward(50);
		ttl5.right(15);
		if (n % 9 === 0) {
			ttl5.forward(3);
		}
	}
	//turtle 1
	ttl1.setColor('pink');
	ttl1.setWeight(1);
	for (var i = 0; i < 20; i ++) {
		ttl1.forward(70);
		ttl1.left(120);
		ttl1.forward(100);
		ttl1.right(10);
	}
	//turtle 3
	ttl3.setColor('yellow');
	ttl3.setWeight(1);
	for (var k = 0; k < 10; k ++) {
		ttl3.forward(50);
		ttl3.left(55);
		ttl3.forward(60);
		ttl3.right(15);
		if (k % 9 === 0) {
			ttl3.forward(5);
		}
	}	
	// turtle 4
	ttl4.setColor('orange', 20);
	ttl4.setWeight(1);
	for (var m = 0; m < 10; m ++) {
		ttl4.forward(20);
		ttl4.left(110);
		ttl4.forward(50);
		ttl4.right(15);
		}
	//turtle 2
	ttl2.setColor('skyblue');
	ttl2.setWeight(1);
	for (var j = 0; j < 10; j ++) {
		ttl2.forward(1);
		ttl2.left(55);
		ttl2.forward(10);
		ttl2.right(15);
		if (j % 9 === 0) {
			ttl2.forward(5);
		}
	}

}

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

At first I wanted to create a sunflower through this, but in the end I got carried away and began adding more and more layers to the design.

what it looks like at frame 1
what it looks like at frame 2

Yingyang Zhou-Project-11-Composition

click to plant trees!

//Yingyang Zhou
//yingyanz@andrew.cmu.edu
//Project 11
//section A


var turtle;

var treeX = 300;
var treeY = 400;

function setup() {
    createCanvas(600, 400);
    background(224, 216, 208);

    frameRate(1);
}

function draw(){
    turtle = makeTurtle(treeX, treeY);
    turtle.setColor(color(84, 60, 43));
    turtle.setWeight(7);
    turtle.penUp();

    var trunkRandomDegree = random(5);
  	var trunkRandomHeight = random(minTrunk,maxTrunk);
    turtle.penDown();
    turtle.left(90+trunkRandomDegree);
  	turtle.forward(trunkRandomHeight);
  	turtle.right(90+trunkRandomDegree);
  	turtle.penUp();
  	noLoop();

  	turtle.setColor(color(119, 166+random(-20,20), 119));
  	branch(turtle, floor(random(1, 5)), 10, 3, random(5), random(5));

}
var height = 400;
var minTrunk = height/4;
var maxTrunk = height/3;
var minBranch = height/10;
var maxBranch = height/3;
var minDegree = 3;
var maxDegree = 45;


function branch(turtle, number, length, width, left, right){
  var number = floor(random(1, 5));
  var length = 7;
  var width = 0.5;
  for(var i = 0; i < number; i++){
  		turtle.penDown();
  		turtle.left(90+random(minDegree,maxDegree));
  		turtle.forward(length);
  		branch(turtle, number/i, length, width, random(5), random(5));
  		length = length/i;
  		width = width/i;

  }

  turtle.penDown();

  turtle.left(90+trunkRandomDegree);
  turtle.forward(-trunkRandomHeight/2);
  turtle.penDown();
  turtle.left(random(minDegree))

  turtle.left(random(minDegree,maxDegree));
  turtle.forward();
  for(var i = 0; i < 6; i++){
    turtle.penDown();
    turtle.forward(5);
    turtle.right(60);
  }
  turtle.penUp();
}

function mousePressed(){
	treeX = mouseX;
	treeY = mouseY;
	// setup();
	draw();
}



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

I enjoyed doing this project and the randomness turned out a little surprising but I like it! The idea is when you click on the canvas, there would be a tree grow from where you clicked.

Looking Outwards – 11 Min Lee

 

For this week’s project, I wanted to take a look at the computer-generated music from Clara Starkweather’s Student Project at Duke University. She uses a Kinect camera to detect the motions of her body parts and generate different sounds at different progressions. More accurately, the algorithm she wrote plays different instruments in response to the camera’s detection of the different body parts being moved.

In Starkweather’s project, she wrote her code using the software synthesis programming language called SuperCollider. In this video, Starkweather showcases her project by demonstrating the different audio sounds filling in as background music for the song “Golden” by Jill Scott. I admire this project because Starkweather states that she had to learn how to play a few instruments to write her code. Her musical stylistic choices are also manifested in her project and despite it being a hard task to create harmonizing sounds using different body parts to control different instruments, she does so in a seamless way.

Source: https://www.youtube.com/watch?v=Q1ad8KG7tWc

Project 11 – Composition – Min Lee

index

var comb = 50;
var s = 25;
var bees = [];
var px = [];
var py = [];

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

    //sets each bees position

    for (var i = 0; i < 10; i++) {
    	px.push(random(0, width));
    	py.push(random(0, height));
    };

}

function draw() {
	background(199, 149, 68);

    strokeJoin(MITER);
    strokeCap(PROJECT);

    //draws dark lines on hive
	var ttl1 = makeTurtle(0, -300)
	ttl1.setColor("black");
	ttl1.setWeight(5);
	for (var y = 0; y < 30; y++) {
		for (var i = 0; i < 15; i++) {
			ttl1.penDown();
			ttl1.forward(s);
			ttl1.right(60);
			ttl1.forward(s);
			ttl1.left(60);
		};
		ttl1.penUp();
		ttl1.goto(0, y * 50 * sqrt(3) / 2 - 300);
	};

	//draws thin lines on hive
	var ttl2 = makeTurtle(0, -302)
	ttl2.setColor("black");
	ttl2.setWeight(0.5);
	for (var y = 0; y < 30; y++) {
		for (var i = 0; i < 15; i++) {
			ttl2.penDown();
			ttl2.forward(s);
			ttl2.left(60);
			ttl2.forward(s);
			ttl2.right(60);
		};
		ttl2.penUp();
		ttl2.goto(0, y * 50 * sqrt(3) / 2 - 300);
	};

	strokeCap(ROUND)

	//creates bees
	for (var i = 0; i < 10; i++) {
		//moves bees randomly
		fill(0);
		ellipse(px[i], py[i], random(10, 15), random(10, 15))
		px[i] += random(-1, 1);
		py[i] += random(-1, 1);


		//if bees are too close to edges, keep them from going off canvas
		if (px < 1) {
			px += random(0, 1);
		} else if (px > width - 1) {
			px += random(-1, 0);
		};

		if (py < 1) {
			py += random(0, 1);
		} else if (py > height - 1) {
			py += random(-1, 0);
		};
	};
}



//------------------------------------------------

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 recreate a beehive’s hexagons and add bees, but I unfortunately ran out of time so I simplified the bees.

An initial sketch behind the math I was trying to figure out.

Katherine Hua – Looking Outwards – 11

“NightFall” by Mileece (2003)

Mileece Petre is an English sound artist and environmental designer who makes generative and interactive through plants. Believing that plants are sentient beings, she is able to have plants create music by attaching electrodes to them. The data collected from an electromagnetic currents are sent to amplifiers and the amplifiers sends this data which is translated into codes, and the codes are then input into software that creates musical notes out of them.

I admire this project because even though a single plant creates minimal sound, if she attaches electrodes to all plants in a garden, it sounds like an orchestra’s symphony. Also, the type of music the plants come together to make sound very soft and peaceful, reflecting the organic and subtleness of plants. Furthermore, she is able to create a platform in which people can be more connected to nature, helping her passion for the environment.

Project 11 Composition – Sara Frankel

sketch

var terrainSpeed = 0.00025; 
var terrainDetail = 0.001; 

function setup() {
    createCanvas(400, 200);
    frameRate(20); 

}

function draw() {
    background('lightblue');

    fill('orange');
    ellipse(width - 35, 35, 50, 50); //draws the sun

    noFill();
    beginShape(); //draws terrain at random of noise
    for (var x = 0; x < width; x++) {
        var t = (x * terrainDetail) + (millis() * terrainSpeed);
        var y = map(noise(t), 0, 1, height/2, height);
        vertex(x, y);
        stroke('blue');
        line(x, y, x, height); //fills terrain so that it appears blue
    }
    endShape();

    duck(mouseX, y - 10, 20); //draws "duck" in the row with specific different radius
    duck(mouseX - 100, y - 10, 10);
    duck(mouseX - 150, y - 10, 5);
    duck(mouseX - 200, y - 10, 15);

    
}

function duck(dx, dy, radius) {
    var ttl1 = makeTurtle(dx + radius, dy - radius);
    ttl1.penDown(); //puts pen down
    ttl1.setColor('yellow');//color is yellow
    ttl1.setWeight(6);

    ttl1.left(90);//rotates circle so that starting point is to right of the duck

    var increments = radius * 10;//variable that gives way so that each radious of duck is in proportion of other

    for (i = 0; i < increments; i++) {
        d = 1;
        ttl1.forward(d);
        ttl1.left(360/increments);// completes circle     
    }

    ttl1.setColor('orange');//draws nose
    ttl1.forward(radius);
    ttl1.right(120);
    ttl1.forward(radius);
    ttl1.right(120);
    ttl1.forward(radius);
    ttl1.right(120);
    ttl1.forward(radius);

    stroke(0); //draws eye
    strokeWeight(6);
    point(dx, dy - radius - 5);

    ttl1.penUp();
}


//_________________________________________________________

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 my project, I went in knowing I wanted to draw ducks floating on water. I did so by using turtle graphics to draw the duck and its beak and using parameters, to change the radius/size of each duck. Imaged is a “Family of Ducks Swimming Together on A Nice Day”. Here is an image of what it might look like.

Anthony Ra – Project 11 – Composition

sketch

/* Anthony Ra
Section-A
ahra@andrew.cmu.edu
Project-11 */
var ttl;
var start;

function setup() {
    createCanvas(400, 400);
    background(100);
    ttl = makeTurtle(width, height);
    ttl.penDown();
    ttl.setColor(color(255));
    ttl.setWeight(1.5);

    resetCanvas();
}

function draw() {
    var step = (frameCount - start)/35.0;
    ttl.forward(step);
    ttl.left(15.0);
}

function resetCanvas() {
    background(0);
    start = frameCount;
    ttl.penUp();
    ttl.goto(width/2, height/2);
    ttl.penDown();
}

function mousePressed() {
    ttl.penUp();
    ttl.setColor(random(100, 255));
    ttl.goto(mouseX, mouseY);
    ttl.penDown();
}

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

This week gave me a lot of headaches, so I wanted to return the favor in giving the viewer headaches with a series of hypnotic-like spirals in which it seems that a still image is moving. This piece is completely grayscale in mimicking its one-dimensional pain and one is able to start the animation where the mouse clicks but the animation continues instead of starting back to its original place. This is to imitate the perpetual aching of my head that I have been feeling this past week.

no mouse click, animation as is
implementation of mouse clicks