// Sarah Luongo
// Section A
// Project
/* This code aims to tell a short story of traveling home during the holidays, and the joy upon finally arriving home.*/
var train;
var car;
var house;
var xmastree;
var family;
var trainN;
var drive;
var walk;
var bell;
var cheers;
// Load images and sounds
function preload() {
// Images
train = loadImage('https://i.imgur.com/8nQo4PL.png');
car = loadImage('https://i.imgur.com/J9C4YkK.png');
house = loadImage('https://i.imgur.com/ck3pJGM.png');
family = loadImage('https://i.imgur.com/GKtqVl2.png');
xmastree = loadImage('https://i.imgur.com/BTleSuv.png');
// Sounds
trainN = loadSound("https://courses.ideate.cmu.edu/15-104/f2020/wp-content/uploads/2020/11/train.wav");
drive = loadSound("https://courses.ideate.cmu.edu/15-104/f2020/wp-content/uploads/2020/11/drive.wav");
walk = loadSound("https://courses.ideate.cmu.edu/15-104/f2020/wp-content/uploads/2020/11/walk.wav");
bell = loadSound("https://courses.ideate.cmu.edu/15-104/f2020/wp-content/uploads/2020/11/bell.wav");
cheers = loadSound("https://courses.ideate.cmu.edu/15-104/f2020/wp-content/uploads/2020/11/cheers.wav");
}
function setup() {
createCanvas(400, 300);
frameRate(1);
train.resize(100, 100);
car.resize(100, 100);
house.resize(200, 200);
xmastree.resize(150, 200);
family.resize(width, 100);
useSound();
}
// Setup for audio generation
function soundSetup() {
trainN.setVolume(0.2);
drive.setVolume(1);
walk.setVolume(1);
bell.setVolume(0.5);
cheers.setVolume(0.5);
}
function draw() {
background(200);
noStroke();
// On the train:
if (frameCount <= 10) {
// Sky
fill(20, 40, 80);
rect(0, 0, width, height/1.3);
//Mountains
fill(200);
triangle(-50, height/1.3, 200, height/1.3, 75, height/3);
triangle(200, height/1.3, width, height/1.3, 300, height/2);
//Snow on top of mountain
fill(240)
triangle(60, height/2.6, 90, height/2.6, 75, height/3);
triangle(280, height/1.8, 320, height/1.8, 300, height/2);
// Snow
rect(0, height/1.3, width, height/4);
// Train
image(train, 0, height/2);
//trainN.play();
//Driving home:
} else if (frameCount > 10 & frameCount <= 20) {
// Sky
fill(20, 40, 80);
rect(0, 0, width, height/1.3);
// Snow
fill(240);
rect(0, height/1.5, width, height/3);
// Car
image(car, width/2, height/2.3);
//drive.play();
// Home:
} else if (frameCount > 20 & frameCount <= 25) {
// Sky
fill(20, 40, 80);
rect(0, 0, width, height/1.3);
// Snow
fill(240);
rect(0, height/1.5, width, height/3);
// House
image(house, 200, 8);
// Tree
fill(56, 28, 0);
rect(0, 60, 13, 150);
push();
rotate(radians(150));
rect(-20, -100, 65, 2);
pop();
// Car
image(car, 50, height/2.3);
// Sounds:
/*if (frameCount > 10 & frameCount <= 11) {
door.play();
} else if (frameCount > 11 & frameCount <= 14) {
walk.play();
} else if (frameCount > 14 & frameCount <= 15) {
bell.play();
}*/
// Inside home:
} else if (frameCount > 25 & frameCount <= 30) {
// Wall
fill(220, 51, 80);
rect(0, 0, width, height/1.5);
// Floor
fill(200);
rect(0, height/1.5, width, height/3);
// Christmas tree
image(xmastree, 250, 10);
// Family
image(family, 0, height/2.3);
//cheers.play();
// The end:
} else {
background(0);
fill(255);
textSize(20);
text("The End", width/2.5, height/2);
}
//Sounds
switch (frameCount) {
case 1: trainN.play(); break;
case 9: drive.play(); break;
case 21: walk.play(); break;
case 25: bell.play(); break;
case 26: cheers.play(); break;
}
}
For this project, I was inspired by Christmas and the “traveling home for the holidays” time of the year which is soon upon us. I decided to make the travel happen via a train and car, because that was how I got home my first time during freshman year. Then there’s the mini (or large) celebration when you finally return home! The five sounds I chose were, a train noise for the first scene, a car driving for the second, walking and a door bell ring for the third, and cheers for the last scene. The first two scenes last for about 10 seconds and the last two scenes last for about 5 seconds, making the entire story about 30 seconds long. I hope you enjoy!