Month: November 2019

Shariq M. Shah – Looking Outwards 10 – Sound Art

The Cycling wheel project, by Hong Kong based practice Keith Lam, Seth Hon and Alex Lai, takes the concept of Marcel Duchamp’s famed bicycle wheel, in his readymade explorations, and transforms it into a generative light and sound instrument. In order to turn it into this interactive performance art piece, it uses Processing to create a specially made control panel configuration that functions on three levels: controlling music, movement, and LED lights. The processes take the movement of the bicycle wheel and uses it to generate a variety of sounds that are augmented by the control panel computation. The result is a magical interplay of light, music, art, and computation that makes for quite a spectacular interactive art piece. It makes me think of ways that other physical movements can be translated into dynamic soundscapes, a concept similar to what I tried to do for this week’s project. It is also interesting to consider how a variety of different sounds can be layered to produce an immersive soundscape experience, as this orchestral performance demonstrates. 

 

https://www.creativeapplications.net/processing/cycling-wheel-the-orchestra-reimagining-marcels-bicycle-wheel-as-a-lightsound-instrument/

Xu Xu – Project 10 – Sonic Sketch

sketch

//Claire Xu
//xux1@andrew.cmu.edu
//section B
//Project 10
var playerIMG;
var acousticBreeze;
var pianoMoment;
var goingHigher;
var retroSoul;

function preload(){
    var iphoneIMG = "https://i.imgur.com/KeDOgRs.jpg"
    playerIMG = loadImage(iphoneIMG);

    //load 4 tracks
    acousticBreeze = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/bensound-acousticbreeze.wav");
    pianoMoment = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/bensound-pianomoment.wav");
    goingHigher = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/bensound-goinghigher.wav");
    retroSoul = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/bensound-retrosoul.wav");
}

function setup(){
    createCanvas(450,450);
    background(255);
}

function soundSetup(){
    //volume for tracks
    acousticBreeze.setVolume(2);
    pianoMoment.setVolume(2);
    goingHigher.setVolume(2);
    retroSoul.setVolume(2);
}

function draw(){
    image(playerIMG, 0,0);
}

function mousePressed(){

    if (mouseX >= 150 & mouseX <= 350){
    //play acousticBreeze when it's pressed
        if (mouseY > 270 & mouseY < 290){
            //play acousticBreeze
            acousticBreeze.play();
            //pause others
            pianoMoment.pause();
            goingHigher.pause();
            retroSoul.pause();
        }
    //play pianoMoment when it's pressed
        if (mouseY > 290 & mouseY < 310){
            //play pianoMoment
            pianoMoment.play();
            //pause others
            acousticBreeze.pause();
            goingHigher.pause();
            retroSoul.pause();
        }
    //play goingHigher when it's pressed
        if (mouseY > 310 & mouseY < 330){
            //play goingHigher
            goingHigher.play();
            //pause others
            acousticBreeze.pause();
            pianoMoment.pause();
            retroSoul.pause();
        }
    //play retroSoul when it's pressed
        if (mouseY > 330 & mouseY < 350){
            //play retroSoul
            retroSoul.play();
            //pause others
            acousticBreeze.pause();
            pianoMoment.pause();
            goingHigher.pause();
        }
    }

    if (mouseX >= 155 & mouseX <= 165 & mouseY >= 385 & mouseY <= 395){
        //pause everything
        acousticBreeze.pause();
        pianoMoment.pause();
        goingHigher.pause();
        retroSoul.pause();
    }
}

For this project I wanted to do a “music app” design, and there are four songs to choose from the album, which can be paused and played by clicking the song titles or the pause button. I drew the interface from scratch in adobe illustrator and photoshop, and wrote the song names in the interface. This was a fun project, but implementing the soundtracks in the file was hard. (The soundtracks are actually only 1 minute long due to the file upload restriction)

Jasmine Lee – Project 10 – Sonic Sketch

sonicsketch

//Jasmine Lee
//jasmine4@andrew.cmu.edu
//Section C
//Project-10 (Sonic Sketch)

var mySnd1; //variables to hold sound (cauldron, coins, pumpkin)
var mySnd2;
var mySnd3;
var noteC; //variables to hold sound (colored flasks)
var noteD;
var noteE;
var noteF;
var noteG;
var noteA;
var noteB;
var spiderB; //control spider's movement
var bounce; //control bubbles' movement
var bounce2;
var jingle; //control coins' movement
var bounce3;


function preload() {
    // call loadImage() and loadSound() for all media files here
    mySnd1 = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/bubble.wav");
    mySnd2 = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/coins.wav");
    mySnd3 = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/surprise.wav");
    noteC = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/glockenspielC.wav")
    noteD = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/glockenspielD.wav")
    noteE = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/glockenspielE.wav")
    noteF = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/glockenspielF.wav")
    noteG = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/glockenspielG.wav")
    noteA = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/glockenspielA.wav")
    noteB = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/glockenspielB.wav")
    mySnd1.setVolume(0.5);
    mySnd2.setVolume(0.5);
    mySnd3.setVolume(0.5);
    noteC.setVolume(0.5);
    noteD.setVolume(0.5);
    noteE.setVolume(0.5);
    noteF.setVolume(0.5);
    noteG.setVolume(0.5);
    noteA.setVolume(0.5);
    noteB.setVolume(0.5);
}

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

function mousePressed() {
    //red-flask-sound
    if (mouseX > 77 & mouseX < 107 && mouseY > 270 & mouseY < 350){
        noteC.play();
    }

    //orange-flask-sound
    if (mouseX > 147 & mouseX < 177 && mouseY > 270 & mouseY < 350){
        noteD.play();
    }

    //yellow-flask-sound
    if (mouseX > 217 & mouseX < 247 && mouseY > 270 & mouseY < 350){
        noteE.play();
    }

    //green-flask-sound
    if (mouseX > 287 & mouseX < 317 && mouseY > 270 & mouseY < 350){
        noteF.play();
    }

    //blue-flask-sound
    if (mouseX > 357 & mouseX < 387 && mouseY > 270 & mouseY < 350){
        noteG.play();
    }

    //purple-flask-sound
    if (mouseX > 427 & mouseX < 457 && mouseY > 270 & mouseY < 350){
        noteA.play();
    }

    //pink-flask-sound
    if (mouseX > 497 & mouseX < 527 && mouseY > 270 & mouseY < 350){
        noteB.play();
    }

    //cauldron-sound
    if (mouseX > 100 & mouseX < 200 && mouseY > 420 & mouseY < 500){
        mySnd1.play();
    }
    //coins-sound
    if (mouseX > 245 & mouseX < 380 && mouseY > 455 & mouseY < 500){
        mySnd2.play();
    }

    //pumpkin-sound
    if (mouseX > 400 & mouseX < 515 && mouseY > 405 & mouseY < 500){
        mySnd3.play();
    }
} 


function draw() {
    // you can replace any of this with your own code:
    background(109, 142, 143);
    angleMode(DEGREES);
    drawings();
    }

function drawings() {
    noStroke();

    //picture frames
    if (second() % 3 == 0) {
        spiderB = 25;
    } else {
        spiderB = -15;
    }

    push();
    translate(120, 50);
    strokeWeight(8);
    stroke(46, 45, 41);
    fill(255, 255, 255, 100); //black frames
    rect(0, 0, 160, 190);
    rect(300, 120, 70, 70);
    stroke(189, 182, 157); //beige frame
    rect(220, -10, 80, 80);
    noStroke();

    //crack in beige frame
    if (second() % 2 == 0) {
        fill(199, 201, 32, 150);
    } else {
        fill(199, 201, 32, 0);
    }
    triangle(296, 3, 296, -5, 250, 50);

    //crack in black frame
    if (second() % 6 == 0) {
        fill(133, 209, 237, 0);
    } else {
        fill(133, 209, 237, 150);
    }
    triangle(366, 124, 366, 134, 310, 180);
    pop();

    push();
    translate(130, 57);
    strokeWeight(4); //cobwebs
    stroke(200, 200, 200);
    line(0, 0, 0, 40);
    line(10, 0, 10, 30);
    line(30, 0, 30, 70 + spiderB);
    line(70, 0, 70, 7);
    line(80, 0, 80, 20);
    line(120, 0, 120, 35);
    line(130, 0, 130, 5);
    line(140, 0, 140, 90);
    noStroke();
    fill(46, 45, 41);
    ellipse(30, 70 + spiderB, 7, 10);
    pop();


    //top-shelf left bracket
    push();
    translate(60, 350);
    fill(46, 45, 41);
    rect(0, 0, 15, 60);
    pop();

    //top-shelf right bracket
    push();
    translate(525, 350);
    fill(46, 45, 41);
    rect(0, 0, 15, 60);
    pop();

    //top-shelf
    push();
    translate(50, 350);
    fill(189, 182, 157);
    rect(0, 0, 500, 15);
    pop();

    //bottom-shelf left bracket
    push();
    translate(60, 500);
    fill(46, 45, 41);
    rect(0, 0, 15, 60);
    pop();

    //bottom-shelf right bracket
    push();
    translate(525, 500);
    fill(46, 45, 41);
    rect(0, 0, 15, 60);
    pop();

    //bottom-shelf
    push();
    translate(50, 500);
    fill(189, 182, 157);
    rect(0, 0, 500, 15);
    pop();

    //flask-1
    push();
    translate(77, 270);
    fill(255, 255, 255, 100);
    rect(0, 0, 30, 80);
    rect(-10, 0, 50, 5);
    fill(204, 18, 18, 150); //red
    rect(2, 10, 26, 70);
    pop();

    //flask-2
    push();
    translate(147, 270);
    fill(255, 255, 255, 100);
    rect(0, 0, 30, 80);
    rect(-10, 0, 50, 5);
    fill(184, 133, 24, 150); //orange
    rect(2, 15, 26, 65);
    pop();

    //flask-3
    push();
    translate(217, 270);
    fill(255, 255, 255, 100);
    rect(0, 0, 30, 80);
    rect(-10, 0, 50, 5);
    fill(199, 201, 32, 150); //yellow
    rect(2, 20, 26, 60);
    pop();

    //flask-4
    push();
    translate(287, 270);
    fill(255, 255, 255, 100);
    rect(0, 0, 30, 80);
    rect(-10, 0, 50, 5);
    fill(87, 163, 69, 150); //green
    rect(2, 25, 26, 55);
    pop();

    //flask-5
    push();
    translate(357, 270);
    fill(255, 255, 255, 100);
    rect(0, 0, 30, 80);
    rect(-10, 0, 50, 5);
    fill(52, 98, 133, 150); //blue
    rect(2, 30, 26, 50);
    pop();

    //flask-6
    push();
    translate(427, 270);
    fill(255, 255, 255, 100);
    rect(0, 0, 30, 80);
    rect(-10, 0, 50, 5);
    fill(102, 64, 168, 150); //purple
    rect(2, 35, 26, 45);
    pop();

    //flask-7
    push();
    translate(497, 270);
    fill(255, 255, 255, 100);
    rect(0, 0, 30, 80);
    rect(-10, 0, 50, 5);
    fill(212, 125, 196, 150); //pink
    rect(2, 40, 26, 40);
    pop();

    //cauldron
    if (second() % 2 == 0) { //controls bounce of 1st and 4th bubble
        bounce = -2;
    } else {
        bounce = 2;
    }

    if (second() % 2 == 0) { //controls bounce of 2nd and 3rd bubble
        bounce2 = 3;
    } else {
        bounce2 = -3;
    }

    push();
    translate(150, 460);
    fill(46, 45, 41); //cauldron
    ellipse(0, 0, 100, 80);
    ellipse(0, -30, 100, 20);
    fill(89, 255, 122, 150); //bubbles
    ellipse(0, -30, 80, 10); 
    ellipse(-15, -30 + bounce2, 25, 25);
    ellipse(15, -40 + bounce, 20, 20);
    ellipse(5, -60 + bounce, 10, 10);
    ellipse(25, -75 + bounce2, 7, 7);
    pop();

    //coins
    if (second() % 2 == 0) { //angle at which the coins rotate
        jingle = -2;
    } else {
        jingle = 2;
    }

    if (second() % 2 == 0) { //controls bounce of top coin
        bounce3 = 6;
    } else {
        bounce3 = -6;
    }

    push();
    translate(260, 497);
    rotate(jingle);
    fill(156, 140, 39); //coin-shadows (4th row)
    ellipse(0, 0, 30, 10);
    ellipse(35, 0 + bounce, 30 , 10);
    ellipse(70, 0, 30, 10);
    ellipse(105, 0, 30, 10);
    fill(201, 184, 68); //coins (4th row)
    ellipse(0, -3, 30, 10);
    ellipse(35, -3 + bounce, 30, 10);
    ellipse(70, -3, 30, 10);
    ellipse(105, -3, 30, 10);

    fill(156, 140, 39); //coin-shadows (3rd row)
    ellipse(17, -10 + bounce, 30, 10);
    ellipse(52, -10, 30, 10);
    ellipse(87, -10 + bounce, 30, 10);
    fill(201, 184, 68); //coins (3rd row)
    ellipse(17, -13 + bounce, 30, 10);
    ellipse(52, -13, 30, 10);
    ellipse(87, -13 + bounce, 30, 10);

    fill(156, 140, 39); //coin-shadows (2nd row)
    ellipse(35, -20 + bounce2, 30, 10);
    ellipse(70, -20 + bounce2, 30, 10);
    fill(201, 184, 68); //coins (2nd row)
    ellipse(35, -23 + bounce2, 30, 10);
    ellipse(70, -23 + bounce2, 30, 10);

    fill(156, 140, 39); //coin-shadows (1st row)
    ellipse(52, -30 + bounce3, 30, 10);
    fill(201, 184, 68); //coins (1st row)
    ellipse(52, -33 + bounce3, 30, 10);
    pop();

    //pumpkin
    push();
    translate(460, 460);
    fill(83, 105, 88);
    rect(-5, -55, 15, 30);
    fill(135, 100, 26) //pumpkin-shadow
    ellipse(10, 0, 90, 80);
    ellipse(-10, 0, 90, 80);
    fill(184, 133, 24); //pumpkin
    ellipse(0, 0, 90, 80);
    fill(135, 100, 26, 130) //pumpkin-shadow front
    ellipse(0, 0, 40, 80); 

    //changes pumpkin face color
    if (second() % 2 == 0) {
        fill(0, 0, 0, 175);
    }else {
        fill(250, 227, 72, 175);
    }

    ellipse(-20, -5, 10, 20);
    ellipse(20, -5, 10, 20);
    ellipse(0, 15, 15, 15);
    pop();
}

The sounds included in my project are bubbling sounds, coins jingling, and a surprised noise. These can be played by clicking on the cauldron, coins, and pumpkins, respectively. The colored flasks on the top shelf can also be played, and they sound out glockenspiel notes C, D, E, F, G, A, B (from left to right). I wanted to create a project which could play notes once you clicked in different areas, and I decided to make it colorful. The flasks were the first things I designed, and I thought a Halloween motif would work for fitting in the other sounds.

Fanjie Mike Jin – Project 10 – Sonic Sketch

sketch1

// Fanjie Mike Jin
// Section C
//fjin@andrew.cmu.edu
//Project 10

//set the count for the four melodies
var voiceplaying = 1;
var pianoPlaying = 1;
var jazzPlaying = 1;
var electronicPlaying = 1;

function preload() {
//preloads the images
    var imageUrl = "https://i.imgur.com/DcInSlj.jpg";
    pic = loadImage(imageUrl);
//preloads the different types of sound
    jazz = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/jazz.wav");
    voice = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/voice.wav");
    piano = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/piano.wav");
    electronic = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/electronic.wav");
//set the volume of the music track
    jazz.setVolume(1);
    voice.setVolume(1);
    piano.setVolume(1);
    electronic.setVolume(1);
}

function setup() {
//set up the background image for the music choosing
    createCanvas(400, 400);
    background(0);
    image(pic, 0, 0);
}

function mousePressed(){
// when mouse is pressed at the designated area, the voice melody would be played
    if (mouseX > width / 2 & mouseY > height / 2 && mouseX < width && mouseY < height){
//the music will be turned off once it has been clicked the second time 
        voiceplaying = voiceplaying + 1;
        if (voiceplaying % 2 == 0){
            voice.play();
        } else {
            voice.pause();
        }
    }
    
// when mouse is pressed at the designated area, the electronic melody would be played  
    if (mouseX < width / 2 & mouseY > height / 2 && mouseY < height){
        electronicPlaying = electronicPlaying + 1;
//the music will be turned off once it has been clicked the second time 
        if (electronicPlaying % 2 == 0){
            electronic.play();
        } else {
            electronic.pause();
        }
    }

// when mouse is pressed at the designated area, the piano melody would be played
    if (mouseX > width / 2 & mouseY < height / 2 && mouseX < width){
        pianoPlaying = pianoPlaying + 1;
//the music will be turned off once it has been clicked the second time       
        if (pianoPlaying % 2 == 0){
            piano.play();
        } else {
            piano.pause();
        }
    }

// when mouse is pressed at the designated area, the jazz melody would be played
    if (mouseX < width / 2 & mouseY < height / 2){
        jazzPlaying = jazzPlaying + 1;
//the music will be turned off once it has been clicked the second time 
        if (jazzPlaying % 2 == 0){
            jazz.play();
        } else {
            jazz.pause();
        }
    }
}

Audio Player Audio Player Audio Player Audio Player

In this project, I aim to create an interactive program that plays four different types of music genre. By clicking on the icon, you are able to choose to turn on and off each type of music. The most interesting condition is when you turn on two or three type of music together, when they are playing simultaneously, it creates a surreal and yet fun melody.

Margot Gersing – Looking Outwards- 10

Weather Thingy example

This week I looked at a project called Weather Thingy by Adrien Kaeser. This project that uses a sound controller that takes weather and climate events to modify the musical instrument and the sound it makes.  

controller connected to the keyboard to play the music

Part of why I liked this project so much it is works in real time. It has sensors that collect data from the climate it is in and the controller interprets the data to create different sounds. The machine has a weather data collection station which includes a rain gauge, a wind vane and a anemometer. It also has a brightness sensor. The user then uses the interface to choose what sensor he is working with and uses a potentiometer to modify the data and create different sounds.

interface collecting data from the wind vane

I think this project is so interesting because of its presence in real time and its ability to act as a diary. This device can also store data from a specific time and then you can use that pre-recorded data later on. This way it is almost like a window to a certain time and what was going on then. I can see the potential of using this to see how climate change has affected the same spot over time. I can almost imagine a soundscape being made in one spot and then in the same spot 20 years later and see how different it is.

Xiaoyu Kang – Project 10 – Sonic Sketch

sketch

//Xiaoyu Kang
//xkang@andrew.cmu.edu
//Section B
//Project-10

var rainThunder;
var waterSound;
var catMeow;
var catGroom;
function preload() {
    rainThunder = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/rain.wav");
    waterSound = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/water-1.wav");
    catMeow = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/catmeow.wav");
    catGroom = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/catgroom.wav")
}

function setup() {

    createCanvas(400, 300);
    useSound();
}


function soundSetup(){
    rainThunder.setVolume(1);
    waterSound.setVolume(1);
    catMeow.setVolume(2);
    catGroom.setVolume(2);
}

function draw() {
    background(200);
    noStroke();
    //wall
    fill(250, 230, 230);
    rect(0, 0, 400, 200);
    //floor
    fill(173, 144, 115);
    rect(0, 200, 400, 100);
    //window
    fill(255);
    rect(100, 20, 200, 150);
    fill(26, 64, 111);
    rect(110, 30, 180, 130);
    //cloud
    fill(150);
    ellipse(165, 80, 30, 30);
    ellipse(190, 60, 50, 50);
    ellipse(230, 70, 40, 40);
    ellipse(205, 85, 30, 30);
    //rain
    fill("blue");
    ellipse(170, 130, 10, 10);
    ellipse(220, 140, 10, 10);
    ellipse(240, 100, 10, 10);
    ellipse(190, 120, 10, 10);
    //cat
    fill(255);
    ellipse(350, 220, 30, 30);
    ellipse(360, 260, 50, 60);
    ellipse(350, 282, 50, 10);
    ellipse(380, 280, 70, 5);
    ellipse(335, 222, 8, 8);
    triangle(353, 195, 348, 210, 362, 212);
    triangle(343, 195, 340, 210, 354, 210);
    fill(50);
    ellipse(345, 215, 5, 5);
    //cup
    fill(200);
    rect(150, 240, 20, 35);
    ellipse(160, 275, 20, 10);
    fill(150, 170, 255);
    ellipse(160, 240, 20, 10);

    }

function mousePressed(){
    //sound of rain when touch the cloud
    if (mouseX >= 110 & mouseX <= 290 && mouseY >= 30 && mouseY <= 160){
        rainThunder.play();
    }
    //sound of water when touch the cup
    if (mouseX >= 150 & mouseX <= 170 && mouseY >= 240 && mouseY <= 275){
        waterSound.play();
    }
    //sound of cat meowing when touch the head of the cat
    if (mouseX >= 320 & mouseX <= 380 && mouseY >= 190 && mouseY <= 250){
        catMeow.play();
    }
    //sound of cat grooming when touch the body of the cat
    if (mouseX >= 335 & mouseX <= 385 && mouseY >= 230 && mouseY <= 290){
        catGroom.play();
    }
}

For this image, I created an image of a cat inside a house on a rainy day. I think it would be interesting if different sounds can be activated when the user clicks on different objects. If the user clicked on the cloud, the sound of a thunder storm would start and goes on for two minutes. If clicks on the cup a sound of water would be activated. And clicking the head or the body of the cat would activate two different sounds.

Crystal Xue-LookingOutwards-10

Christine Sun Kim, deaf since birth, explores her subjective experiences with sound in her work. She investigates the operations o sound and various aspects of deaf culture in her performances, videos, and drawings. She uses a lot of elements like body language, ASL(Amerian Sign Language) and so as her interpretation to expand the traditional scope of communication.

This particular project shown above is called “game of skill 2.0” is displayed in MoMA PS1. Audiences are invited to listen to a reading of a text about the future. Pathways are created in concert with the game’s console, causes the device to emit sound at a pace proportional to the participant’s movement. The physical scrubbing process is the direct interaction with the sound.

Charmaine Qiu – Project 10 – Sonic Sketch


sketch

In this project, I was able to incorporate new knowledge of importing sound and oscillations into my former assignment. I had fun looking for edm music sources online and creating an interactive project that people could play with.

// Charmaine Qiu
// charmaiq@andrew.cmu.edu
// section E
//Project - 10 - Sonic Sketch


var angle = 0
var b = 0
var bgmusic;
var heySound;
var beat;

function preload() {
    //preload the audios and loop the background music
    beat = loadSound('https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/beat.wav');
    heySound = loadSound('https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/hey.wav');
    bgmusic = loadSound('https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/bgmusic.wav');
    bgmusic.loop();
}

function setup() {
    createCanvas(400, 400);
    //createDiv("p5.dom.js library is loaded.");
    //======== call the following to use sound =========
    useSound();
}

function soundSetup() { // setup for audio generation
    //set the volume for audio and play background music
    bgmusic.setVolume(1);
    bgmusic.play();
    heySound.setVolume(1);
    beat.setVolume(2);
    //setup for oscillation
    osc = new p5.TriOsc();
    osc.freq(500);
    osc.amp(1);
    osc.start();
}

function draw() {
    //set the frequency of oscillation according to placement of mouseX
    osc.freq(mouseX);
    osc.amp();
    //when the mouse is pressed, "hey" plays
    if (mouseIsPressed){
        heySound.play();
    }

   //graphics created from precious project
    fill(b);
    //randomizing the color in greyscale
    b = random (0, 255);
    strokeWeight(0);
    rectMode(CENTER);
    push();
    //square that follows the mouse
    translate(mouseX, mouseY);
    background(0);
    rotate(radians(angle));
    rect(0, 0, 50, 50);
    pop();
    //angle rotates
    angle += 5;

    //rectangle outlines in the center
    noFill();
    stroke(255);
    strokeWeight(5);
    push();
    translate(width / 2, height / 2);
    rect(0, 0, mouseX, mouseY);
    pop();

    stroke(b);
    strokeWeight(1);
    rect(width * 0.5, height * 0.5, mouseY, mouseX);

   //dancing lines in the center
    stroke(255);
    strokeWeight(1);
    line(width / 2 - 40, height / 2, width / 2 - 40, mouseY + 50);
    line(width / 2 - 30, height / 2, width / 2 - 30, mouseY);
    line(width / 2 - 20, height / 2, width / 2 - 20, mouseY - 20);
    line(width / 2 - 10, height / 2, width / 2 - 10, mouseY + 40);
    line(width / 2, height / 2, width / 2, mouseY);
    line(width / 2 + 10, height / 2, width / 2 + 10, mouseY + 60);
    line(width / 2 + 20, height / 2, width / 2 + 20, mouseY + 10);
    line(width / 2 + 30, height / 2, width / 2 + 30, mouseY);
    line(width / 2 + 40, height / 2, width / 2 + 40, mouseY - 30);

   //When the mouse move to the left side of the canvas
    if (mouseX <= width / 2){
        //squares that rotates around the mouse
        push();
        translate(mouseX - 50, mouseY - 50);
        rotate(radians(angle));
        rectMode(CORNER);
        rect(20, 20, 20, 20);
        pop();
        angle = angle + 0.5;

        push();
        translate(mouseX + 50, mouseY + 50);
        rotate(radians(angle));
        rect(0, 0, 10, 10);
        pop();
        angle = angle - 0.5

        //text appears
        textSize(15);
        text('WooHooo!!!', 20, 90);
        textSize(30);
        text('哦耶!', 280, 180);


      } else { //When the mouse move to the right side of the canvas
        fill(0);
        strokeWeight();
        push();
        translate(mouseX, mouseY);
        rotate(radians(angle));
        rectMode(CENTER);
        rect(0, 0, 30, 30);
        pop();
        angle = angle + 5

        //text appears
        textSize(20);
        fill(255);
        text('야호!', 280, 50);
        textSize(25);
        text('ヤッホ〜ー', 70, 350);
       }
}
//when the key "b" is pressed, a beat sound is played
function keyPressed(){
    if(key == "b"){
        beat.play();
    }
}

Sean Meng-Project 10-Interactive Sonic Sketch

hmeng-project-10

//Sean Meng
//hmeng@andrew.cmu.edu
//Section C
//Project-10-Interactive Sonic Sketches

var mySoundA;
var mySoundB;

function preload() {
    mySoundA = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/mySoundA.wav");
    mySoundA.setVolume(2);

    mySoundB = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/mySoundB.wav");
    mySoundB.setVolume(2);

    mySoundC = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/mySoundC.wav");
    mySoundC.setVolume(2);

    mySoundD = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/mySoundD.wav");
}

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

}
function draw() {
    var bSize = 16;

    background(255, 201, 54);

//draw the play station
    noStroke();
    fill(255);
//the body of the play station    
    rect(150, 100, 180, 270);
    
    rect(150, 90, 180, 10);
    rect(150, 370, 180, 10);
    rect(140, 100, 10, 270);
    rect(330, 100, 10, 270);
    
    ellipse(150, 100, 20, 20);
    ellipse(330, 100, 20, 20);
    ellipse(150, 370, 20, 20);
    ellipse(330, 370, 20, 20);

//the screen 
    fill(150);
    rect(160, 110, 160, 110);
    ellipse(160, 110, 16, 16);
    ellipse(320, 110, 16, 16);
    ellipse(160, 220, 16, 16);
    ellipse(320, 220, 16, 16);

    rect(160, 102, 160, 8);
    rect(160, 220, 160, 8);
    rect(152, 110, 8, 110);
    rect(320, 110, 8, 110);

    fill(30)
    rect(160, 110, 160, 110)

//Left button
    fill(0);
    rect(160, 280, 50, 10);
    rect(180, 260, 10, 50);

//Right button A
    fill(255, 0, 0);
    ellipse(290, 270, bSize);
//Right button B
    ellipse(290, 300, bSize);  
//Right button C
    ellipse(275, 285, bSize);
//Right button D
    ellipse(305, 285, bSize);    
}

function mousePressed() {
//fill the screen blue when button is clicked
    fill(138, 218, 255);
    rect(160, 110, 160, 110);

//play soundA when buttonA is clicked
    if(mouseX > 282 & mouseX < 298 && mouseY > 262 && mouseY < 278){
        mySoundA.play();
    }
//play soundB when buttonB is clicked    
    if(mouseX > 282 & mouseX < 298 && mouseY > 292 && mouseY < 308){
        mySoundB.play();
    }
//play soundC when buttonC is clicked
    if(mouseX > 267 & mouseX < 283 && mouseY > 277 && mouseY < 293){
        mySoundC.play();
    }
//play soundD when buttonD is clicked
    if(mouseX > 297 & mouseX < 313 && mouseY > 277 && mouseY < 293){
        mySoundD.play();
    }    
}

Audio Player Audio Player Audio Player Audio Player

In this project, I explored the sound upload in p5js and mimicked the Nintendo Family Computer with corresponded game sound effects.

Cathy Dong-Looking Outwards-10

Apparatum

“Apparatum,” commissioned by Adam Mickiewicz Institute, is a musical and graphical installation inspired by the Polish Radio Experimental Studio, which is one of the first studios to produce electroacoustic music. It is the fruit of digital interface meeting analog sound. The sound is generated based on magnetic tape and optical components. Boguslaw Schaeffer comes up with his personal visual language of symbols and cues and composes “symphony—Electronic Music” for the sound engineers. With two 2-track loops and three 1-shot linear tape samplers, they obtain noise and basic tones. They utilize analog optical generators based on spinning discs with graphical patterns.