CLICK ON CANVAS TO START!
sonic story wordpress
var pan1; // pan
var pan2; // pan with flame
var egg1; // whole egg
var egg2; // cracked egg
var egg3; // raw egg
var egg4; // cooked egg
var bacon1; // raw bacon
var bacon2; // cooked bacon
var plate;
var pansound;
var stove;
var fridge;
var crackegg;
var fryegg;
var bacon;
var tada;
var counter = false;
var count = 0;
function preload() {
// images
pan1 = loadImage("https://i.imgur.com/k8FOFKN.png");
pan2 = loadImage("https://i.imgur.com/A5D1YD7.png");
egg1 = loadImage("https://i.imgur.com/bTLCEPN.png");
egg2 = loadImage("https://i.imgur.com/W6aWzCk.png");
egg3 = loadImage("https://i.imgur.com/ptjZjee.png");
egg4 = loadImage("https://i.imgur.com/f0iTWaq.png");
bacon1 = loadImage("https://i.imgur.com/JllJSKp.png");
bacon2 = loadImage("https://i.imgur.com/KaqJr4l.png");
plate = loadImage("https://i.imgur.com/OKZWSey.png");
// sounds
pansound = loadSound("https://courses.ideate.cmu.edu/15-104/f2021/wp-content/uploads/2021/11/pansound.wav");
stove = loadSound("https://courses.ideate.cmu.edu/15-104/f2021/wp-content/uploads/2021/11/stove.wav");
fridge = loadSound("https://courses.ideate.cmu.edu/15-104/f2021/wp-content/uploads/2021/11/fridge.wav");
crackegg = loadSound("https://courses.ideate.cmu.edu/15-104/f2021/wp-content/uploads/2021/11/crackegg.wav");
fryegg = loadSound("https://courses.ideate.cmu.edu/15-104/f2021/wp-content/uploads/2021/11/fryegg.wav");
bacon = loadSound("https://courses.ideate.cmu.edu/15-104/f2021/wp-content/uploads/2021/11/bacon.wav");
tada = loadSound("https://courses.ideate.cmu.edu/15-104/f2021/wp-content/uploads/2021/11/tada.wav");
}
function setup() {
createCanvas(400, 400);
frameRate(1);
pan1.resize(200, 0);
pan2.resize(200, 0);
egg1.resize(40, 0);
egg2.resize(80, 0);
egg3.resize(80, 0);
egg4.resize(80, 0);
bacon1.resize(40, 0);
bacon2.resize(90, 0);
plate.resize(200, 0);
useSound();
}
function soundSetup() {
pansound.setVolume(5);
stove.setVolume(5);
fridge.setVolume(5);
crackegg.setVolume(5);
fryegg.setVolume(5);
bacon.setVolume(5);
tada.setVolume(5);
}
function draw() {
background(247, 220, 224); // light pink background
// story line: this is basically a short clip of making breakfast. There are a lot of kitchen and cooking sounds incorporated to show each step of frying an egg and bacon.
if (counter == true) {
count += 1;
}
// taking out pan
if (count > 0 & count <= 2) {
image(pan1, 110, 230);
pansound.play();
}
// turn on stove
if (count >= 2 & count < 4) {
pansound.stop();
image(pan2, 110, 230); // switch to pan with flames
stove.play();
}
// taking out egg
if (count >= 4 & count < 5) {
stove.stop();
image(pan2, 110, 230);
image(egg1, 170, 200);
fridge.play();
}
// cracking egg
if (count >= 5 & count < 6) {
fridge.stop();
image(pan2, 110, 230);
image(egg2, 150, 200);
crackegg.play();
}
// raw egg in pan
if (count >= 6 & count < 9) {
crackegg.stop();
image(pan2, 110, 230);
image(egg3, 155, 285);
fryegg.play();
}
// egg sizzling -> cooked
if (count >= 9 & count < 12) {
image(pan2, 110, 230);
image(egg4, 155, 285);
}
// taking out bacon
if (count >= 12 & count < 13) {
fryegg.stop();
fridge.play();
image(pan2, 110, 230);
image(bacon1, 170, 200);
}
// bacon sizzling -> cooked
if (count >= 13 & count < 15) {
bacon.play();
image(pan2, 110, 230);
image(bacon2, 150, 285);
}
// bacon in plate w/ egg + TADA
if (count >= 15 & count < 16) {
bacon.stop();
tada.play();
image(plate, 100, 230);
image(bacon2, 130, 260);
image(egg4, 180, 260);
}
}
function mousePressed() {
counter = true; // starts counting once click screen
}
My sonic story is quite simple. It basically shows a breakfast of eggs and bacon being made. I drew all the graphics for the food, pan, flame, and plate. I used sounds like the fridge opening to represent taking out the ingredients. Other sounds like cracking the egg and the bacon sizzling are all to represent the cooking.