Caroline Song – [OLD FALL 2019] 15-104 • Introduction to Computing for Creative Practice https://courses.ideate.cmu.edu/15-104/f2019 Professor Roger B. Dannenberg • Fall 2019 • Introduction to Computing for Creative Practice Thu, 05 Dec 2019 19:01:34 +0000 en-US hourly 1 https://wordpress.org/?v=5.2.20 Caroline Song – Final Project https://courses.ideate.cmu.edu/15-104/f2019/2019/12/05/caroline-song-final-project/ https://courses.ideate.cmu.edu/15-104/f2019/2019/12/05/caroline-song-final-project/#respond Thu, 05 Dec 2019 19:01:34 +0000 https://courses.ideate.cmu.edu/15-104/f2019/?p=53275 Continue reading "Caroline Song – Final Project"]]>

sketch

var color1; 
var color2;
var cSharp4;
var d4;
var dSharp4;
var e4;
var f4;
var fSharp4;
var g4;
var gSharp4;
var a5;
var aSharp5;
var b5;
var c5;
var cSharp5;
var d5;
var dSharp5;
var e5;

function preload() {
    //call loadSound() for all media files here
    cSharp4 = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/csharp.m4a");
    d4 = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/d.m4a");
    dSharp4 = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/dsharp.m4a");
    e4 = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/e-1.m4a");
    f4 = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/f.m4a");
    fSharp4 = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/fsharp.m4a");
    g4 = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/g.m4a");
    gSharp4 = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/gsharp.m4a");
    a5 = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/a.m4a");
    aSharp5 = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/asharp.m4a");
    b5 = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/b.m4a");
    c5 = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/c.m4a");
    cSharp5 = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/csharp2.m4a");
    d5 = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/d2.m4a");
    dSharp5 = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/dsharp2.m4a");
    e5 = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/e2.m4a");
}

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

    //background color
    color1 = color(255, 248, 120);
    color2 = color(235, 101, 52);
    setGradient(color1, color2);

}

function draw() {
        //draw the piano
        drawPiano();

}

function setGradient(c1, c2) {
    //Creating red to yellow gradient
    for(var i = 0; i <= height/2; i++) {
      var x1 = map(i, 0, height/2, 0, 1);
      var c3 = lerpColor(color1, color2, x1);
      stroke(c3);
      line(0, i, width, i);
    }

}

function drawPiano() {
    //set stroke weight of piano
    stroke(0)
    strokeWeight(2);
    // draw white keys
    for (i = 0; i < width; i++) {
        fill(255);
        rect(0 + i * 70, 150, 70, 250);

    }
    // draw black keys
    for (i = 0; i < 2; i++) {
        fill(0);
        rect(-15 + 70 * i, 150, 30, 150);
        rect(475 + 70 * i, 150, 30, 150);
    }

    for(i = 0; i < 3; i++){
        fill(0);
        rect(195 + 70 * i, 150, 30, 150);
    }

}

function mousePressed() {
    //let each white key play a different whole note and display the note it's playing
    if (mouseX > 10 & mouseX < 60 && mouseY > 150 && mouseY < height) {
        d4.play();
        textSize(50);
        textAlign(CENTER);
        text('D4', width/2, height/3);
        fill(0);

    }

    if (mouseX > 80 & mouseX < 140 && mouseY > 150 && mouseY < height) {
        e4.play();
        textSize(50);
        textAlign(CENTER);
        text('E4', width/2, height/3);
        fill(0);
    }

    if (mouseX > 140 & mouseX < 200 && mouseY > 150 && mouseY < height) {
        f4.play();
        textSize(50);
        textAlign(CENTER);
        text('F4', width/2, height/3);
        fill(0);
    }

    if (mouseX > 220 & mouseX < 270 && mouseY > 150 && mouseY < height) {
        g4.play();
        textSize(50);
        textAlign(CENTER);
        text('G4', width/2, height/3);
        fill(0);
    }

    if (mouseX > 290 & mouseX < 340 && mouseY > 150 && mouseY < height) {
        a5.play();
        textSize(50);
        textAlign(CENTER);
        text('A5', width/2, height/3);
        fill(0);
    }

    if (mouseX > 360 & mouseX < 420 && mouseY > 150 && mouseY < height) {
        b5.play();
        textSize(50);
        textAlign(CENTER);
        text('B5', width/2, height/3);
        fill(0);
    }

    if (mouseX > 420 & mouseX < 480 && mouseY > 150 && mouseY < height) {
        c5.play();
        textSize(50);
        textAlign(CENTER);
        text('C5', width/2, height/3);
        fill(0);
    }

    if (mouseX > 500 & mouseX < 550 && mouseY > 150 && mouseY < height) {
        d5.play();
        textSize(50);
        textAlign(CENTER);
        text('D5', width/2, height/3);
        fill(0);
    }

    if (mouseX > 570 & mouseX < width && mouseY > 150 && mouseY < height) {
        e5.play();
        textSize(50);
        textAlign(CENTER);
        text('E5', width/2, height/3);
        fill(0);
    }

    //let each black key play a different sharp/flat note and display the note it's playing
    if (mouseX > 0 & mouseX < 20 && mouseY > 150 && mouseY < 300) {
        cSharp4.play();
        textSize(50);
        textAlign(CENTER);
        text('C#4', width/2, height/3);
        fill(0);
    }

    if (mouseX > 50 & mouseX < 90 && mouseY > 150 && mouseY < 300) {
        dSharp4.play();
        textSize(50);
        textAlign(CENTER);
        text('D#4', width/2, height/3);
        fill(0);
    }

    if (mouseX > 190 & mouseX < 230 && mouseY > 150 && mouseY < 300) {
        fSharp4.play();
        textSize(50);
        textAlign(CENTER);
        text('F#4', width/2, height/3);
        fill(0);
    }

    if (mouseX > 260 & mouseX < 300 && mouseY > 150 && mouseY < 300) {
        gSharp4.play();
        textSize(50);
        textAlign(CENTER);
        text('G#4', width/2, height/3);
        fill(0);
    }

    if (mouseX > 330 & mouseX < 370 && mouseY > 150 && mouseY < 300) {
        aSharp5.play();
        textSize(50);
        textAlign(CENTER);
        text('A#5', width/2, height/3);
        fill(0);
    }

    if (mouseX > 480 & mouseX < 510 && mouseY > 150 && mouseY < 300) {
        cSharp5.play();
        textSize(50);
        textAlign(CENTER);
        text('C#5', width/2, height/3);
        fill(0);
    }

    if (mouseX > 540 & mouseX < 580 && mouseY > 150 && mouseY < 300) {
        dSharp5.play();        
        textSize(50);
        textAlign(CENTER);
        text('D#5', width/2, height/3);
        fill(0);
    }

}

function mouseReleased() {
    //if mouse is released, the text disappears
    color1 = color(255, 248, 120);
    color2 = color(235, 101, 52);
    setGradient(color1, color2);
}


For my final project, I created an interactive piano, with the intention of having children who are just starting to learn how to play the piano use this program as sort of a beginners trial. When pressing on a certain key, the name of that key lights up in the middle of the canvas, with the purpose of having users understand the name of the key while playing around with the piano and learning the actual names of the keys as well.

]]>
https://courses.ideate.cmu.edu/15-104/f2019/2019/12/05/caroline-song-final-project/feed/ 0
Caroline Song – Looking Outwards 12 https://courses.ideate.cmu.edu/15-104/f2019/2019/11/10/caroline-song-looking-outwards-12/ https://courses.ideate.cmu.edu/15-104/f2019/2019/11/10/caroline-song-looking-outwards-12/#respond Sun, 10 Nov 2019 17:12:38 +0000 https://courses.ideate.cmu.edu/15-104/f2019/?p=52455 Continue reading "Caroline Song – Looking Outwards 12"]]>

Because I know I want my final project to relate to generative sound, I wanted to hone in on pieces and artists who worked with such medias in this last Looking Outwards post.

The first project I decided to look at is by April Aliermo. She focuses on installations and performances that are immersive experiences and are representative (in sonic form) of her values. Working with Kristina Guison and Kat Estacio, together they created an interactive installation called Dahan, Dahan Slowly, Carefully.

This piece involves disks of ice that melt and those drops go to hit the metal sculptures in different ways in order to induce percussive sounds which change as time goes on and the ice continues to melt. With each water droplet, there are generative visuals that respond and change accordingly. This is a intended to be meditative sculpture installation for the Long Stone, Gladwell Hotel in 2019

I admire the interactive element in the installation and the way it uses typical objects in everyday life, metal and ice, and suddenly amplifies the way we can use such materials by having them interact with each other and furthermore, I especially appreciate how the interaction will change at different stages of time based on how fast/slow the ice is melting and the acknowledgement of this change with the generated visuals that respond to the water drops.

In my opinion, I wish they had explored even further with different materials that the water drops hit, more so that just metal, in order to go more into depth as to how different materials affect the sound of water and therefore, how different materials can affect the accompanied generative visuals. Furthermore, I also wish they had explored the different factors that can make water melt faster or slower. I think that would have been very interesting in terms of a next step of this project. They have explored how free and how much expression can go into this piece and now to reverse the meaning and try to restrain water, an element that is not so easily controlled, would be interesting.

The second piece I chose to look at is by Helen Alexandra. She created a Prototype for a Multi-Species Architectural Element which is an interactive window installation with the purpose of attempting to create a connection between humans and the natural world.

Using sensors and motors, she created a piece that responds to the needs of specifically living moss and humans. In a window unit, there are automated apertures that change based on whether or not a human is detected about 10 feet from the window, in which the aperture will shift to accommodate the amount of sunlight that the human wants. When there is no human detected, the aperture shifts in accordance to what the living moss needs.

Prototype for a Multi-Species Architectural Element by Helen Alexander

I admire this project because of the end purpose that Alexandra wanted, which was to foster some sort of connection between humanity and nature which I think is important because humans take the natural world for granted most of the time.

I think to further this project, I would want to see Alexandra expanding this idea to not only the window, but perhaps different parts of the home/life in general in order to further deepen humanity’s appreciation for nature by seeing how nature fits in our daily life in many different places and different aspects.

Comparing these two installations together, I see the similarities in that the artists are trying to take advantage of natural elements of the world, such as water and earth. I think both of them are making a statement of the importance of these elements and are also trying to teach viewers and users how to interact with such elements and how many different ways there are to do so.

]]>
https://courses.ideate.cmu.edu/15-104/f2019/2019/11/10/caroline-song-looking-outwards-12/feed/ 0
Caroline Song – Project 12 – Final Project Proposal https://courses.ideate.cmu.edu/15-104/f2019/2019/11/09/caroline-song-project-12-final-project-proposal/ https://courses.ideate.cmu.edu/15-104/f2019/2019/11/09/caroline-song-project-12-final-project-proposal/#respond Sun, 10 Nov 2019 04:34:11 +0000 https://courses.ideate.cmu.edu/15-104/f2019/?p=52440 Continue reading "Caroline Song – Project 12 – Final Project Proposal"]]>

Throughout this entire class, I was most intrigued when learning about sound and how to incorporate sound as another element in p5js. I found the interactions between sound and our visuals we were creating to be fascinating and that is what I wanted to focus on in my final project.

And so, for my final project, I want to create an interactive piano (possibly incorporating about an octave and a half). Within this piano, when the user presses on a certain key, a specific note will play, and the user can create a song. From there, I also wanted a feature of having music notes come out of the mouse when it clicks on the keys and for the keys itself to darken to a different color to signal that it has been pressed.

Furthermore, I also thought about incorporating another element of being able to press a key down and the piano being able to show the user on perhaps the upper left corner of the canvas, the name of the note they pressed on exactly. The purpose of this project is to create an educational game for young children who perhaps want to start learning how to play the piano with this beginner level introduction. The piece will give them positive feedback as they press different notes and also have an element of intrigue with the music notes when they press on the keys. The canvas being able to show the user the note they are playing is part of the educational aspect of the piece so that the user will be able to understand what notes they are playing on the piano and further their comfortability in learning a new instrument with this exposure and beginning steps.

Sketch of final project proposal
]]>
https://courses.ideate.cmu.edu/15-104/f2019/2019/11/09/caroline-song-project-12-final-project-proposal/feed/ 0
Caroline Song – Project 11 – Landscape https://courses.ideate.cmu.edu/15-104/f2019/2019/11/07/caroline-song-project-11-landscape/ https://courses.ideate.cmu.edu/15-104/f2019/2019/11/07/caroline-song-project-11-landscape/#respond Fri, 08 Nov 2019 03:42:40 +0000 https://courses.ideate.cmu.edu/15-104/f2019/?p=51866 Continue reading "Caroline Song – Project 11 – Landscape"]]>

sketch

//Caroline Song
//chsong@andrew.cmu.edu
//Section E
//Project 11: Landscape

var tree = [];
var star = [];
var speedTerrain = 0.001;
var slopeTerrain = 0.008;
var yPoint = 380; //where mountains meet ground
//2, 19, 46

function setup() {
    createCanvas(480, 480); 
    
    // create an initial collection of stars
    for (var i = 0; i < 25; i++){
        var starX = random(width);
        var starY = random(0, height/2);
        star[i] = makeStar(starX, starY);
    }

    //create an initial collection of trees
    for (var i = 0; i < 10; i++){
        var treeX = random(width);
        var treeY = random(360, 380);
        tree[i] = makeTree(treeX, treeY);
    }
    frameRate(10);
}


function draw() {
    background(0, 19, 48); 
    fill(43, 75, 128)
    //draw ground
    rect(0, yPoint, width, 150);

    displayStars();
    drawTallerMountains();
    drawMountains();
    displayTree();
}

function displayTree(){
    //call move and show trees
    for (var l = 0; l < tree.length; l++){
        tree[l].move();
        tree[l].draw();
    }
}

function moveTree(){
    //set speed of trees and repeat them as they leave the screen 
    this.x2 += this.speed2;
    if(this.x2 <= -10) {
        this.x2 += width
    }
}

function drawTree(){
    //draw trees
    noStroke();
    fill(54, 100, 156);
    push();
    translate(this.x2, this.y2);
    triangle(3, -this.treeHeight, -this.treeWidth/2, 3, this.treeWidth/2 + 5, 3)
    rect(0, 0, 7, 20);
    pop();

}

function makeTree(locationX, locationY){
    var makeT = {x2: locationX,
                y2: locationY,
                treeWidth: random(20, 30),
                treeHeight: random(15, 40),
                speed2: -5,
                move: moveTree,
                draw: drawTree}
    return makeT;
} 

function drawStar(){
    var starWidth = random(1, 3); //make stars sparkle!
    //draw stars
    noStroke();
    fill(252, 232, 3);
    push();
    translate(this.x, this.y);
    ellipse(20, 20, starWidth, starWidth);
    pop();
}

function makeStar(locationX, locationY){
    var makeS = {x: locationX,
                y: locationY,
                speed: -5,
                move: moveStar,
                draw: drawStar}
    return makeS;
}

function moveStar(){
    //speed of star and repeat on canvas
    this.x += this.speed;
    if(this.x <= -10){
        this.x += width;
    }
}

function displayStars(){
    //display stars
    for(i = 0; i < star.length; i++){
        star[i].move();
        star[i].draw();
    }
}

function drawMountains(){
    //draw front mountains
    stroke(5, 40, 97);
    beginShape();
    for (var i = 0; i < width; i++){
        var t = (i * slopeTerrain) + (millis() * speedTerrain);
        var y = map(noise(t), 0, 1, 100, 400);
        line(i, y, i, yPoint);
    }
    endShape();
}

function drawTallerMountains(){
    //draw back mountains
    stroke(1, 27, 66)
    beginShape();
    for(var i2 = 0; i2 < width; i2++){
        var t2 = (i2 * slopeTerrain * 2) + (millis() * speedTerrain);
        var y2 = map(noise(t2), 0, 1, 100, 200);
        line(i2, y2, i2, yPoint);
    }
    endShape();
}

I took my inspiration from the times when I was little and went camping with my family. Some of my favorite memories were in the car on our way there or back home and looking out the car window. I would see the mountain landscape/all the stars and my parents would be telling us stories about the different constellations in the sky. I wanted to create contrast between the foreground and the background with value contrast in the blue tones.

Sketch of my landscape
]]>
https://courses.ideate.cmu.edu/15-104/f2019/2019/11/07/caroline-song-project-11-landscape/feed/ 0
Caroline Song – Project 10 – Sonic Sketch https://courses.ideate.cmu.edu/15-104/f2019/2019/11/01/caroline-song-project-10-sonic-sketch/ https://courses.ideate.cmu.edu/15-104/f2019/2019/11/01/caroline-song-project-10-sonic-sketch/#respond Fri, 01 Nov 2019 23:48:59 +0000 https://courses.ideate.cmu.edu/15-104/f2019/?p=50821 Continue reading "Caroline Song – Project 10 – Sonic Sketch"]]>

sketch

//Caroline Song
//chsong@andrew.cmu.edu
//Section E
//Project 10 - Sonic Sketch

var crashCymbal;
var rideCymbal;
var bassDrum;
var highTom;
var midTom;

function preload() {
    // call loadImage() and loadSound() for all media files here
    crashCymbal = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/cymbals_1.wav");
    rideCymbal = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/ridecymbal.wav");
    bassDrum = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/bassdrum.wav");
    highTom = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/hightomdrum.wav");
    midTom = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/midtomdrum.wav");
}


function setup() {
    createCanvas(550, 420);
}


function draw() {
    background("pink");

    //drawing right cymbal stand
    push();
    strokeWeight(3)
    line(420, 75, 495, height/2);
    line(495, height/2, 450, 350);
    line(450, 350, 485, 380);
    line(450, 350, 450, 380);
    line(450, 350, 415, 380);
    pop();

    //drawing right cymbal
    push();
    fill(255, 218, 130);
    noStroke();
    translate(420, 75);
    rotate(10/3);
    ellipse(0, 0, 150, 30);
    pop();

    //drawing left cymbal stand
    push();
    strokeWeight(3);
    line(120, 75, 45, height/2);
    line(45, height/2, 90, 350);
    line(90, 350, 55, 380);
    line(90, 350, 90, 380);
    line(90, 350, 125, 380);

    //drawing left cymbal
    push();
    fill(255, 218, 130);
    noStroke();
    translate(120, 75);
    rotate(-10/3);
    ellipse(0, 0, 150, 30);
    pop();

    //drawing middle (bass) drum
    push();
    fill(191, 6, 0);
    noStroke();
    ellipse(width/2 - 15, 280, 200, 200);
    fill(240);
    ellipse(width/2 - 15, 280, 170, 170);
    fill(0);
    rect(width/2 + 65, 280, 25, 10);
    rect(width/2 - 15, 280 + 80, 10, 25);
    rect(width/2 - 120, 280, 25, 10);
    pop();


    //drawing top left drum
    push();
    fill(191, 6, 0);
    noStroke();
    translate(168, 160);
    rotate(10/3);
    rect(-45, -45, 89, 60);
    pop();

    push();
    fill(191, 6, 0);
    noStroke();
    translate(171, 145);
    rotate(10/3);
    ellipse(0, 0, 90, 30);
    pop();

    push();
    fill(240);
    noStroke();
    translate(160, 200);
    rotate(10/3);
    ellipse(0, 0, 90, 30);
    pop();

    //drawing top right drum
    push();
    fill(191, 6, 0);
    noStroke();
    translate(350, 160);
    rotate(-10/3);
    rect(-45, -45, 89, 60);
    pop();

    push();
    fill(191, 6, 0);
    noStroke();
    translate(348, 145);
    rotate(-10/3);
    ellipse(0, 0, 90, 30);
    pop();

    push();
    fill(240);
    noStroke();
    translate(358, 200);
    rotate(-10/3);
    ellipse(0, 0, 90, 30);
    pop();

}

function mousePressed() {
    //crash cymbal sound when clicking on right cymbal
    if(mouseX > 345 & mouseX < 495 && mouseY > 55 && mouseY < 95){
       crashCymbal.play();
   }

   //ride cymbal sound when clicking on left cymbal
   if(mouseX > 40 & mouseX < 190 && mouseY > 55 && mouseY < 95){
       rideCymbal.play();
   }

   //bass drum sound when clicking on middle drum
   if(mouseX > 160 & mouseX < 350 && mouseY > 180 && mouseY < 370){
       bassDrum.play();
   }

   //high tom sound when clicking on right small drum
   if(mouseX > 310 & mouseX < 400 && mouseY > 130 && mouseY < 210){
       highTom.play();
   }

   //mid tom sound when clicking on left small drum
   if(mouseX > 50 & mouseX < 200 && mouseY > 130 && mouseY < 210){
        midTom.play();
   }
}

I had a lot of fun creating this sonic sketch. For this project, I wanted to create a simplified drum set using 5 sounds. When clicking on the different drums and cymbals, the different sounds, in accordance to what the drum or cymbal is, will play.

The bass drum sound will activate when clicking on the middle/ biggest drum

The high tom sound will activate when clicking on the high tom drum (the right small drum)

The low tom sound will activate when clicking on the low tom drum (the left small drum)

The crash cymbal sound will activate when clicking on the right cymbal

The ride cymbal sound will activate when clicking on the left cymbal

]]>
https://courses.ideate.cmu.edu/15-104/f2019/2019/11/01/caroline-song-project-10-sonic-sketch/feed/ 0
Caroline Song – Looking Outwards 10 – Computer Music https://courses.ideate.cmu.edu/15-104/f2019/2019/11/01/caroline-song-looking-outwards-10-computer-music/ https://courses.ideate.cmu.edu/15-104/f2019/2019/11/01/caroline-song-looking-outwards-10-computer-music/#respond Fri, 01 Nov 2019 19:44:14 +0000 https://courses.ideate.cmu.edu/15-104/f2019/?p=50537 Continue reading "Caroline Song – Looking Outwards 10 – Computer Music"]]>

The installation of sound art that I will be looking at this week is called “Cycling Wheel by Keith Lam, Seth Hon, and Alex Lai, made in 2017.

“Cycling Wheel” Installation

This piece of art was inspired from the Bicycle Wheel piece made by Marcel Duchamp. It borrows the concept from Duchamp and redesigns it as an interactive and performative installation piece.

I was attracted to this project because of the way it reimagines something as simple as a bicycle wheel (which is an object that is commonly known), into an interactive art piece that brings dynamic motion through light and sound to this static object. It takes the bicycle wheel and allows the audience to imagine it when it actually is functioning through an entire bicycle. Furthermore, it takes the experience of biking one step further by introducing sound and light into the mechanics, which is not the typical way you experience biking. The most intriguing thing about this piece is how the artists have managed to reimagine such a well-known activity that most people experience into something new, which shows their artistic sensibilities coming out in their want to allow their audience to experience a sensation that they’ve been familiar with in a new way, using computational art instead of traditional art.

The algorithms that the artists seem to have used include “tailor made control panel software”. This is through the open source programming language, Processing. They also have used programs like Arduino, as well as using different units in order to control different areas of the piece, such as the control of the music, the control of the light beams, and the control of the LED strips.

]]>
https://courses.ideate.cmu.edu/15-104/f2019/2019/11/01/caroline-song-looking-outwards-10-computer-music/feed/ 0
Caroline Song – Looking Outwards-11 https://courses.ideate.cmu.edu/15-104/f2019/2019/10/28/caroline-song-looking-outwards-10/ https://courses.ideate.cmu.edu/15-104/f2019/2019/10/28/caroline-song-looking-outwards-10/#respond Mon, 28 Oct 2019 14:57:48 +0000 https://courses.ideate.cmu.edu/15-104/f2019/?p=49944 Continue reading "Caroline Song – Looking Outwards-11"]]>
Examples of LittleBits pieces

LittleBits was created by Ayah Bdeir in 2010. Specifically, littleBits is a collection of modular electronics that snap together in order to make prototyping more efficient and easy. I admire this project because, being able to work with littleBits in one of my studio classes, I greatly appreciated the ease of being able to create and mimic low-fidelity electronic devices. Not having much knowledge on how certain devices work, I also enjoyed how I did not have to know much in order to work with littleBits, and I was also able to learn more about the general pattern of certain electronic devices along the way, using littleBits. It was a way of learning that is both hands-on and simplified enough as to not overwhelm the user.

Bdeir graduated from the American University of Beirut in 2004 in Computer and Communications Engineering, as well as Sociology. Her work has appeared in The New Museum, the Royal College of Art, and has taught at both NYU and Parsons. She is both an interactive artist and an engineer, founding littleBits, which joined MoMA’s permanent collection and has been partnered with industry companies like Disney, Pearson, and the New York Department of Education. Bdeir has led many initiatives to get young girls involved in STEM, partnering with the White House, and companies such as Disney, in order to do so. While she is originally from Beirut, she now resides in New York City.

]]>
https://courses.ideate.cmu.edu/15-104/f2019/2019/10/28/caroline-song-looking-outwards-10/feed/ 0
Caroline Song – Project 09 – Computational Portrait https://courses.ideate.cmu.edu/15-104/f2019/2019/10/24/caroline-song-project-09-computational-portrait/ https://courses.ideate.cmu.edu/15-104/f2019/2019/10/24/caroline-song-project-09-computational-portrait/#respond Fri, 25 Oct 2019 02:18:23 +0000 https://courses.ideate.cmu.edu/15-104/f2019/?p=49243 Continue reading "Caroline Song – Project 09 – Computational Portrait"]]>

sketch

//Caroline Song
//chsong@andrew.cmu.edu
//Section E
//Project 09

var imageUnderneath;
var imageColor;
var constrainX;
var constrainY;

function preload(){
    //preload image
    var myImageURL = "https://i.imgur.com/SHu7RYA.jpg";
    imageUnderneath = loadImage(myImageURL);
}

function setup(){
    createCanvas(450, 450);
    background(0);
    imageUnderneath.loadPixels();
    frameRate(1000);
}

function draw(){
    var rectX = random(width); //rectangles are placed randomly along width of canvas
    var rectY = random(height); //rectangles are placed randomly along height of canvas
    var rectSize = 10; //size of rectangle
    var ellipseSize = 10; //size of ellipse

    //constrain rectangles to canvas size
    constrainX = constrain(floor(rectX), 0, width);
    constrainY = constrain(floor(rectY), 0, height);
    
    //get and fill colors according to picture underneath
    imageColor = imageUnderneath.get(constrainX, constrainY);
    noStroke();
    fill(imageColor);

    //ellipses are drawn instead of rectangles when key 'e' is pressed
    if(key == 'e' || key == 'E'){
        ellipse(constrainX, constrainY, ellipseSize);
    } else{
        rect(constrainX, constrainY, rectSize, rectSize);
    }
}

This project was very interesting, however, I didn’t know how to approach it at first. I wanted to have some sort of interactive element to my self-portrait project. In my final piece, I chose to switch the shapes that the code draws in, from rectangles to ellipses.

Final project after 30 seconds
Final project after 3 min
Original picture

]]>
https://courses.ideate.cmu.edu/15-104/f2019/2019/10/24/caroline-song-project-09-computational-portrait/feed/ 0
Caroline Song-Looking Outwards-09 https://courses.ideate.cmu.edu/15-104/f2019/2019/10/21/caroline-song-looking-outwards-09/ https://courses.ideate.cmu.edu/15-104/f2019/2019/10/21/caroline-song-looking-outwards-09/#respond Tue, 22 Oct 2019 02:20:34 +0000 https://courses.ideate.cmu.edu/15-104/f2019/?p=48821 Continue reading "Caroline Song-Looking Outwards-09"]]>

For this Looking Outwards post, I decided to look at Monica Chang’s Looking Outwards 03. In this Looking Outwards, she studies programmable bio-composites called Aguahoja, created by Neri Oxman and MIT. Using the most available materials that can be found on Earth currently, they create organic art that moves away from using plastic and other materials that are toxic to the environment.

Aguahoja I Pavilion, standing at 5 meters tall

I agree with her statement on why it is intriguing, the fact that this art is being sustainable in its resources shows the possibility in duality between conserving the resources we currently have in the ecosystem, while not halting our movement towards further modernizing the world.

Furthermore, I also think the statement that they are making in redefining art is strong. When thinking of art, what comes to mind is a lot of traditional materials, such as paint, clay, wire, etc. All of these materials (especially thinking of different types of paint) are also toxic to the Earth. However, using materials that are organic and that the environment has plenty of, traditional art is being challenged and being evolved as Earth does as well.

]]>
https://courses.ideate.cmu.edu/15-104/f2019/2019/10/21/caroline-song-looking-outwards-09/feed/ 0
Caroline Song-Looking Outwards-08 https://courses.ideate.cmu.edu/15-104/f2019/2019/10/17/caroline-song-looking-outwards-08/ https://courses.ideate.cmu.edu/15-104/f2019/2019/10/17/caroline-song-looking-outwards-08/#respond Thu, 17 Oct 2019 22:49:48 +0000 https://courses.ideate.cmu.edu/15-104/f2019/?p=48563 Continue reading "Caroline Song-Looking Outwards-08"]]>

Eyeo 2015 – Chris Sugrue from Eyeo Festival on Vimeo.

For this post, I decided to look at Chris Sugrue, who is currently based in Paris, France, teaching at Parsons Paris. She describes herself as “an artist, developer, and programmer” who creates installations which are interactive. Sugrue seems to be particularly passionate about where technology can meet art, a lot of her projects having to do with exciting storytelling, eye-tracking, artificial life, and optical illusions. She has a Masters in Fine Arts and Technology from Parsons.

One of the projects of Sugrue’s that I most admire is her piece: Delicate Boundaries, the video I have embedded below. Bugs made of light crawl on the digital screen, and when putting the user’s hand on the screen, the bugs move towards the hand and eventually cross over from the screen onto the hand. This installation dealt with both digital and physical space and the crossover that objects can have in between, which is the idea I most admire. This idea is particularly interesting for me because the interaction between digital and physical space is what I have currently been studying in design and the cross over that can happen between objects going one virtual space to a physical space is an idea that I had not considered before, and yet is intriguing to think about and explore.

The biggest strategy that Sugrue seems to use in her presentation is how she shows her decision making process. She shows the audience both her installations, and all the decisions and choices she made in order to create it. Sugrue answers all the questions of “why” she chose to go in this direction with her installation, which allows the audience to be further convinced in supporting her installation because they understand the intent she had in her decision-making. Using those observations, I see how important it is to explain your choices in a design and being able to communicate that with the audience will help them be swayed to support your idea.

]]>
https://courses.ideate.cmu.edu/15-104/f2019/2019/10/17/caroline-song-looking-outwards-08/feed/ 0