Jessica Timczyk – Project 11

sketch

// Jessica Timczyk
// Section D
// jtimczyk@andrew.cmu.edu
// Project-

var turtle 

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

    frameRate(10);
}


function draw() { 
    turtle = makeTurtle(mouseX, mouseY); // make turtle variables
    angle = turtle.angleTo(mouseX, mouseY);
    turtle.right(angle);
    turtle.forward(40);

   
    turtle.setWeight(6) // setting the specifications for the turtles lines
    strokeJoin(MITER);
    strokeCap(PROJECT);
    turtle.setColor(random(255)); //random colors

   
      turtle.penDown(); // make swirl shape
        turtle.forward(3);
        turtle.left(90);
        turtle.forward(50);
        turtle.right(90);
        turtle.forward(50);
        turtle.right(90);
        turtle.forward(37.5);
        turtle.right(90);
        turtle.forward(25);
        turtle.right(90);
        turtle.forward(12.5);
        turtle.right(90);
        turtle.forward(12.5);
        turtle.left(90);
        turtle.forward(12.5);
        turtle.left(90);
        turtle.forward(25);
        turtle.left(90);
        turtle.forward(37.5);
        turtle.left(90);
        turtle.forward(47);
        turtle.goto(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;
}

I really enjoyed doing this project. I had originally intended for the swirls to make a continuous line across the screen but after multiple tries I couldn’t seem to get them to follow each other. I think using turtle to create visuals is very fun and makes it a lot easier because it allows me to create individual shapes and patterns, like these swirls that can be moved all together without having to individually put in each value. next time I would like to try to figure out to create these patterns but have them be all connected with each other in a nice line.

Project 11 – Turtle Freestyle – John Legelis

sketch

// John Legelis
// Section D


var t // turtle
var yF = 273// Winning Y value
var w // State of play (Play, Win, or Lose)
var s // osilator incriment

//load background image
function preload() {
    maze = loadImage("https://i.imgur.com/OPGsUjg.png")
}

function setup() {
    createCanvas(400, 300);
    background(0);
    image(maze,0,0)
    
    fill(0,255,0)
    noStroke()
    rectMode(CORNER)
    rect(361, yF, 33,10)

    // initialize t
    t = makeTurtle(20,0)
    t.setWeight(4)
    mouseX = 20
    mouseY = 1 
    s = 0
    w = 0
    yF = 263
}

function draw() {
    //Oscilate between colors at winning and loosing screens
    s = s + 1
    if (s % 3 == 1){
        var lcol = [255,255,255]
        var wcol = [0,255,0]
    }
    else {
        var lcol = [255,0,0]
        var wcol = [255,255,255]
    }

    // retrive brightness at turtle location
    var p = maze.get(t.x, t.y)
    var Tbright = brightness(p)
    // If in "play" mode, move turtle towards the mouse
    if (w == 0) {
        theta = t.angleTo(mouseX, mouseY)
        t.right(theta)
        t.forward(1)
    }


    //if hit wall, lost
    if (Tbright < 100){
        w = -1
    }
    // if below "win line", won
    if (t.y > yF) {
        w = 1
    }
   
    // if lost...
    if (w == -1){
        background(lcol)
        stroke(255)
        textSize(50)
        text("G A M E O V E R", 10, 150)
        textSize(25)
        text("mouse in box to restart", 40, 30)
        noStroke()
        fill(0)
        rectMode(CENTER)
        rect(25,25, 10,10)
    }
    //if won...
    if (w == 1){
        background(wcol)
        stroke(255)
        textSize(50)
        text("! Y O U W O N !", 10, 150)
        stroke(255)
        textSize(25)
        text("mouse in box to restart", 40, 30)
        noStroke()
        fill(0)
        rectMode(CENTER)
        rect(25,25, 10,10)
    }

    //If lost or won and mouse is in box initialize and go back to "play" mode
    if (((w==-1) || w==1) & (mouseX > 25 - 10) && (mouseX < 25 + 10) && 
    (mouseY > 25 - 10) && (mouseY < 25 + 10)) {
        w = 0
        setup()
    }

    if (mouseIsPressed){
        w = 1
    }
}


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

When approaching this project I had an idea instantly to use the turtle to make some sort of maze game. Given our recent experience in using brightness and get image I was able to analyze a maze image and detect the walls very efficiently. I polished the game with a win and lose screen and a quick restart function based on mouse position.

Han Yu Project 11 Composition

click on Canvas to make spirals!

sketch

// Han Yu
// Section D
// hyu1@andrew.cmu.edu
// Project 11 Compostion

var ttl;

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

function draw() {
	var step = (frameCount/150);
	ttl.forward(step);
	ttl.left(5);
}

function mousePressed() {
	ttl = makeTurtle(mouseX, mouseY);
	var c = [255, 'purple', 255, 155]; //maximize the chances of getting a white stroke
	ttl.setColor(c[floor(random(0,4))]);
	ttl.setWeight((random(0,2)));

}

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

Spirals are my favorite patterns so I wanted to make my project with them. It was fun making variations in color and stroke but setting the steps for spirals are hard. Overall, doing this project has definitely made me more familiarized with turtles.

Screenshot of project.

Lan Wei-Project 11-Composition

my-sketch.js

//Lan wei
//Section D
//lanw@andrew.cmu.edu
//Project-11

var img;
var repeatTime = 1; // time repeated before the painting is finished
var numEachTime = 10; // number of turtles in each repeat time
var randomYArrays = []; //nested arrays including Y in each repeat time
var randomY = []; //arrays of Y in each repeat time
var bri; //brightness of the pixel

function preload(){
    img = loadImage("https://i.imgur.com/9e7ATQI.jpg?1.jpg");
}

function setup() {
    createCanvas(450, 450);
    img.loadPixels();
    background(0);
    for (var i = 0; i < repeatTime; i ++){
        for (var j = 0; j < numEachTime; j ++){ //add "numEachTime" values in randomY
            randomY.push(random(0, height));
        }
        randomYArrays.push(randomY);
        randomY = [];
    }
    frameRate(1);
}

function draw() {
    for (var i = 0; i < repeatTime; i ++){
        randomY = randomYArrays[i];
        for (var n = 0; n < numEachTime; n ++){
            drawTurtle(-100, randomY[n]);
        }
    }
}

function drawTurtle(tx, ty){
    var ttl = makeTurtle(tx, ty);
    ttl.penDown();

    //step 1
    bri = brightness(img.get(ttl.x, ttl.y)); //brightness of the pixels
    ttl.setColor(map(bri, 0, 100, 255, 70));
    ttl.setWeight(map(bri, 0, 100, 1, 2)); //change light weight according to brightness
    ttl.forward(random(20, 50));

    //step 2
    for(var i = 0; i < 15; i ++){
        var angle = 0;
        while (angle < 30){
            var angleSingleTime = random(0, 20);
            ttl.left(angleSingleTime);
            bri = brightness(img.get(ttl.x, ttl.y)); //brightness of the pixels
            ttl.setColor(map(bri, 0, 100, 255, 70));
            ttl.setWeight(map(bri, 0, 100, 1, 2)); //change light weight according to brightness
            ttl.forward(random(1, 3));
            angle += angleSingleTime;
        }

        //step 3
        while (angle < 90){
            var angleSingleTime = random(0, 20);
            ttl.right(angleSingleTime);
            bri = brightness(img.get(ttl.x, ttl.y)); //brightness of the pixels
            ttl.setColor(map(bri, 0, 100, 255, 70));
            ttl.setWeight(map(bri, 0, 100, 1, 2)); //change light weight according to brightness
            ttl.forward(random(1, 3));
            angle += angleSingleTime;
        }

        //step 4
        while (angle < 120){
            var angleSingleTime = random(0, 20);
            ttl.left(angleSingleTime);
            bri = brightness(img.get(ttl.x, ttl.y)); //brightness of the pixels
            ttl.setColor(map(bri, 0, 100, 255, 70));
            ttl.setWeight(map(bri, 0, 100, 1, 2)); //change light weight according to brightness
            ttl.forward(random(1, 3));
            angle += angleSingleTime;
        }

        //step 5
        bri = brightness(img.get(ttl.x, ttl.y)); //brightness of the pixels
        ttl.setColor(map(bri, 0, 100, 255, 70));
        ttl.setWeight(map(bri, 0, 100, 1, 2)); //change light weight according to brightness
        ttl.forward(random(20, 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(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 planned to draw abstract ‘Sherlock’ with turtles. The process didn’t go smoothly. I tested different moving modes of the turtles and finally decided to use the one with some randomness but generally moving from the left of the canvas to the right. There are some aspects of the project that don’t reach my expectation (for example the nested loop might have some problems), but the result is good and the effect of old movie is kind of surprising.

Process Sherlock 1
Process Sherlock 2

Yoo Jin Shin-Project-11-Composition

Project-11

// Yoo Jin Shin
// Section D
// yoojins@andrew.cmu.edu
// Project 11 Turtle Freesytle

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

var particles = [];

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

    // Making particles/"rain"
    for (var i = 0; i < np; i++) {
        var p = makeParticle(200, 200,
                             random(-50, 50), random(-50, 50));
        particles.push(p);
    }
    frameRate(10);
}

function draw() { 
    // Gradient green/grass background based on mouse
    var r = map(mouseX, 0, width, 70, 120); 
    var b = map(mouseY, 0, height, 90, 120);
    background(r, 170, b);

    // Center rose on mouse
    var ttl = makeTurtle(mouseX, mouseY);
    ttl.penDown();
    ttl.setColor("pink");
    ttl.setWeight(1);
    ttl.left(frameCount);
    ttl.face(190);

    for (var i = 0; i < 25; i++) {
        ttl.face(225 - i * 100);
        for (var j = 0; j < 6; j++) {
            ttl.forward(3 + i * 2);
            ttl.left(80);
        }
    }
    ttl.penUp();

    /// Left smaller rose 
    var ttl2 = makeTurtle(mouseX - 50, mouseY);
    ttl2.penDown();
    ttl2.setColor(150);
    ttl2.setWeight(1);
    ttl2.left(frameCount);
    ttl2.face(190);

    for (var i = 0; i < 10; i++) {
        ttl2.face(225 - i * 100);
        for (var j = 0; j < 6; j++) {
            ttl2.forward(2 + i * 2);
            ttl2.left(70);
        }
    }
    ttl.penUp();

    /// Right smaller rose 
    var ttl2 = makeTurtle(mouseX + 50, mouseY);
    ttl2.penDown();
    ttl2.setColor(150);
    ttl2.setWeight(1);
    ttl2.left(frameCount);
    ttl2.face(190);

    for (var i = 0; i < 10; i++) {
        ttl2.face(225 - i * 100);
        for (var j = 0; j < 6; j++) {
            ttl2.forward(2 + i * 2);
            ttl2.left(70);
        }
    }
    ttl.penUp();

    // Draw all particles in the array
    if (mouseIsPressed) {
        var newp = makeParticle(mouseX, mouseY,
                                random(-10, 10), random(-10, 0));
        particles.push(newp);
    }

    newParticles = [];
    for (var i = 0; i < particles.length; i++) { 
        var p = particles[i];
        p.step();
        p.draw();
        if (p.age < 200) {
            newParticles.push(p);
        }
    }
    particles = newParticles;

}

var gravity = 0.3; // downward acceleration
var springy = 0.7; // how much velocity is retained after bounce
var drag = 0.0001; // drag causes particles to slow down
var np = 100;      // how many particles
var COLORS = ["White", "#86E3F2", "#37A3B5", "#357CA8", "#14608E"];

function particleStep() {
    this.age++;
    this.x += this.dx;
    this.y += this.dy;
    if (this.x > width) { // bounce off right wall
        this.x = width - (this.x - width);
        this.dx = -this.dx * springy;
    } else if (this.x < 0) { // bounce off left wall
        this.x = -this.x;
        this.dx = -this.dx * springy;
    }
    if (this.y > height) { // bounce off bottom
        this.y = height - (this.y - height);
        this.dy = -this.dy * springy;
    } else if (this.y < 0) { // bounce off top
        this.y = -this.y;
        this.dy = -this.dy * springy;
    }
    this.dy = this.dy + gravity; // force of gravity
    var vs = Math.pow(this.dx, 2) + Math.pow(this.dy, 2);
    var d = vs * drag;
    d = min(d, 1);

    // Repelling force from center rose
    var rpx = mouseX;
    var rpy = mouseY;
    var d2 = dist(rpx, rpy, this.x, this.y);
    var rpc = 9000;
    var f = rpc / (Math.pow(d2, 2));
    var dirx = (this.x - rpx) / d2;
    var diry = (this.y - rpy) / d2;
    // scale dx and dy to include drag effect
    this.dx *= (1 - d);
    this.dx += dirx * f;
    this.dy *= (1 - d)
    this.dy +=  diry * f;
}

function particleDraw() {
  fill(this.particleColor);
  noStroke();
  ellipse(this.x, this.y, this.particleSize, this.particleSize);
  point(this.x, this.y);
}

function pickColor() {
  return COLORS[int(random(COLORS.length))];
}

function pickSize() {
  return random(5, 30);
}

// create a "Particle" object with position and velocity
function makeParticle(px, py, pdx, pdy) {
    p = {x: px,
       y: py,
         dx: pdx, 
         dy: pdy,
         age: 0,
         step: particleStep,
         draw: particleDraw,
         particleColor : pickColor(),
         particleSize : pickSize(),
        }
    return p;
}

I created this project with a flower garden in mind: there are rose-like shapes created using turtle, a green, grass-like background, and many blue, rain-like particles. There is a force around the center rose that repels the rain.

Repelling force

 

Jessica Timczyk – Looking Outwards 11

A picture of the Eigenharp instrument

The Eigenharp is an electronic instrument made by Eigenlabs in 2008, based in the UK and invented by John Lambert. The instrument is essentially a highly flexible and portable controller, in which the sound or music is being generated in the software that it drives. I really like this project because I find it interesting that it visually looks like a wind instrument like a bassoon, but is in fact an electronic instrument. Each of the keys are velocity sensitive and act like a joystick. Although I am not entirely sure how the algorithm behind the instrument works, I suppose that it works by changing or altering the sound that comes out the intstrument based upon the keys that the player presses. The artistic influence of the creator can be seen in the array of different manipulations that a player can influence given the keys on the instrument.

Yoo Jin Shin-LookingOutwards-11

Sonic Playground

Sonic Playground (2018) at the High Museum of Art, Atlanta, GA

Sonic Playground by Yuri Suzuki is “an outdoor sound installation that features ingenious, colourful sculptures that modify and transmit sound in unusual, engaging and playful ways.” The colors used in the installation are so vibrant and really catch the eyes of those passing by.

Rhinoceros 3D / Grasshopper Pipes

The software behind this installation was designed by Luca Dellatorre using Grasshopper, as a parametric design plug-in in Rhinoceros. “The plug in he wrote is a 3D raytracing tool that allows the user to select a sound source and send sound in a certain direction or towards a certain geometry, in this case the shape of the acoustic mirrors or the bells at the start and end of the pipes to see how the sound is reflected and what is the interaction with the object.” It’s cool to see how such a seemingly simple installation can have such a complex architecture on the back-end.

Han Yu Looking Outward 11

Skirting on Thin Ice by Neotropic (Riz Maslen)

Riz Maslen is a British electronic music artist, producer, singer and multi-instrumentalist. She is one of the most recognized female composers in the field of post-techno experimental electronics. She first started out experimenting electronic music in 1996. Malsen had produced an extensive profile of music under the names Neotropic and Small Fish with Spine and performed in huge music festivals like Coachella.

Skirting on Thin Ice is performed by Riz Malsen on the Opening of  London’s Artisit Quarter in 2011. Aside from making music and programming, Malsen also produces photographic slides and films as a live background during her performance as a complimentary medium to present a more holistic and multi-media experience for her audience. Just like the other tracks by Malsen I’ve came across when researching for this project, Skirting on Thin Ice has the same warm and mellow vibe that brings out the perfect amount of chill and energy. There are also slight variations nicely woven into the whole song which keep listeners eager to find out what’s next. I am impressed by the vast amount of creativity and innovation found in Malsen’s productions and I especially like this opening song as it somehow brings out my inner peace whenever I listen to it.

Lan Wei-Looking Outwards-11

The name of the project is ‘Mr Shadow’ and the project was created by Scientists at SONY CSL Research Laboratory in 2016.

I looked at lots of videos about computer music before decided to investigate this one. The reason is that for me most of the ‘computer music’ are only making use of computers to save time in producing the rhythms without digging into the specialities of computers. But this one produced by Artificial Intelligence is special in my perspective. It contains not only rhythms that lift people’s spirit, but also, most importantly, human motions. It’s exciting to see how a ‘dead’ computer can produce such vivid music with ups and downs through analysing precedents. And this leads to another question: whether computers will replace artists totally in the future? I can write an essay about this but I’m not going to discuss the topic here. I just want to say this project is very exciting and inspiring.

Besides the music itself, the graphic effect is also very good and it echoes with the music very well. In general, the computer-generated music really takes me into its world.

JJ Legelis Project 10

Boats and Waves

sketch

// John Legelis
// Section D

var boat = []

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

}

function draw() {

    background(135, 206, 250)

    //Land terrain
    var land = 0.003;
    var landS = 0.00005;
    stroke("green");
    beginShape(); 
    for (i = 0; i < width; i++) {
        var h = (millis() * landS) + (i * land);
        var y = map(noise(h), 0, 1, 100, 0);
        line(i, y, i, height);
    }
    endShape();

    // Rear wave
    var back = 0.0051;
    var backS = 0.0002;
    stroke(0,142,170);
    beginShape(); 
    for (i = 0; i < width; i++) {
        var h = (millis() * backS) + (i * back);
        var y = map(noise(h), 0, 1, 200, 0);
        line(i, y, i, height);
    }
    endShape();

    //probablity that determines if boat is drawn
    if (random() < 0.03){
        boat.push(makeBoat())
    }
    //Draw and move the boat if made
    for (var h = 0; h < boat.length; h++){
        boat[h].draw()
        boat[h].move() 
    }


    //middle wave terrain
    var mid = 0.0054;
    var midS = 0.0004;
    stroke(0,153,183);
    beginShape(); 
    for (j = 0; j < width; j++) {
        var h = (millis() * midS) + (j * mid);
        var y = map(noise(h), 0, 1, 300, 200);
        line(j, y, j, height);
    }
    endShape();

    //foreground wave
    var fore = 0.006;
    var foreS = 0.0007;
    stroke(0,172,206);
    beginShape(); 
    for (j = 0; j < width; j++) {
        var h = (millis() * foreS) + (j * fore);
        var y = map(noise(h), 0, 1, height, 300);
        line(j, y, j, height);
    }
    endShape();


}

//object containig boat
function makeBoat(){
    var bo = {x:480, y: 230, move: moveBoat, draw: drawBoat}
    return bo
}

//what boat looks like
function drawBoat(){
    var randsailH = random(30,50)
    noStroke()
    fill("brown")
    rect(this.x, this.y, 60,20)
    fill("white")
    triangle(this.x + 10, this.y, this.x + 35, this.y - randsailH, this.x + 25, this.y)
    triangle(this.x + 40, this.y, this.x + 65, this.y - randsailH, this.x + 55, this.y)
    }

// Move that boat
function moveBoat(){
    this.x = this.x - 4 
}



This week’s sketch was a rather large undertaking as it involved using objects on our own for the first time. It took quite some time to be able to properly implement an object without having my hand held through the lab but I eventually succeeded. I stumbled upon the random sail movement by accident but I loved the effect of billowing sails in the wind.