Sound Board:
https://editor.p5js.org/SuperiorCrane1/sketches/_oryzn0ks
var grubpicture;
var bellpicture;
var horneticture;
var corniferpicture;
var dreampicture;
var dungdefender;
var marmupicture;
var seerpicture;
var slypicture;
var zotepicture;
var grimmpicture;
var tisopicture;
var gorbpicture;
var mappicture;
function preload() {
grubpicture = loadImage("grub.png")
bellpicture = loadImage("bell.PNG")
hornetpicture = loadImage("Hornet_Idle.webp")
corniferpicture = loadImage("cornifel.png")
dreampicture = loadImage("Icon_HK_Dreamgate.webp")
dungdefender = loadImage("Dung-Defender-2.webp")
marmupicture = loadImage("marmu_boss_icon_hollow_knight_wiki.png")
seerpicture = loadImage("985-9856720_sup-folks-i-will-protect-seer-with-my.png")
slypicture = loadImage("kuruvfouy0m81.png")
zotepicture = loadImage("B_Zote.webp")
grimmpicture = loadImage("Grimm.webp")
tisopicture = loadImage("Tiso.webp")
gorbpicture = loadImage("gorb_redrawn_by_forgotten64_dcnijfp-fullview.png")
mappicture = loadImage("hallownest_map_hollow_knight_wiki.jpg")
}
function setup() {
createCanvas(720, 750);
grub= loadSound("grub_free_1.wav")
bell= loadSound("bell_hit.wav")
hornet= loadSound("Hornet_Dialogue_Generic_02.wav")
hum= loadSound("Cornifer_01 (1).wav")
dream= loadSound("dream_enter_pt_2.wav")
dung= loadSound("Dung_Def_roar_02.wav")
marmu= loadSound("Marmu_short_01.wav")
moth=loadSound("Moth_Seer_Generic_01.wav")
sly=loadSound("Sly_shop_open.wav")
zote=loadSound("Zote_summon_roar.wav")
grim=loadSound("Grimm_talk_03.wav")
tiso=loadSound("Tiso_talk_01.wav")
gorb=loadSound("Gorb_death.wav")
frameRate(240)
}
function draw() {
background(0, 0 ,0)
fill(255, 255, 255);
strokeWeight(5);
rect(5, 5, 50, 240);
image(grubpicture,-20,133,100,110)
rect(60, 5, 50, 240);
rect(115, 5, 50, 240);
image(hornetpicture,90,110,100,140)
image(bellpicture,60,5,50,240)
rect(170, 5, 50, 240);
image(corniferpicture,150,60,110,110)
rect(225, 5, 50, 240);
image(dreampicture,190,155,120,120)
rect(280, 5, 50, 240);
image(dungdefender,275,135,80,110)
rect(335, 5, 50, 240);
image(marmupicture,328,70,140,140)
rect(390, 5, 50, 240);
image(seerpicture,370,126,140,140)
rect(445, 5, 50, 240);
image(slypicture,430,105,100,140)
rect(500, 5, 50, 240);
image(zotepicture,500,105,100,140)
rect(555, 5, 50, 240);
image(grimmpicture,547,105,70,110)
rect(610, 5, 50, 240);
image(tisopicture,605,135,70,110)
rect(665, 5, 50, 240);
image(gorbpicture,652,80,78,140)
strokeWeight(0)
rect(175,165,42,80);
fill(0)
strokeWeight(4.7)
rect(5,5,-5,250)
rect(60,5,-5,250)
rect(115,5,-5,250)
rect(170,5,-5,250)
rect(225,5,-5,250)
rect(280,5,-5,250)
rect(335,5,-5,250)
rect(390,5,-5,250)
rect(445,5,-5,250)
rect(500,5,-5,250)
rect(555,5,-5,250)
rect(610,5,-5,250)
rect(665,5,-5,250)
rect(720,5,-5,250)
rect(0,245,720,250)
image(mappicture,0,250,720,500)
if (mouseIsPressed && mouseX > 5 && mouseX < 55 || keyIsPressed && key == "q") {
fill(185,212,159);
rect(5, 5, 50, 240);
if(!grub.isPlaying()){grub.play()}
} else {
fill(255, 255, 255);
}
if (mouseIsPressed && mouseX > 60 && mouseX < 110 || keyIsPressed && key == "w") {
fill(0, 104, 168);
rect(60, 5, 50, 240);
if(!bell.isPlaying()){bell.play()}
} else {
fill(255, 255, 255);
}
if (mouseIsPressed && mouseX > 115 && mouseX < 165 || keyIsPressed && key == "e") {
fill(121,65,75);
rect(115, 5, 50, 240);
if(!hornet.isPlaying()){hornet.play()}
} else {
fill(255, 255, 255);
}
if (mouseIsPressed && mouseX > 170 && mouseX < 220 || keyIsPressed && key == "r") {
fill(50,64,100);
rect(170, 5, 50, 240);
if(!hum.isPlaying()){hum.play()}
} else {
fill(255, 255, 255);
}
if (mouseIsPressed && mouseX > 225 && mouseX < 275 || keyIsPressed && key == "t") {
fill(226,193,128);
rect(225, 5, 50, 240);
if(!dream.isPlaying()){dream.play()}
} else {
fill(255, 255, 255);
}
if (mouseIsPressed && mouseX > 280 && mouseX < 330 || keyIsPressed && key == "y") {
fill(80,57,90);
rect(280, 5, 50, 240);
if(!dung.isPlaying()){dung.play()}
} else {
fill(255, 255, 255);
}
if (mouseIsPressed && mouseX > 335 && mouseX < 385 || keyIsPressed && key == "u") {
fill(109,119,105);
rect(335, 5, 50, 240);
if(!marmu.isPlaying()){marmu.play()}
} else {
fill(255, 255, 255);
}
if (mouseIsPressed && mouseX > 390 && mouseX < 440 || keyIsPressed && key == "i") {
fill(171,100,207);
rect(390, 5, 50, 240);
if(!moth.isPlaying()){moth.play()}
} else {
fill(255, 255, 255);
}
if (mouseIsPressed && mouseX > 445 && mouseX < 495 || keyIsPressed && key == "o") {
fill(48,73,101);
rect(445, 5, 50, 240);
if(!sly.isPlaying()){sly.play()}
} else {
fill(255, 255, 255);
}
if (mouseIsPressed && mouseX > 500 && mouseX < 550 || keyIsPressed && key == "p") {
fill(224,207,213);
rect(500, 5, 50, 240);
if(!zote.isPlaying()){zote.play()}
} else {
fill(255, 255, 255);
}
if (mouseIsPressed && mouseX > 555 && mouseX < 605 || keyIsPressed && key == "a") {
fill(132,57,61);
rect(555, 5, 50, 240);
if(!grim.isPlaying()){grim.play()}
} else {
fill(255, 255, 255);
}
if (mouseIsPressed && mouseX > 610 && mouseX < 660 || keyIsPressed && key == "s") {
fill(44,75,101);
rect(610, 5, 50, 240);
if(!tiso.isPlaying()){tiso.play()}
} else {
fill(255, 255, 255);
}
if (mouseIsPressed && mouseX > 665 && mouseX < 715 || keyIsPressed && key == "d") {
fill(228,224,219);
rect(665, 5, 50, 240);
if(!gorb.isPlaying()){gorb.play()}
} else {
fill(255, 255, 255);
}
}
Writing prompt
Je kan met de muis op 13 verschillende knoppen klikken die allemaal een andere sound afspelen van het spel Hollow Knight. Naast dat kan je de knoppen ook activeren door op Q t/m D te drukken op het toetsenbord. Elke knop heeft een afbeelding van waar het geluid vandaan komt, en onder staat een map was het afgespeelde geluid voorkomt.
Over het algemeen ben ik tijdens het maken van deze soundboard niet veel problemen tegen gekomen. Alleen had ik in het begin veel moeite met de Sounds in p5js te krijgen en deze te laten werken, toen ik dat onder de knie had ging het erg vlot.
Ik zou persoonlijk niet weten wat ik specifiek kan aanpassen om het te verbeteren, maar er zullen genoeg onderdelen zijn die beter gemaakt kunnen worden door iemand anders.