{"id":68819,"date":"2021-11-07T22:21:40","date_gmt":"2021-11-08T03:21:40","guid":{"rendered":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/?p=68819"},"modified":"2021-11-07T22:26:36","modified_gmt":"2021-11-08T03:26:36","slug":"project-10-sonic-story-8","status":"publish","type":"post","link":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/2021\/11\/07\/project-10-sonic-story-8\/","title":{"rendered":"Project 10: Sonic Story"},"content":{"rendered":"<!DOCTYPE html PUBLIC \"-\/\/W3C\/\/DTD HTML 4.0 Transitional\/\/EN\" \"http:\/\/www.w3.org\/TR\/REC-html40\/loose.dtd\">\n<html><body><div class=\"wp-block-file\"><a class=\"p5_sketch_link\" data-width=\"600\" data-height=\"300\" href=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/11\/sketch-31.js\">sketch<\/a><iframe src=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/plugins\/p5-embedder\/p5_iframe.html\" class=\"p5_exampleFrame\" width=\"600\" height=\"300\"><\/iframe><pre class=\"language-javascript\"><code class=\"p5_editor language-javascript\">\/\/Christy Zo\n\/\/Section C\n\nvar cricketSound;\nvar roosterSound;\nvar cowSound;\nvar pigSound;\nvar sunHue;\n\nfunction preload() {\n    cricketSound = loadSound(\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/11\/cricketSound.wav\");\n    roosterSound = loadSound(\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/11\/roosterSound.wav\");\n    cowSound = loadSound(\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/11\/cowSound.wav\");\n    pigSound = loadSound(\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/11\/pigSound.wav\")\n }\n\nfunction soundSetup() {\n    osc = new p5.TriOsc();\n}\nfunction setup() {\n    createCanvas(600, 300);\n    useSound();\n    frameRate(30);\n}\n\n\n\nfunction barn(x) {\n    stroke(255);\n    strokeWeight(2);\n    fill(50);\n    rect(x, 100, 200, 150);\n    fill(255);\n    rect(x+10, 110, 180, 80);\n    fill(50);\n    rect(x+10, 200, 180, 40);\n    line(x+10, 200, x+190, 240);\n    line(x+10, 240, x+190, 200);\n    triangle(x, 100, x+200, 100, x+100, 30);\n    triangle(x+15, 100, x+185, 100, x+100, 40);\n}\n\nfunction rooster(x) {\n    stroke(0);\n    fill(255);\n    line(x, 150, x-30, 190); \n    line(x, 150, x+30, 190);\n    circle(x, 150, 50); \n    fill(220);\n    circle(x, 180, 20);\n    triangle(x, 140, x-10, 110, x+10, 110); \n    fill(150);\n    triangle(x, 150, x-10, 160, x+10, 160);\n    triangle(x, 170, x-10, 160, x+10, 160);\n    fill(255);\n    circle(x-10, 145, 5);\n    circle(x+10, 145, 5);\n\n}\n\nfunction cow(x) {\n    fill(255);\n    stroke(0);\n    rect(x, 125, 50, 50);\n    fill(200);\n    ellipse(x+25, 170, 52, 30); \/\/nose\n    fill(255);\n    circle(x+12, 170, 10);\n    circle(x+37, 170, 10);\n    circle(x+15, 145, 5);\n    circle(x+35, 145, 5);\n    ellipse(x-10, 125, 25, 10); \/\/ears\n    ellipse(x+55, 125, 25, 10);\n    line(x, 150, x-30, 190);\n    line(x+50, 150, x+80, 190);\n\n}\n\nfunction pig(x) {\n    line(x, 150, x-30, 190);\n    line(x, 150, x+30, 190);\n    circle(x, 150, 60);\n    circle(x-10, 145, 5);\n    circle(x+10, 145, 5);\n    fill(150);\n    ellipse(x, 160, 30, 15);\n    fill(255);\n    circle(x-5, 160, 5);\n    circle(x+5, 160, 5);\n    fill(100);\n    triangle(x-20, 120, x-25, 130, x-15, 125);\n    triangle(x+20, 120, x+25, 130, x+15, 125);\n\n    \n\n}\n\nvar light = 0;\nvar position = 255;\nfunction draw() {\n    \n    background(light);\n    fill(light);\n    rect(0, 0, 600, 300);\n\n    sunHue = map(position, 0, height, 255, 0);\n    fill(sunHue, 150, 0);\n    ellipse(200, position, 50, 50);\n    if (position &lt; -50) {\n        position = 300;\n        light = 0;\n        frameCount = 0;\n\n    }\n    fill(220);\n    noStroke();\n    rect(0, 200, 600, 300);\n    barn(0);\n    barn(200);\n    barn(400);\n\n\n\n    rooster(100);\n    cow(275);\n    pig(500);\n\n    light = light + 1;\n    position = position - 1;\n    if (frameCount == 30) {\n        cricketSound.play();\n    }\n    if (frameCount == 80) {\n        roosterSound.play();\n\n    } else if (frameCount == 140) {\n        cowSound.play();\n    } else if (frameCount == 200) {\n        pigSound.play();\n    }\n\n    if (roosterSound.isPlaying()) {\n        fill(255,0,0);\n        circle(100, 180, 20);\n        triangle(100, 140, 90, 110, 110, 110);\n        fill(255,255,0);\n        triangle(100, 150, 100-10, 160, 100+10, 160);\n        triangle(100, 170, 100-10, 160, 100+10, 160);\n    } else if (cowSound.isPlaying()) {\n        fill(165,42,42);\n        ellipse(275+25, 170, 52, 30);\n        fill(255);\n        circle(275+12, 170, 10);\n        circle(275+37, 170, 10);\n    } else if (pigSound.isPlaying()) {\n        fill(255, 192, 203);\n        triangle(500-20, 120, 500-25, 130, 500-15, 125);\n        triangle(500+20, 120, 500+25, 130, 500+15, 125);\n        ellipse(500, 160, 30, 15);\n        fill(255);\n        circle(500-5, 160, 5);\n        circle(500+5, 160, 5);\n\n    }\n\n}\n\n\n<\/code><\/pre><\/div>\n\n\n\n<p>I was reminded of the story Animal Farm, and wanted to create a simple yet cute! I wanted to make everything greyscale, but emphasize the colors when each of the animals sound play! <\/p><\/body><\/html>\n","protected":false},"excerpt":{"rendered":"<p>sketch \/\/Christy Zo \/\/Section C var cricketSound; var roosterSound; var cowSound; var pigSound; var sunHue; function preload() { cricketSound = loadSound(&#8220;https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/11\/cricketSound.wav&#8221;); roosterSound = loadSound(&#8220;https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/11\/roosterSound.wav&#8221;); cowSound = loadSound(&#8220;https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/11\/cowSound.wav&#8221;); pigSound = loadSound(&#8220;https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/11\/pigSound.wav&#8221;) } function soundSetup() { osc = new p5.TriOsc(); } function setup() { createCanvas(600, 300); useSound(); frameRate(30); } function barn(x) { stroke(255); strokeWeight(2); fill(50); rect(x, 100, &hellip; <a href=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/2021\/11\/07\/project-10-sonic-story-8\/\" class=\"more-link\">Continue reading<span class=\"screen-reader-text\"> &#8220;Project 10: Sonic Story&#8221;<\/span><\/a><\/p>\n","protected":false},"author":682,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[113,57],"tags":[],"_links":{"self":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/posts\/68819"}],"collection":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/users\/682"}],"replies":[{"embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/comments?post=68819"}],"version-history":[{"count":3,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/posts\/68819\/revisions"}],"predecessor-version":[{"id":68825,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/posts\/68819\/revisions\/68825"}],"wp:attachment":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/media?parent=68819"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/categories?post=68819"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/tags?post=68819"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}