For my Drawing Machine Assignment I must admit I diverted completely from my previous drafts to make something entirely different but something I am very happy with. For this I combined my love for digital art with various instances of code in order to make a scrolling scene of sorts. I drew two images of a winged cat in my drawing program and saved them as png files to be uploaded into the Processing folder. I then created two separate backgrounds for my scene using the background fill and a large rectangle across the bottom. I also imported some hand drawn images of clouds and set them on a loop to travel across the sky. I used a “for” loop in order to create a mood for my nighttime scene as admittedly I didn’t understand for loops very well but needed to have it included, and using a blue fill I was able to make a moon. Lastly, I wanted the change between night and day to also change which drawing of the cat was shown, so using an if statement, I made it so the nighttime scene completely covered the day time scene and included the png of the second iteration of the cat, denoted as “Laufey2.” In order to ensure both images of the cat were in the same place regardless of what part of the loop they were in, I set both images to follow the mouseX coordinate so they would always appear in the same place even when being switched between. All in all I am very proud of the outcome, it reminds me of a side scrolling video game and that was the intention!

 

Code:

float x = 0;
float y = 100;
float x2 = 600;
float y2 = 50;
float speed = 2;
PImage Laufey1;
PImage Laufey2;
PImage Clouds1;
PImage Clouds2;

void setup() {
size(1200, 600);
Laufey1 = loadImage(“laufey 1.png”);
Laufey2 = loadImage(“laufey 2.png”);
Clouds1 = loadImage(“clouds 1.png”);
Clouds2 = loadImage(“clouds 2.png”);
}

void draw() {
background(#83E3FF);
noStroke();
fill(#2CE8A5);
rect(0, 360, 1200, 300);
move();
display();

if (keyPressed) {
background(#04163B);
noStroke();
fill(#097170);
rect(0, 360, 1200, 300);
image(Laufey2,mouseX, 190);
for (int s = 100; s > 0; s = s – 10) {
fill(255 – s, 255 – s, 255);
ellipse(50,50,s+50, s+50);
}
}
}
void move() {
x = x + speed;
if (x > width) {
x = 0;
}
x2 = x2 +speed;
if (x2 > width){
x2= 0;
}
}

void display() {
image(Clouds1, x, y);
image(Clouds2, x2, y2);
image(Laufey1, mouseX, 160);
}

void keyPressed() {
if (key == ‘s’) {
saveFrame(“drawing-####.png”);
}
}