//Clear Skies, by Ashborn Binapal 2018 //PROG 14998 Interactive Drawing Assignment void setup() { noCursor(); //removes mouse Cursor size(600,400); //sets image to Landscape rectMode(CORNERS); //set rectangles to CORNERS mode ellipseMode(CORNERS); //set ellipses to CORNERS mode noStroke(); //removed outline on shapes/objects } void draw() { noStroke(); //Sky //Background (Early Morning) background(70,72,129); //set as a transition colour between the phases //Night time light fill(1,2,52,250); //set colour to night like blue rect(0,0,600,400); //Day time light fill(243,236,208,(-80+mouseX)); //set colour to Very light yellow rect(0,0,600,400); //main sky colour fill(254,225,151,(-285+mouseX)); //set colour to light yellow rect(0,250,600,300); //secondary sky colour fill(230,177,93,(-250+mouseX)); //set colour to moderate orange rect(0,300,600,400); //darkest sky colour //Animated //Stars (They're 2pix by 2pix squares which expand to seem like they're flashing fill(255,255,255,255-(mouseX*1.25)); //set colour to white with fading opacity rect(200,150,202+sin(frameCount*.4),152+sin(frameCount*.4)); rect(250,165,252+sin(frameCount*.4),167+sin(frameCount*.4)); rect(225,90,227+sin(frameCount*.4),92+sin(frameCount*.4)); rect(134,232,136+sin(frameCount*.4),234+sin(frameCount*.4)); rect(276,258,278+sin(frameCount*.4),260+sin(frameCount*.4)); rect(145,119,147+sin(frameCount*.4),121+sin(frameCount*.4)); rect(291,308,293+sin(frameCount*.4),310+sin(frameCount*.4)); rect(343,57,345+sin(frameCount*.4),59+sin(frameCount*.4)); rect(420,236,422+sin(frameCount*.4),238+sin(frameCount*.4)); //420 hehe its lit rect(500,185,502+sin(frameCount*.4),187+sin(frameCount*.4)); rect(39,30,41+sin(frameCount*.4),32+sin(frameCount*.4)); rect(50,273,52+sin(frameCount*.4),275+sin(frameCount*.4)); rect(75,200,77+sin(frameCount*.4),202+sin(frameCount*.4)); rect(350,180,352+sin(frameCount*.4),182+sin(frameCount*.4)); rect(555,46,557+sin(frameCount*.4),48+sin(frameCount*.4)); rect(485,140,487+sin(frameCount*.4),142+sin(frameCount*.4)); rect(455,85,457+sin(frameCount*.4),87+sin(frameCount*.4)); rect(55,85,57+sin(frameCount*.4),87+sin(frameCount*.4)); /* sin(frameCount) functions allow for the illusion that the stars are flashing by constantly making their second X and Y values slightly increase and decrease*/ //Solar Objects //Moon fill(219,219,219,105-(mouseX/6)); //set colour to translucent grey ellipse(mouseX/1.25+445+sin(frameCount*.4),80,mouseX/1.25+500+sin(frameCount*.4),135); fill(180,180,180,240-(mouseX/2)); //set colour to grey ellipse(mouseX/1.25+450,85,mouseX/1.25+495,130); //Sun fill(236,242,83,225); //set colour to bright yellow ellipse(mouseX/1.2-185,65,mouseX/1.2-120,130); //Static //Lighthouse //Lighthouse Lower Body fill(237-(mouseX/5),239-(mouseX/5),247-(mouseX/5)); //set colour to white (gets darker to contrast with background with higher mouseX value) quad(465,260,490,260,485,190,470,190); //Lighthouse Middle Glass fill(119-(mouseX/10.5),153-(mouseX/10.5),155-(mouseX/10.5)); //set colour to light blue (gets darker with higher mouseX value) rect(485,190,470,175); //Lighthouse Upper Roof fill(121+(mouseX/12),27+(mouseX/28),28+(mouseX/28)); //set colour to red (gets brighter with higher mouseX value) triangle(465,175,490,175,477.5,168); //Lighthouse Stripe quad(468,200,487,200,488,210,467,210); //Ledge fill(50+(mouseX/14),28+(mouseX/14),12); //set colour to slightly darker brown (gets lighter with higher mouseX value) triangle(524,260,386,245,464,400); fill(56+(mouseX/14),32+(mouseX/14),12); //set colour to brown (gets lighter with higher mouseX value) rect(600,400,450,260); //Stones //Stone 1 (Right side) fill(140+(mouseX/12),140+(mouseX/12),142+(mouseX/12)); //set colour to grey (gets lighter with higher mouseX value) ellipse(536,300,555,400); ellipse(527,320,555,400); ellipse(555,312,564,400); //Stone 2 (Left side) ellipse(374,320,385,400); ellipse(367,335,385,400); ellipse(385,308,402,400); //Water fill(0+(mouseX/8),19+(mouseX/7),117+(mouseX/7)); //set colour to blue rect(0,325+(mouseY/20+sin(frameCount*.1)),600,400); //allows water to slightly move without mouseY movement //Clouds fill(222-(mouseX/10),222-(mouseX/10),222-(mouseX/10),245+(mouseX/7)); //set colour to very light grey (gets darker to contrast with background as mouseX value gets higher) //Small cloud ellipse(50+(mouseX/7),60,95+(mouseX/7),70); //Larger cloud #1 (The one closer to the center of the canvas at mouseX=0) ellipse(250+(mouseX/12),120,340+(mouseX/12),140); ellipse(245+(mouseX/12),135,330+(mouseX/12),155); ellipse(255+(mouseX/12),128,355+(mouseX/12),155); //Larger cloud #2 (The one closes to the left of the canvas at mouseX=0) ellipse(150+(mouseX/18),160,205+(mouseX/16),180); ellipse(140+(mouseX/18),175,195+(mouseX/16),195); ellipse(165+(mouseX/18),168,215+(mouseX/16),195); //Larger could #3 (The one closes to the right of the canvas at mouseX=0) ellipse(550+(mouseX/25),160,635+(mouseX/25),180); ellipse(525+(mouseX/25),175,610+(mouseX/25),195); ellipse(550+(mouseX/25),175,635+(mouseX/25),195); //Larger cloud #4 (Moves onto screen slowly as mouseX value increases) ellipse(-125+(mouseX/6),260,-35+(mouseX/6),280); ellipse(-100+(mouseX/6),275,-10+(mouseX/6),295); ellipse(-125+(mouseX/6),275,-35+(mouseX/6),295); //UI //mouse location fill(188,188,188,55); //set colour to very translucent grey rect(20,20,580,30); ellipse(18+(mouseX/1.1),15,38+(mouseX/1.1),35); //follows mouse's X position while staying on the bar } void mouseMoved() { //Lighthouse Light effect fill(249,252,171,125-(mouseX/6)); triangle(470,182.5,0,250,0,67.5); } //Roof and Stripe colour change void mousePressed() { //Lighthouse Upper Roof fill(113+(mouseX/12),255+(mouseX/28),100+(mouseX/28)); //set colour to green triangle(465,175,490,175,477.5,168); //Lighthouse Stripe quad(468,200,487,200,488,210,467,210); } void keyPressed() { //Key button press message print(" Looks like we have some clear skies."); }