While I was brainstorming for this assignment, I kept thinking about one of my favorite poems from my childhood – ‘Early Bird’ by Shel Silverstein. He puts life in perspective in only a few lines. I decided I wanted to capture the lighthearted yet powerful impact of this poem in this assignment, hopefully bringing more life to the words.
I love Silverstein’s illustrations so I wanted to tell this story in the same visual language. I used the illustrations that are typically paired with this poem as a starting off point.
After drawing the worm in Procreate and recording some snores from local talent (within the confines of my house, that is.. #2020), I used a DAW to boost some up some of the low end of the snore recording as well reduce the ear-piercing frequencies of the original bird tweeting. I began assembling the final composition.
A pretty blatant Easter egg I included was the giving tree (from the book rattling the hearts of children since 1964, The Giving Tree). I figured it was a fun inclusion that helped make my scene feel more Shel Silverstein-y.
//PROJECT-10 SONIC STORY (EARLY BIRD)
//Jubbies Steinweh-Adler
// SECTION D
//I am telling the story of Shel Silverstein's Poem, 'Early Bird', which I
//wanted to capture in a light-hearted way. I referenced the illustrations
//from the poem book and referenced The Giving Tree (another Shel Silverstein
//classic) in the background to fill out the scene.
//The four elemetnts are the background(tree and sun), bird, text card, and worm
var counter = 0;
//-------------------IMAGES----------------------
//Images - animated
var lBirdImage = []; // an array to store the images
var wormImage = []; // an array to store the images
//Images - still
var backdrop;
//-------------------SOUNDS----------------------
var birdflap;
var birdtweet;
var snore;
//------------------TEXT-------------------------
var poem = [];
poem[0] = "Oh, if you're a bird, be an early bird"
poem[1] = "And catch the worm for your breakfast plate."
poem[2] = "If you're a bird, be an early early bird –– "
function preload(){
//-------------------IMAGES----------------------
//Load arrays with respective links
var lBirdlinks = [];
lBirdlinks[0] = "https://i.imgur.com/6yc9BKx.png";
lBirdlinks[1] = "https://i.imgur.com/QwnI1EY.png";
lBirdlinks[2] = "https://i.imgur.com/jBLav2J.png";
var wormLinks = [];
wormLinks[0] = "https://i.imgur.com/F2zO93O.png";
wormLinks[1] = "https://i.imgur.com/hBelnJC.png";
wormLinks[2] = "https://i.imgur.com/uW5OplX.png";
wormLinks[3] = "https://i.imgur.com/eRu5aBc.png";
//Load All Images
//BIRD
for (var i = 0; i < lBirdlinks.length; i++) {
lBirdImage[i] = loadImage(lBirdlinks[i]);
}
//WORM
for (var i = 0; i < wormLinks.length; i++) {
wormImage[i] = loadImage(wormLinks[i]);
}
backdrop = loadImage("https://i.imgur.com/6h0YPCF.png");
//-------------------SOUND----------------------
birdflap = loadSound("https://courses.ideate.cmu.edu/15-104/f2020/wp-content/uploads/2020/11/birdflap-1.wav");
birdtweet = loadSound("https://courses.ideate.cmu.edu/15-104/f2020/wp-content/uploads/2020/11/birdtweet-1.wav");
snore = loadSound("https://courses.ideate.cmu.edu/15-104/f2020/wp-content/uploads/2020/11/snore.wav");
}
// ==========BIRD===========
function stepBird() {
this.imageNumber ++; //add each new frame
if (this.imageNumber > 2) { //loop 3 images
this.imageNumber = 0;
}
this.x -= this.dx; //update x velocity
this.y -= this.dy; //update y velocity
}
function drawBird() {
image(lBirdImage[this.imageNumber], this.x, this.y, 568 * 0.3, 417 * 0.3 );
}
// BIRD CONSTRUCTOR
function makeBird(cx, cy, cdx, cdy) {
b = {x: cx, y: cy,
dx: cdx, dy: cdy,
imageNumber: 0,
stepFunction: stepBird,
drawFunction: drawBird
}
return b;
}
//==========WORM=============
function stepWorm() {
this.imageNumber ++; //add each new frame
if (this.imageNumber > 3) { //loop 4 images
this.imageNumber = 0;
}
}
function drawWorm() {
image(wormImage[this.imageNumber], this.x, this.y, 352 * 0.35, 243 * 0.35);
}
// WORM CONSTRUCTOR
function makeWorm(cx, cy) {
w = {x: cx, y: cy,
imageNumber: 0,
stepFunction: stepWorm,
drawFunction: drawWorm
}
return w;
}
// ==========TEXT CARD===========
function stepCard() {
this.y += this.dy; //update y movement
}
function drawCard() {
fill(0);
rect(this.x, this.y, 400, 200);
fill(255);
textSize(14);
for (var p = 0; p < 3; p++) {
text(poem[p], this.x + (p*50) + 30, this.y + (p*20) + 20, 300);
}
}
// CARD CONSTRUCTOR
function makeCard(cx, cy, cdy) {
c = {x: cx, y: cy, dy: cdy,
stepFunction: stepCard,
drawFunction: drawCard
}
return c;
}
// -----------SETUP--------------
function setup(){
createCanvas(400, 400);
frameRate(3);
useSound();
imageMode(CENTER);
makeBird(420, 100, 14, 0);
makeWorm(120, 330);
makeCard(0, 200, 13);
}
function soundSetup () {
birdflap.setVolume(0.5);
birdtweet.setVolume(0.5);
snore.setVolume(0.5);
}
function draw() {
background(250);
counter++;
//BACKGROUND
image(backdrop, 200, 200, 300 * (1 + (1/3)), 300*(1 + (1/3)));
//POEM LAST LINE
fill(0);
textSize(14);
text("But if you're a worm, sleep late. ", 230, 310, 140);
textSize(10);
text("― Shel Silverstein", 270, 350, 140);
//FOREGROUND ELEMENTS
//WORM
w.stepFunction();
w.drawFunction();
if(counter == 25) {
snore.play();
}
//TEXT CARD
c.drawFunction();
if(counter >= 30) { //move down after 30 frames
c.stepFunction();
}
//BIRD
b.stepFunction();
b.drawFunction();
if (counter == 1){
birdtweet.play();
birdflap.play();
}
}