For this week’s project, I decided to depict a chill night in that someone might have with their cats in a living room. I was feeling a bit stressed because of my classes, so I tried to go for more of a chill vibe that took various aspects of my existing room and blended them with auditory elements.
I did the initial drawings in illustrator, and imported each part as a different image.
sketchDownload
// Susie Kim
// susiek@andrew.cmu.edu
// Section A
// Project 10
// call global variables
var bgPhoto;
var cupcake;
var cupcakeX = 280;
var cupcakeY = 360;
var pointedHand;
var pointedHandX = 230;
var pointedHandY = 450;
var grabbingHand;
var grabbingHandX = 280;
var grabbingHandY = 450;
var tvScreen;
var musicNotes;
var mouth;
var count = 0;
var meow;
var tvTurnOn;
var eat;
var musicPlay;
function preload() {
// load images
bgPhoto = loadImage('https://i.imgur.com/SJVApbw.jpg');
cupcake = loadImage('https://i.imgur.com/muqUIC2.png');
pointedHand = loadImage('https://i.imgur.com/3HCNg3e.png');
grabbingHand = loadImage('https://i.imgur.com/375PW9c.png');
musicNotes = loadImage('https://i.imgur.com/FVRrvrB.png');
tvScreen = loadImage('https://i.imgur.com/7mrIDoW.png');
meow = loadSound("https://courses.ideate.cmu.edu/15-104/f2020/wp-content/uploads/2020/11/catmeow.wav");
tvTurnOn = loadSound("https://courses.ideate.cmu.edu/15-104/f2020/wp-content/uploads/2020/11/tvsound.wav");
eat = loadSound("https://courses.ideate.cmu.edu/15-104/f2020/wp-content/uploads/2020/11/eating.wav");
musicPlay = loadSound("https://courses.ideate.cmu.edu/15-104/f2020/wp-content/uploads/2020/11/music1.wav");
}
function setup() {
// you can change the next 2 lines:
createCanvas(400, 400);
frameRate(4);
imageMode(CENTER);
useSound();
}
function soundSetup() { // setup for audio generation
meow.setVolume(1);
tvTurnOn.setVolume(1);
eat.setVolume(1);
musicPlay.setVolume(1);
}
function draw() {
count++; // add 1 frame for each time draw function runs
image(bgPhoto, width/2, height/2, width, height); // set up background photo
// have a hand come and take the cupcake on the table
if (count >= 0 & count < 100) {
image(cupcake, cupcakeX, cupcakeY, 40, 40); // place cupcake in scene
image(grabbingHand, grabbingHandX, grabbingHandY, 100, 100); // place hand outside of scene, ready to grab
}
if (count > 30 & count < 45) { // bring hand into frame
grabbingHandY -= 5;
}
if (count > 45 & count < 100) { // have hand take cupcake
cupcakeY += 5;
grabbingHandY += 5;
}
// eating sound from the person eating the cupcake
if (count == 100) {
eat.play();
}
// have both cats meow with mouths open
catMouth();
if (count >= 0 & count < 125) { // have mouths regular
mouth = true;
}
if (count > 125 & count < 155) { // have mouths open with meow sound
mouth = false;
}
if (count == 126) {
meow.play();
}
if (count > 155) { // mouths return back to normal after meow
mouth = true;
}
// have hand come and touch remote to turn tv off
tvOn();
if (count >= 0 & count < 155) { // keep screen on
screen = true;
}
if (count > 165 & count < 172) { // screen turns off as hand moves away
screen = false;
pointedHandY += 7;
}
if (count == 166) {
tvTurnOn.play();
}
image(pointedHand, pointedHandX, pointedHandY, 100, 100);
if (count > 140 & count < 155) { // hand comes to click remote
pointedHandY -= 5;
}
// have hand come and touch remote again to play music on record player
if (count > 165 & count < 173) { // hand comes to push button
pointedHandX = 236;
pointedHandY -= 5;
}
if (count > 185 & count < 213) { // hand moves away
pointedHandY += 5;
}
if (count > 174) { // show music notes and play music
image(musicNotes, 80, 70, 50, 50);
}
if (count == 175) {
musicPlay.play();
}
}
function tvOn() {
if (screen == true) { // tv shows pink screen with flower when on
image(tvScreen, 205, 145, 135, 90);
}
if (screen == false) { // tv is black when off
fill(0);
rectMode(CENTER);
rect(205, 145, 134, 80, 8);
}
}
function catMouth() {
strokeWeight(.5);
stroke(0);
noFill();
if (mouth == true) { // mouth closed when sitting
line(220, 307, 225, 307); // white cat
line(81, 276, 84, 276); // orange cat
} else if (mouth == false) { // mouth open when meowing
ellipse(223, 307, 5, 5); // white cat
ellipse(83, 276, 3, 3); // orange cat
// sound marks for white cat
strokeWeight(1);
stroke(255, 255, 0);
line(260, 280, 270, 265);
line(250, 280, 250, 265);
line(240, 283, 230, 268);
// sound marks for orange cat
line(60, 238, 60, 251);
line(50, 251, 45, 238);
line(43, 253, 30, 240);
}
}