Category: Uncategorized

monicah1-lookingoutward-12-SectionA

o.T., Astana Contemporary Art Center, Artists & Robots, 2017

 

 

Galerie Mitterrand, Paris, 2017

 

http://www.kogler.net/kunsthaus-bregenz-2000-projektion#

Peter Kogler, an Austrian artist, works on floors walls and ceilings with ling designs illusion for 30 years, bending spaces in unnatural ways. He manipulated box-shaped space to virtual maze of time and space. He creates undefined movement and sense of insecurity in spaces for people to experience in. He sees computer for artists as “liberated from many physical limitations of all former media”. He explores the new dimension in architecture.

I am interested in the idea of allowing people to question what is real and what is not. what is important and what is not. What values do we hold on. Human can be manipulated with visual easily, we only think what the normal spaces are like based on what we are used to. If we exposed to more of what diverse perspective spaces, will we be comfortable in those spaces one day?

‘Oscillate’ – Thesis Animation of Sine Waves by Daniel Sierra 2015

Sierra is a digital artists, designer, and creative coder who specializes in audio visualization, animation, and mixed reality experiences. In Oscillate, he was interested in the emergence of complexity in sound from fundamental sine and cosine waves, using tools like Houdini, Reason, Nuke, After Effects, and Processing.

In Oscillate, I am intrigued by how he presented the elements in we encounter daily to this delicate form. Moreover, he added on his own audio sound design to the original visualized sound elements. The splashes, strings, and lines create a great tension in between.

I liked how Peter Kogler and Daniel Sierra play with 2D and 3D with natural elements in space, giving the sense of mysteriousness and delicacy.

monicah1-lookingoutward-11-SectionA

While Sleeping by Ikue Mori 2013

Ikue Morie is a japanese artiest who moved from Tokyo to New York in 1977.  She started playing with drum, then formed a band creating radical rhythms and dissonant sounds. Then she started to used drum machine to improvise music.

I was intrigued by her perceive in music. This piece, While Sleeping, made me thought about what do I hear when I’m asleep or when I’m peace and calm states. How does she relate sounds while sleeping to the sounds she created. It is interesting that she used many mediums, some natural and some made up to create the subtle  music in While Sleeping .

monicah1-project-11-SectionA

sketch

//Monica Huang
//Section E
//monicah1@andrew.cmu.edu
//Project-11
var myTurtle;
var startFrame;

function setup() {
    createCanvas(400, 400);
    background(100);
    myTurtle = makeTurtle(width, height);
    myTurtle.setColor(color(255, 100, 200));
    myTurtle.setWeight(2); 
    myTurtle.penDown();
    resetCanvas();
    frameRate(50);
}

function draw() {
    var step = (frameCount - startFrame)/20.0;
    myTurtle.forward(step);
    myTurtle.left(10.0);
    if (myTurtle.y > height) resetCanvas();

}

function resetCanvas() {
    background(100,0,10);
    startFrame = frameCount;
    myTurtle.penUp();
    myTurtle.goto(width/6, height/2);
    myTurtle.penDown();
}

function mousePressed(){
    myTurtle.penUp();
    myTurtle.goto(width/2, height/2);
    myTurtle.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 piece I was playing with the tension of pattern and the randomness when interfere with the continuous flow of pattern.

//Monica Huang
//Section E
//monicah1@andrew.cmu.edu
//Project-11
var myTurtle;
var startFrame;

function setup() {
    createCanvas(400, 400);
    background(100);
    myTurtle = makeTurtle(width, height);
    myTurtle.setColor(color(255, 100, 200));
    myTurtle.setWeight(2); 
    myTurtle.penDown();
    resetCanvas();
    frameRate(50);
}

function draw() {
    var step = (frameCount - startFrame)/20.0;
    myTurtle.forward(step);
    myTurtle.left(10.0);
    if (myTurtle.y > height) resetCanvas();

}

function resetCanvas() {
    background(100,0,10);
    startFrame = frameCount;
    myTurtle.penUp();
    myTurtle.goto(width/6, height/2);
    myTurtle.penDown();
}

function mousePressed(){
    myTurtle.penUp();
    myTurtle.goto(width/2, height/2);
    myTurtle.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;}

 

SaveSave

jdperez Looking Outwards 11

For this week’s looking outwards, I looked at Ryoji Ikeda. Ikeda is a musician/visual artist that uses mathematical complexity and aesthetic to create his work. Much of his work uses raw audio forms, such as the sine wave, at the edge of the human ability to hear. With this audio, he switches between using them to create tones and percussion, with beat patterns emerging throughout many of his pieces.

The visuals are an extremely important aspect to some of his pieces, one of which is called “The Transfinite”. This was a massive installation at the Park Avenue Armory in New York.

What I really appreciate about Ikeda’s work is how it bridges multiple disciplines effectively. As I’ve mentioned in many of my prior looking outwards posts, this is what I aspire to do in my own work.

gyueunp – Project-11: Playing with your Turtles

Turtles

//GyuEun Park
//15-104 E
//gyueunp@andrew.cmu.edu
//Project-11

function setup() {
    createCanvas(400, 400);
    
}

function draw() {
    background(random(50,70));
    var turtle = makeTurtle(width-35, height-365);
    turtle.penDown();
    turtle.setColor(0);
    for (var i = 0; i < 9800; i++) {
        turtle.forward(50);
        turtle.right(141.5);
        turtle.forward(420);
        if (i % 20 === 0) {
            turtle.forward(70);
        }
    }
}


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

In all honesty, learning how to use turtle graphics was one of the coolest things I learned in this course; I just love the intricate designs that I am able to create with them. I experimented with various turtle object API (application programmer’s interface) to reach this final design. I like the sense of dimension it has as a result of the overlapping lines. As with many of my works, visual complexity and simplicity coexist in this piece. Here is a screenshot of the final version.

Since it is difficult to illustrate them in hand-drawn sketches, I have decided to include multiple screenshots of from the experimentation process.

 

   

 

Jdbrown – Project 11 – I Like Turtles (Mosaic)

sketch

// Joshua Brown
// Jdbrown@andrew.cmu.edu
// Section C
// Project 11: Turtle Fun

// makeTurtle(x, y) -- make a turtle at x, y, facing right, pen down
// left(d) -- turn left by d degrees
// right(d) -- turn right by d degrees
// forward(p) -- move forward by p pixels
// back(p) -- move back by p pixels
// penDown() -- pen down
// penUp() -- pen up
// goto(x, y) -- go straight to this location
// setColor(color) -- set the drawing color
// setWeight(w) -- set line width to w
// face(d) -- turn to this absolute direction in degrees
// angleTo(x, y) -- what is the angle from my heading to location x, y?
// turnToward(x, y, d) -- turn by d degrees toward location x, y
// distanceTo(x, y) -- how far is it to location x, y?

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

    var t1 = makeTurtle(270, 120);
    var t2 = makeTurtle(255, 160);
    var t3 = makeTurtle(330, 340);
    var t4 = makeTurtle(30, 280);

    for (var i = 0; i < 1000; i++) {
        
        makeMoz(t1);    // makes the mini-med sized pattern;
        makeMaz(t2);    // makes the smallest patter;
        makeMax(t3);    // makes the largest pattern;
        makeThing(t4);  // makes the larger-med sized pattern
    }
}

function makeThing (t4) {

    t4.forward(10);
    t4.left(45);
    t4.forward(25);
    t4.left(90);
    t4.forward(50);
    t4.left(135);
    t4.forward(75);
    t4.left(180);
    t4.forward(150);
    t4.right(45);
    t4.forward(50);
    t4.right(90);

}


function makeMax (t3, a1) {

    t3.forward(200);
    t3.left(90);
    t3.forward(180);
    t3.left(90);
    t3.forward(160);
    t3.left(45);
    t3.forward(140);
    t3.left(90);
    t3.forward(120);
    t3.left(90);
    t3.forward(100);
    t3.left(45);
    t3.forward(80);
    t3.left(90);
    t3.forward(60);
    t3.left(90);
    t3.forward(40);
    t3.left(45);
    t3.forward(20);
    t3.left(90);
}

function makeMoz (t1) {
   
    t1.forward(50);
    t1.right(90);
    t1.forward(50);
    t1.right(45);
    t1.forward(50);
    t1.right(90);
    t1.forward(50);
    t1.right(90);
    t1.forward(50);
    t1.right(90);
    t1.forward(50);
    t1.right(45);
    t1.forward(50);
    t1.right(90);
    t1.forward(50);
    t1.right(90);
    t1.forward(50);
    t1.right(90);
    t1.forward(50);
    t1.right(45);
    t1.forward(50);
    t1.right(90);
    t1.forward(50);
    t1.right(90);
    t1.forward(50);
    t1.right(90);
    t1.forward(50);
    t1.right(45);
    t1.forward(50);
    t1.right(90);
    t1.forward(50);
    t1.right(90);
    t1.forward(50);
    t1.forward(50);
    t1.right(90);
    t1.forward(50);
    t1.right(45);
    t1.forward(50);
    t1.right(90);
    t1.forward(50);
}

function makeMaz (t2) {

    t2.forward(25);
    t2.right(90);
    t2.forward(25);
    t2.right(45);
    t2.forward(25);
    t2.right(90);
    t2.forward(25);
    t2.right(90);
    t2.forward(25);
    t2.right(90);
    t2.forward(25);
    t2.right(45);
    t2.forward(25);
    t2.right(90);
    t2.forward(25);
    t2.right(90);
    t2.forward(25);
    t2.right(90);
    t2.forward(25);
    t2.right(45);
    t2.forward(50);
    t2.right(90);
    t2.forward(50);
    t2.right(90);
    t2.forward(50);
    t2.right(90);
    t2.forward(50);
    t2.right(45);
    t2.forward(50);
    t2.right(90);
    t2.forward(50);
    t2.right(90);
    t2.forward(50);
    t2.forward(50);
    t2.right(90);
    t2.forward(50);
    t2.right(45);
    t2.forward(50);
    t2.right(90);
    t2.forward(50);
}

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

There’s something simplistic and beautiful about these turtle designs. I’ve chosen to go a simpler route and just explore the shapes turtles can effortlessly create. I really enjoy these mosaic-shapes.

elizabew – project – 11 – composition

sketch

//Elizabeth Wang
//Section E
//elizabew@andrew.cmu.edu
//Project 11

var myTurtle = [];//array to store turtles
var movingTurtle = []; //array to store moving turtle
var d = 100; //degrees to keep movingTurtle moving
var dl = 50;//degrees to keep movingTurtle moving

function setup() {
  createCanvas(480, 480);
  background(32,50,103);
  frameRate(10);
}

function draw() {
  for(var i = 0; i < movingTurtle.length; i++) {
    //moving "bats"
    movingTurtle[i].setColor(color(25,61,mouseX));
    movingTurtle[i].setWeight(.5);
    movingTurtle[i].penDown();
    movingTurtle[i].forward(10);
    movingTurtle[i].right(d);
    movingTurtle[i].forward(2);
    movingTurtle[i].left(dl);
    movingTurtle[i].forward(15);
    d = d + 5; //makes the turtle move around the canvas continuously
    dl = dl + 2;
  }

  for(var i = 0; i < myTurtle.length; i++) {
    myTurtle[i].setColor(color(255,248,193));
    myTurtle[i].setWeight(2);
    myTurtle[i].penDown();
    myTurtle[i].forward(20); //flower/star shape
    myTurtle[i].right(90);
    myTurtle[i].forward(40);
    myTurtle[i].right(45);
    if (i % 10 == 0) { //every 10, large star
      myTurtle[i].setColor(color(255,224,9));
      myTurtle[i].forward(50);
      myTurtle[i].left(180);
  }
}

}

function mousePressed() {
  myTurtle.push(makeTurtle(mouseX, mouseY));//turtle appears when mouse is pressed
}

function mouseDragged(){
  movingTurtle.push(makeTurtle(mouseX, mouseY)); //turtle follows mouse dragging
}

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

Image using only mousePressed
Image using both mousePressed and mouseDragged

For this project, I wanted to create turtles that look like stars in the night sky, while also adding texture that could imitate fog. I made it so that the fog would change color as well in order to somewhat mirror the way fog changes tone depending on where the light source is.

At first I drew different star patterns on paper and then transferred my two favorite into the program. I made it so that smaller stars appear more often than the larger stars in an effort to imitate the “north star” with smaller stars surrounding it. I’m fairly happy with how it turned out, but if I could, it might have been fun to play with adding more visually different stars into the mix.

selinal-Project-11

sketch

//Selina Lee
//Section C
//selinal@andrew.cmu.edu
//Project-11

var turt1;
var turt2;
var turt3;

function setup() {
    createCanvas(480, 480);
    frameRate(10); //best speed for change in turtle function

}

function draw() {
	background(40, 255, 215); //aqua backround
	turt1 = makeTurtle(mouseX, mouseY); //follows mouse from center
	turt1.setColor(color(255, 0, 255)); //magenta
	turt1.setWeight(.5); //thin lines

	turt2 = makeTurtle(mouseX, mouseY); 
	turt2.setColor(color(255, 200, 0)); //orange turtles
	turt2.setWeight(4); 

	turt3 = makeTurtle(mouseX, mouseY);
	turt3.setColor(color(180, 255, 30)); //yellow turtles
	turt3.setWeight(10); //largest stroke weight span

	turt4 = makeTurtle(mouseX, mouseY);
	turt4.setColor(color(255, 100, 50));

	for(var i = 0; i < 12; i++) { //there are about 12 visible iterations of the yellow turtles 
		turt3.penDown();
		turt3.forward(random(30,35)*i); //by multiplying by i, the side lengths increase with each iteration of the turtle shape
		turt3.left(60); //constant angle for visual flow
		turt3.forward(random(30,35)*i); //larger length sides
		turt3.left(60);
		turt3.forward(random(30,35)*i);
		turt3.left(60);
		turt3.forward(random(30,35)*i);
		turt3.left(60);
		turt3.forward(random(30,35)*i);
		turt3.left(60);
		turt3.forward(random(30,35)*i);
		turt3.penUp();
	}

	for(var i = 0; i < 18; i++) { //iterations of the orange turtles
		turt2.penDown();
		turt2.forward(random(6,10)*i); //shorter sides
		turt2.right(72);
		turt2.forward(random(6,10)*i);
		turt2.right(72);
		turt2.forward(random(6,10)*i);
		turt2.right(72);
		turt2.forward(random(6,10)*i);
		turt2.right(72);
		turt2.forward(random(6,10)*i);
		turt2.penUp();
		turt2.left(20);
		turt2.forward(5);
	}

	for(var i = 0; i < 20; i++) { //there are about 20 visible iterations of the magenta turtles
		turt1.setWeight(i*.1); //stroke weight increases with side length of the turtle
		turt1.penDown();
		turt1.back(20*i/3); //medium scale sides scale sides
		turt1.left(random(50,70)); 
		turt1.back(20*i/3);
		turt1.left(random(50,70));
		turt1.back(20*i/3);
		turt1.left(random(50,70));
		turt1.back(20*i/3);
		turt1.left(random(50,70));
		turt1.back(20*i/3);
		turt1.left(random(50,70));
		turt1.back(20*i/3);
		turt1.penUp();
		turt1.right(noise(.001)*50); //natural movement away from the other circles with noise function
		turt1.back(40);	 //constant for visual appeal
	}

	for(var i = 0; i < 50; i++) {
		turt4.setWeight(i*.04);
		turt4.penDown();
		turt4.back(10*i/4);
		turt4.left(random(70,90));
		turt4.back(10*i/4);
		turt4.left(random(70,90));
		turt4.back(10*i/4);
		turt4.left(random(70,90));
		turt1.back(10*i/4);
		turt1.left(random(70,90));
		turt1.back(10*i/4);
		turt1.left(random(70,90));
		turt1.back(10*i/4);
		turt1.penUp();
		turt1.right(noise(.001)*50);
		turt1.back(80);	
	}

	if(mouseIsPressed) {
		noLoop();
	}
}


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

My process for this project started with playing around with the abstraction and composition of different polygons and their color. The mouse interaction and randomization were added after.

//Selina Lee
//Section C
//selinal@andrew.cmu.edu
//Project-11

var turt1;
var turt2;
var turt3;

function setup() {
    createCanvas(480, 480);
    frameRate(10); //best speed for change in turtle function

}

function draw() {
	background(40, 255, 215); //aqua backround
	turt1 = makeTurtle(mouseX, mouseY); //follows mouse from center
	turt1.setColor(color(255, 0, 255)); //magenta
	turt1.setWeight(.5); //thin lines

	turt2 = makeTurtle(mouseX, mouseY); 
	turt2.setColor(color(255, 200, 0)); //orange turtles
	turt2.setWeight(4); 

	turt3 = makeTurtle(mouseX, mouseY);
	turt3.setColor(color(180, 255, 30)); //yellow turtles
	turt3.setWeight(10); //largest stroke weight span

	turt4 = makeTurtle(mouseX, mouseY);
	turt4.setColor(color(255, 100, 50));

	for(var i = 0; i < 12; i++) { //there are about 12 visible iterations of the yellow turtles 
		turt3.penDown();
		turt3.forward(random(30,35)*i); //by multiplying by i, the side lengths increase with each iteration of the turtle shape
		turt3.left(60); //constant angle for visual flow
		turt3.forward(random(30,35)*i); //larger length sides
		turt3.left(60);
		turt3.forward(random(30,35)*i);
		turt3.left(60);
		turt3.forward(random(30,35)*i);
		turt3.left(60);
		turt3.forward(random(30,35)*i);
		turt3.left(60);
		turt3.forward(random(30,35)*i);
		turt3.penUp();
	}

	for(var i = 0; i < 18; i++) { //iterations of the orange turtles
		turt2.penDown();
		turt2.forward(random(6,10)*i); //shorter sides
		turt2.right(72);
		turt2.forward(random(6,10)*i);
		turt2.right(72);
		turt2.forward(random(6,10)*i);
		turt2.right(72);
		turt2.forward(random(6,10)*i);
		turt2.right(72);
		turt2.forward(random(6,10)*i);
		turt2.penUp();
		turt2.left(20);
		turt2.forward(5);
	}

	for(var i = 0; i < 20; i++) { //there are about 20 visible iterations of the magenta turtles
		turt1.setWeight(i*.1); //stroke weight increases with side length of the turtle
		turt1.penDown();
		turt1.back(20*i/3); //medium scale sides scale sides
		turt1.left(random(50,70)); 
		turt1.back(20*i/3);
		turt1.left(random(50,70));
		turt1.back(20*i/3);
		turt1.left(random(50,70));
		turt1.back(20*i/3);
		turt1.left(random(50,70));
		turt1.back(20*i/3);
		turt1.left(random(50,70));
		turt1.back(20*i/3);
		turt1.penUp();
		turt1.right(noise(.001)*50); //natural movement away from the other circles with noise function
		turt1.back(40);	 //constant for visual appeal
	}

	for(var i = 0; i < 50; i++) {
		turt4.setWeight(i*.04);
		turt4.penDown();
		turt4.back(10*i/4);
		turt4.left(random(70,90));
		turt4.back(10*i/4);
		turt4.left(random(70,90));
		turt4.back(10*i/4);
		turt4.left(random(70,90));
		turt1.back(10*i/4);
		turt1.left(random(70,90));
		turt1.back(10*i/4);
		turt1.left(random(70,90));
		turt1.back(10*i/4);
		turt1.penUp();
		turt1.right(noise(.001)*50);
		turt1.back(80);	
	}

	if(mouseIsPressed) {
		noLoop();
	}
}


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

mstropka-Project-11-E

sketch

function setup() {
    createCanvas(400, 400);
    background(0);
    strokeJoin(MITER);
    strokeCap(PROJECT);

}

function mousePressed(){

  drawturtles(mouseX, mouseY);

}

function drawturtles() {
  var t1 = makeTurtle(mouseX + 20, mouseY);
  var t2 = makeTurtle(mouseX - 20, mouseY);
  var t3 = makeTurtle(mouseX, mouseY + 20);
  var t4 = makeTurtle(mouseX, mouseY - 20);

  t1.penDown;
  t2.penDown;
  t3.penDown;
  t4.pendown;
  for(var i = 0; i < 480; i++){
    stroke(random(0,255),0,0);
    t1.forward(random(0,40));
    t1.right (random(0, 180));
    t1.forward (random(0,40));

    stroke(random(0,255), random(0,255), random(0,255));
    t2.forward(random(0,40));
    t2.right (random(0, 180));
    t2.forward (random(0,40));

    stroke(random(0,255), random(0,255), random(0,255));
    t3.forward(random(0,40));
    t3.right (random(0, 180));
    t3.forward (random(0,40));

    stroke(random(0,255), random(0,255), random(0,255));
    t3.forward(random(0,40));
    t3.right (random(0, 180));
    t3.forward (random(0,40));


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

For this week’s assignment, I made a program in which four turtles are drawn around the mouse when it is clicked. They move forward and right by random increments until they move off of the canvas.

selinal-Looking-Outwards-11

Surround Sounds by Christian Marclay

Surround Sounds is an art installation by Christian Marclay which entraps viewers in a room with projections that play “music” through their animation of visual onomatopoeias. The room is actually silent, but by using the animations to take over the space, sound can be envisioned, or felt in an alternative way. This piece shows an interesting connection between sound art and music, because the art under the category of sound art simply does not make sound. I admire this aspect of the piece. I am not sure if many algorithms were used directly in this piece, but Marclay worked with a team of animators in Adobe After Effects.