Toetsen maken geluid? opdracht Musical keyboard

Deze opdracht hebben we lekker rustig aangepakt en hebben we samen nagedacht, willen we een volledige meme keyboard of ook een normale keyboard erin verwerkt. Uiteindelijk hebben we gekozen voor het laatste, de “normale” keys zijn meme geluiden (ook te besturen met a t/m h), de sharp keys zijn piano geluiden (te besturen met 1 t/m 7) wij vinden deze piano erg goed en leuk gelukt.

De opdracht: Musical Keyboard

Het eind product!

Het eindproduct met code!

De writing prompt:

Ik persoonlijk heb niet een favourite muziek genre, ik ga gewoon een beetje door spotify heen, dan vind ik daar weer een leuk pop nummer, daar weer een goede gitaar solo. Ik luister niet naar muziek kwa genre maar ik luister en denk bij mezelf vind ik dit leuk? Dan zet ik hem in mijn playlist en komt die vaker terug.

Als ik een app zou moeten maken zou het een app zijn die vraagt om je favourite nummers op dit moment en dan vergelijkbare nummers gaat opzoeken voor je, persoonlijk zit ik uren te zoeken naar leuke nummers, met zo’n app heb je binnen een paar minuten nummers die je in theorie leuk zou moeten vinden.

function setup() {
  createCanvas(400, 200);
  
  colorA = "white"
  colorB = "white"
  colorC = "white"
  colorD = "white"
  colorE = "white"
  colorF = "white"
  colorG = "white"
  colorH = "white"
  
  soundA = loadSound('Goat.mp3')
  soundB = loadSound('Man.mp3')
  soundC = loadSound('Dino.mp3')
  soundD = loadSound('Bruh.mp3')
  soundE = loadSound('FBI.mp3')
  soundF = loadSound('willie.mp3')
  soundG = loadSound('sjon.mp3')
  soundH = loadSound('alert.mp3')
  
   soundAs = loadSound('key01.mp3')
   soundBs = loadSound('key02.mp3')
   soundCs = loadSound('key03.mp3')
   soundDs = loadSound('key04.mp3')
   soundEs = loadSound('key05.mp3')
   soundFs = loadSound('key06.mp3')
   soundGs = loadSound('key07.mp3')
}

function draw() {
  background(220);
  
  fill("black")
  rect(0,0,600,200)
    
// A
    if (mouseX > 0 && mouseX < 50 && mouseY > 0 && mouseY < 200) {
    if (mouseIsPressed) {
      soundA.play()
    }
  }
        if (soundA.isPlaying()) {
        colorA = "red"
      }
      else {
        colorA = "white"
      }
 //b 
  if (mouseX > 50 && mouseX < 100 && mouseY > 0 && mouseY < 200) {
    if (mouseIsPressed) {
      soundB.play()
    }
  }
            if (soundB.isPlaying()) {
        colorB = "red"
      }
      else {
        colorB = "white"
      }
 //c 
  if (mouseX > 100 && mouseX < 150 && mouseY > 0 && mouseY < 200) {
    if (mouseIsPressed) {
      soundC.play()
    }
  }
            if (soundC.isPlaying()) {
        colorC = "red"
      }
      else {
        colorC = "white"
      }
  //d
  if (mouseX > 150 && mouseX < 200 && mouseY > 0 && mouseY < 200) {
    if (mouseIsPressed) {
      soundD.play()
    }
  }
            if (soundD.isPlaying()) {
        colorD = "red"
      }
      else {
        colorD = "white"
      }
  //e
  if (mouseX > 200 && mouseX < 250 && mouseY > 0 && mouseY < 200) {
    if (mouseIsPressed) {
      soundE.play()
    }
  }
           if (soundE.isPlaying()) {
        colorE = "red"
      }
      else {
        colorE = "white"
      }
  //f 
  if (mouseX > 250 && mouseX < 300 && mouseY > 0 && mouseY < 200) {
    if (mouseIsPressed) {
      soundF.play()
    }
  }
            if (soundF.isPlaying()) {
        colorF = "red"
      }
      else {
        colorF = "white"
      }
  //g
  if (mouseX > 300 && mouseX < 350 && mouseY > 0 && mouseY < 200) {
    if (mouseIsPressed) {
      soundG.play()
    }
  }
            if (soundG.isPlaying()) {
        colorG = "red"
      }
      else {
        colorG = "white"
      }
 //h 
  if (mouseX > 350 && mouseX < 400 && mouseY > 0 && mouseY < 200) {
    if (mouseIsPressed) {
      soundH.play()
    }
  }
            if (soundH.isPlaying()) {
        colorH = "red"
      }
      else {
        colorH = "white"
      }
  // basss notes 
  
  fill(colorA)
  rect(0,0,50,200)
  fill(colorB)
  rect(50,0,50,200)
  fill(colorC)
  rect(100,0,50,200)
  fill(colorD)
  rect(150,0,50,200)
  fill(colorE)
  rect(200,0,50,200)
  fill(colorF)
  rect(250,0,50,200)
  fill(colorG)
  rect(300,0,50,200)
  fill(colorH)
  rect(350,0,50,200)
  

  
  // sharps
  fill("black")
  rect(38,0,25,120)
  
  rect(88,0,25,120)
  
  rect(138,0,25,120)
  
  rect(188,0,25,120)
  
  rect(238,0,25,120)
  
  rect(288,0,25,120)
  
  rect(338,0,25,120)
  
}

function keyTyped() {
    if (key == 'a') {
    soundA.play();
  }
    if (key == 'b') {
    soundB.play();
  }
    if (key == 'c') {
    soundC.play();
  }
    if (key == 'd') {
    soundD.play();
  }
    if (key == 'e') {
    soundE.play();
  }
    if (key == 'f') {
    soundF.play();
  }
    if (key == 'g') {
    soundG.play();
  }
    if (key == 'h') {
    soundH.play();
  }
  if (keyCode == 49) {
    soundAs.play()
  }
    if (keyCode == 50) {
    soundAs.play()
  }
    if (keyCode == 51) {
    soundBs.play()
  }
    if (keyCode == 52) {
    soundCs.play()
  }
    if (keyCode == 53) {
    soundDs.play()
  }
    if (keyCode == 54) {
    soundEs.play()
  }
    if (keyCode == 55) {
    soundFs.play()
  }
    if (keyCode == 56) {
    soundGs.play()
  }
}