Siwei Xie – Project 10 – Sonic Sketch

sketch

//Siwei Xie
//Section B
//sxie1@andrew.cmu.edu
//Project-10-sonic sketch

var img;
var dog;


function preload() {
    //load "pets" image from imgur
    img = loadImage("https://i.imgur.com/iqyeVWW.png");
    
    //load sound tracks
    // dog = loadSound("dog.wav");
    // cat = loadSound("cat.wav");
    // bird = loadSound("bird.wav");
    // fish = loadSound("fish.wav");
    dog = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/dog.wav");
    cat = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/cat.wav");
    bird = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/bird-1.wav");
    fish = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/fish.wav");
}

function setup() {
    createCanvas(466, 350);
}

function draw(){
    background(100);
    
    //scale the image according to canvas size
    image(img, 1, 1, 
        img.width * 0.4, img.height * 0.4);
}

function mousePressed(){
    //play "dog" track when clicking on upper left area
    if(mouseX < 233 & mouseY < 175){
        dog.play();
    }
    //play "cat" track when clicking on upper right area
    if(mouseX > 233 & mouseY < 175){
        cat.play();
    }
    //play "bird" track when clicking on lower left area
    if(mouseX < 233 & mouseY > 175){
        　bird.play();
    }
    //play "fish" track when clicking on lower right area
    if(mouseX > 233 & mouseY > 175){
        fish.play();
    }
}

I used 4 sound tracks for this project and created a “pet zoo.” The tracks contain dog barks, cat meows, fish bubbling and bird singing. You can play different sound tracks by clicking on different section of the image. I had fun creating this project because it enables me to insert sounds into post and make it interesting.