![[OLD FALL 2017] 15-104 • Introduction to Computing for Creative Practice](wp-content/uploads/2020/08/stop-banner.png)
I was inspired by Van Gogh’s Starry Night painting. I thought it would be interesting to see what his painting would look like if it was animated, since he painted a sky with wind that was painted with the intention of motion. I made each aspect of the painting into different functions, so they would be easier to place when each part was complete. I utilized many for loops in order to achieve his brush stroke affect. All in all, I think my code provides insight into what the wind in his painting would look like if it could be animated.
//Angela Rubin
//Section C
//aerubin@andrew.cmu.edu
//Project-10-Generative Landscape
function setup() {
createCanvas(480, 350);
}
function draw() {
background(73, 112, 137);
//draw funtions, in order of background to foreground
sky();
push();
stars();
pop();
push();
translate(-180, -170);
stars();
pop();
push();
translate(-270, -20);
stars();
pop();
push();
wind();
pop();
push();
translate(-300, 100);
wind();
pop();
push();
translate(-600, -100);
wind();
pop();
push();
translate(-900, 50);
wind();
pop();
push();
translate(-1200, -50);
wind();
pop();
push();
translate(-1500, 0);
wind();
pop();
push();
translate(-1800, 100);
wind();
pop();
push();
translate(-2100, -160);
wind();
pop();
push();
translate(-2500, -100);
wind();
pop();
push();
translate(-2900, 50);
wind();
pop();
push();
translate(-3200, -50);
wind();
pop();
push();
translate(-3500, 0);
wind();
pop();
push();
translate(-3900, 100);
wind();
pop();
landscape();
tree();
}
//draws the tree in the foreground
function tree() {
stroke(29, 47, 41);
strokeWeight(2);
fill(40, 32, 28);
triangle(100, 200, 95, height, 105, height);
triangle(100+5, 200-20, 95-6, height, 105-6, height);
triangle(100-2, 200-40, 95+5, height, 105+5, height);
triangle(100-7, 200+30, 95-3, height, 105-3, height);
triangle(100+9, 200-10, 95+2, height, 105+2, height);
triangle(100+3, 200-100, 95+4, height, 105+4, height);
triangle(100-2, 200-80, 95-2, height, 105-2, height);
triangle(100-2, 200-140, 95+6, height, 105+6, height);
triangle(100+5, 200-120, 95-4, height, 105-4, height);
triangle(100+22, 200+10, 95+15, height, 105+15, height);
triangle(100+20, 200+30, 95+20, height, 105+20, height);
triangle(100+14, 200, 95+14, height, 105+14, height);
triangle(100-17, 200-30, 95, height, 105, height);
triangle(100+18, 200+60, 95+20, height, 105+20, height);
}
//draws the landscape of ellipses
function landscape() {
noStroke();
push();
fill(28, 27, 29);
rotate(radians(-20));
ellipse(300+30, 310+50, 130, 50);
pop();
for(var b = 0; b < 10; b++) {
fill(45, 58-b*7, 115-b*9);
ellipse(10+b*60, 320-b*4, 100, 100+b*6);
}
}
//draws the dotted lines of the sky
function sky() {
strokeWeight(6);
for(var n = 0; n < 20; n++) {
for(var i = 0; i < 40;i++) {
stroke(178, 238, 237);
line(0+(i*20), 3+(n*15), 10+(i*20), 0+(n*15));
}
}
for(var n = 0; n < 20; n++) {
for(var i = 0; i < 40;i++) {
stroke(128, 194, 236);
line(7+(i*20), 4+(n*15), 17+(i*20), 6+(n*15));
}
}
for(var n = 0; n < 20; n++) {
for(var i = 0; i < 40;i++) {
stroke(118, 161, 169);
line(4+(i*20), 2+(n*15), 14+(i*20), 2+(n*15));
}
}
for(var n = 0; n < 18; n++) {
for(var i = 0; i < 40;i++) {
stroke(146, 169, 217);
line(8+(i*20), 7+(n*15), 18+(i*20), 7+(n*15));
}
}
for(var n = 0; n < 20; n++) {
for(var i = 0; i < 40;i++) {
stroke(103, 138, 167);
line(0+(i*20), 10+(n*15), 10+(i*20), 10+(n*15));
}
}
for(var n = 0; n < 15; n++) {
for(var i = 0; i < 40; i++) {
stroke(44, 67, 142);
line(5+(i*20), 7.5+(n*15), 15+(i*20), 8+(n*15));
}
}
for(var n = 0; n < 17; n++) {
for(var i = 0; i < 40;i++) {
stroke(54, 80, 164);
line(10+(i*20), 3+(n*15), 20+(i*20), 2+(n*15));
}
}
for(var n = 0; n < 10; n++) {
for(var i = 0; i < 40; i++) {
stroke(37, 48, 84);
line((i*20), 4+(n*15), 10+(i*20), (n*15));
}
}
for(var n = 0; n < 10; n++) {
for(var i = 0; i < 40; i++) {
stroke(46, 60, 121);
line(4+(i*15), 2+(n*15), 14+(i*15), 4+(n*15));
}
}
for(var n = 0; n < 5; n++) {
for(var i = 0; i < 40; i++) {
stroke(2, 38, 95);
line(3+(i*15), 15+(n*15), 13+(i*15), 10+(n*15));
}
}
strokeWeight(3);
for(var n = 0; n < 20; n++) {
for(var i = 0; i < 40; i++) {
stroke(73, 112, 137);
line(7+(i*15), 10+(n*10), 16+(i*15), 12+(n*10));
}
}
//sun
push();
translate(400, 57)
for(var i = 0; i < 30; i++) {
stroke(199, 198, 129);
rotate(.5);
for(var n = 0; n < 4; n++) {
line(25+(i*.1), 0+(n*10), 30+(i*.1), 0+(n*10));
}
}
pop();
noStroke();
fill(180, 157, 61);
arc(400, 55, 50, 50, HALF_PI, PI+HALF_PI);
}
//draws the moving wind
function wind() {
translate(millis()/70, 0); //rate at which wind moves
strokeWeight(4);
for(var n = 0; n < 5; n++) {
for(var i = 0; i < 10; i++) {
stroke(255);
line(10+(i*20), 200-100+(n*10)+i, 20+(i*20), 200-100+(n*10)+i);
}
}
for(var n = 0; n < 5; n++) {
for(var i = 0; i < 10; i++) {
stroke(105, 154, 201);
line(7+(i*20), 203-100+(n*10)+i, 17+(i*20), 203-100+(n*10)+i);
}
}
for(var n = 0; n < 5; n++) {
for(var i = 0; i < 10; i++) {
stroke(146, 171, 238);
line(15+(i*20), 206-100+(n*10)+i, 25+(i*20), 206-100+(n*10)+i);
}
}
for(var n = 0; n < 5; n++) {
for(var i = 0; i < 10; i++) {
stroke(29, 66, 124);
line(20+(i*20), 200-100+(n*12)+i, 30+(i*20), 200-100+(n*12)+i);
}
}
//upper spiral
push();
translate(220, 190);
for(var i = 0; i < 12; i++) {
stroke(255);
rotate(-.25);
for(var n = 0; n < 5; n++) {
line(20+(i*.3), 30+(n*12), 30+(i*.3), 30+(n*12));
}
}
pop();
push();
translate(220, 190);
for(var i = 0; i < 12; i++) {
stroke(105, 154, 201);
rotate(-.25);
for(var n = 0; n < 5; n++) {
line(16+(i*.3), 33+(n*12), 26+(i*.3), 33+(n*12));
}
}
pop();
push();
translate(220, 190);
for(var i = 0; i < 12; i++) {
stroke(146, 171, 238)
rotate(-.25);
for(var n = 0; n < 5; n++) {
line(22+(i*.3), 25+(n*12), 32+(i*.3), 25+(n*12));
}
}
pop();
push();
translate(220, 190);
for(var i = 0; i < 12; i++) {
stroke(29, 66, 124);
rotate(-.25);
for(var n = 0; n < 5; n++) {
line(24+(i*.3), 32+(n*12), 34+(i*.3), 32+(n*12));
}
}
pop();
//lower spiral
push();
translate(280, 220);
for(var i = 0; i < 13; i++) {
stroke(255);
rotate(.25);
for(var n = 0; n < 5; n++) {
line(20+(i*.4), 30+(n*12), 30+(i*.4), 30+(n*12));
}
}
pop();
push();
translate(280, 220);
for(var i = 0; i < 13; i++) {
stroke(105, 154, 201);
rotate(.25);
for(var n = 0; n < 5; n++) {
line(23+(i*.4), 33+(n*12), 33+(i*.4), 33+(n*12));
}
}
pop();
push();
translate(280, 220);
for(var i = 0; i < 12; i++) {
stroke(146, 171, 238);
rotate(.25);
for(var n = 0; n < 5; n++) {
line(16+(i*.4), 27+(n*12), 26+(i*.4), 27+(n*12));
}
}
pop();
push();
translate(280, 220);
for(var i = 0; i < 13; i++) {
stroke(29, 66, 124);
rotate(.25);
for(var n = 0; n < 5; n++) {
line(25+(i*.4), 23+(n*12), 35+(i*.4), 23+(n*12));
}
}
pop();
}
//draws the starts in the background
function stars() {
translate(350, 220);
push();
for(var i = 0; i < 30; i++) {
stroke(255);
rotate(.25);
for(var n = 0; n < 4; n++) {
line(25+(i*.1), 0+(n*10), 30+(i*.1), 0+(n*10));
}
}
pop();
//draws the center of stars (yellow)
noStroke();
fill(250, 226, 140);
ellipse(0, 0, 40, 40);
}