//There are two characters, red and blue, fighting each other video
//game style. The announcer starts the match, and they fight,
//exchanging rapid punches and hits. Neither one does much damage.
//Suddenly, blue passes gas. The gas is deadly, and red dies.
//Blue wins, match is over.
var count = 0;
function preload() {
fight = loadSound("https://courses.ideate.cmu.edu/15-104/f2020/wp-content/uploads/2020/11/fight.wav")
punch = loadSound("https://courses.ideate.cmu.edu/15-104/f2020/wp-content/uploads/2020/11/punch.wav")
kick = loadSound("https://courses.ideate.cmu.edu/15-104/f2020/wp-content/uploads/2020/11/kick.wav")
fart = loadSound("https://courses.ideate.cmu.edu/15-104/f2020/wp-content/uploads/2020/11/fart.wav")
victory = loadSound("https://courses.ideate.cmu.edu/15-104/f2020/wp-content/uploads/2020/11/victory.wav")
}
function setup() {
createCanvas(400, 300);
frameRate(10)
useSound();
}
function soundSetup() { // setup for audio generation
// you can replace any of this with your own audio code:
//osc = new p5.TriOsc();
kick.setVolume(0.4);
punch.setVolume(0.4);
fight.setVolume(0.5);
fart.setVolume(0.9);
victory.setVolume(0.5);
}
function draw() {
background(0);
fill(100)
rect (0,225, 400, 75);
fill(0,255,0)
rect(20,20, 100,10)
rect(280,20, 100,10)
textSize(50)
fill(255)
text("FIGHT!", 120, 100);
//fighters are sizing each other up
if (count < 2) {
fight.play()
fightLeft(100,200)
fightRight(300,200)
}
if (count >=2 & count < 20){
fightLeft(120,200)
fightRight(320,200)
}
// red throws first punch
if (count >= 20 && count < 35){
fightLeft(100,200)
fightRight(300,200)
fill(240, 220, 170)
ellipse(260,230,20,15)
if (count >=20 && count < 25){
punch.play()
}
}
//blue fights back
if (count >= 35 && count < 50){
fightLeft(120,200)
fightRight(320,200)
fill(240, 220, 170)
ellipse(160,230,20,15)
if (count>=35 && count< 38){
kick.play()
}
}
//red punches again
if (count >= 50 && count < 65){
fightLeft(100,200)
fightRight(300,200)
fill(240, 220, 170)
ellipse(260,230,20,15)
if (count >=50 && count < 55){
punch.play()
}
}
//blue releases gas
if (count >= 65 && count < 80){
fightLeft(120,200)
fightRight(320,200)
if(count>70 && count< 78){
fartblue(60,230)
}
if (count > 70 && count<72){
fart.play()
}
}
if (count>=80 && count<90){
fightLeft(120,200)
fightRight(320,200)
}
//red dies from fart, blue wins
if(count>=90 && count<120){
fightLeft(120,200)
deadRight(320,200)
if (count>95 && count <98){
victory.play()
}
textSize(20)
fill(255)
text("WINNER", 50, 150);
fill(255,0,0)
rect(280,20, 100,10)
}
//story ends
if (count >= 120){
fill(0)
rect(0,0,width,height)
fill(255)
text("game over", 90, height/2)
}
count++
}
//left fight stance
function fightLeft(x,y){
fill(240, 220, 170)
ellipse(x, y,30)
fill(0,0,255)
beginShape();
curveVertex(x,y-10)
curveVertex(x+5, y+20)
curveVertex(x+20, y+60)
curveVertex(x, y+45)
curveVertex(x-20, y+60)
curveVertex(x-10, y+20)
curveVertex(x-5,y-10)
endShape();
rect(x-15, y-10, 30, 4)
fill(255);
ellipse(x, y, 8,12)
fill(0);
ellipse(x+2,y+2,6, 8)
stroke(0)
strokeWeight(3)
line(x,y-5,x+5,y)
line(x, y+11, x+6, y+11)
noStroke()
}
//red fight stance
function fightRight (x,y){
fill(240, 220, 170)
ellipse(x, y,30)
fill(255,0,0)
beginShape();
curveVertex(x,y-10)
curveVertex(x+5, y+20)
curveVertex(x+20, y+60)
curveVertex(x, y+45)
curveVertex(x-20, y+60)
curveVertex(x-10, y+20)
curveVertex(x-5,y-10)
endShape();
rect(x-15, y-10, 30, 4)
fill(255);
ellipse(x, y, 8,12)
fill(0);
ellipse(x-2,y+2,6, 8)
stroke(0)
strokeWeight(3)
line(x,y-5,x-5,y)
line(x, y+11, x-6, y+11)
noStroke()
}
//draw fart cloud
function fartblue(x,y){
fill(18, 135, 41)
ellipse(x,y,40,25)
}
//red dies
function deadRight (x,y){
fill(240, 220, 170)
ellipse(x, y,30)
fill(255,0,0)
beginShape();
curveVertex(x,y-10)
curveVertex(x+5, y+20)
curveVertex(x+20, y+60)
curveVertex(x, y+45)
curveVertex(x-20, y+60)
curveVertex(x-10, y+20)
curveVertex(x-5,y-10)
endShape();
rect(x-15, y-10, 30, 4)
stroke(0)
strokeWeight(3)
line(x,y-6,x-6,y+2)
line(x-6, y-6, x, y+2)
noFill()
ellipse(x-3, y+10, 8)
noStroke()
}
For my story, I had trouble manipulating the noise to be used in an interesting way. Because the noises themselves were already distinctive, I wasn’t sure how to improve the way they were used. I had fun writing a silly story inspired by the classic, pixelated video game characters I grew up with.
I used sounds from the timeless Mortal Kombat series, which were available online for free use. I took the classic announcer sayings of “fight!” and “flawless victory.” as well as the punching and attacking noises. I also used a sound from the recommended free sounds website of a simple passing gas noise. I thought that the last noise would be a funny juxtaposition to the otherwise epic sounds.