Metropolis Loop Art

I had a hard time settling down on an idea for this week’s assignment. The main objective of the week was to create artwork using the loops for() or while(). I ended up working on something that was miles away from my initial idea. Initially, I was inspired by the work Rainbow’s Egg by Colin Emmett and as I worked on recreating that work, I ended up creating an animation with circles in an attempt to mimic a snake.

The movement of the circles pushed me to work on something based on them and I began getting more ideas for it in terms of colors, positions, and shapes with loops as opposed to my idea of recreating the Rainbow’s Egg. I was more inspired by this which was a definite indication for me to start afresh with this idea.

I wanted to work with loops not only to make multiple shapes and animate them but on color as well to achieve a sort of gradient. When thinking of gradients from real life, the first thing that came to mind was the sunsets at NYU Abu Dhabi. In order to recreate it, I looked into the RGB codes of red, yellow, and orange and looked at how the codes change amongst these colors in order to change variables in the loop to achieve the gradient. Here were my first attempts trying to get a sunset-like gradient. I wanted to check out how the output would look without a stroke and I was able to achieve a very subtle shading of the sky and I was very happy with this result:

I played a lot with colors here and I got to see how easily colors change the mood of a work. Here are some examples:

After this, I thought of expanding my canvas and perhaps draw a cityscape and waters. I also dabbled into making an oceanic scene with a more darker-blue shade gradient. I put in some star-like objects which I had made when I was making the Rainbow’s Egg sketch. The colors I used for the stars varied in shades of greyish-white and I used random() to get the position to achieve a twinkle effect.

With so many ideas and sceneries in my mind, I settled on creating a cityscape and I was heavily inspired by the movie, Metropolis (1927). For what is it, some of the visuals and elements portrayed in the movie were very captivating to me and so, I decided to work with a cityscape with the colors achieving a reddish gradient, to paint some darker emotions. Then for creating a multitude of buildings of all sizes and shapes, I used loops and random() and the colors: yellow and black. Inspired by the seascape art I made earlier, I put in a mirror image of the cityscape but with tones of black and white. I put in stars as well. Finally, I used loops to create some arcs to portray some birds :))

Visuals from Metropolis (1927)

On the whole, I see the work as the two shades of the city – day and night, but I also interpret this as the underground city against the colossal buildings in Metropolis with the underground city stripped of all shades and tones of colors and working around the heavy, massive structures of the skyscrapers in the city, but with no light, just darkness. Here’s a video showing the final piece.

Screenshot of the final work


I’m very happy with how it turnt out, I love looking at it and seeing the shapes and colors. The more I look at it, different interpretations keep popping up in my head and I love that about this piece! Documenting this was pretty interesting because for this work, I hadn’t started off with a concrete idea but rather, I kept experimenting and I stuck to elements that were appealing, and over time, this work came to be. Here’s the code:

int offset = 30;

void setup() {
  size(680, 780);

void draw() {
  background(0, 0, 0);


void sky() {
  for (int i=0; i<height/2; i++) {
    for (int j=0; j<50; j++) {
      fill(i, i*0.2, 0);
      circle((5+random(24)+20*j), (i+random(24)), 50);

void stars() {
  for (int i=0; i<10; i++) {
    ellipse(random(width), height/2+random(height/2), 5, 5);
    ellipse(random(width), height/2+random(height/2), 5, 5);
    ellipse(random(width), height/2+random(height/2), 5, 5);

void buildings() {
  for (int i =0; i<width; i++) {
    rect(i, height/2-random(100)+100, random(100), random(100));
    stroke(255, 255, 0);
    rect(i, height/2-100-random(100)+100, random(50), random(100));
  for (int i =0; i<width; i+=10) {
    rect(i+random(40), height/2-100+random(40), random(100), random(100));
    rect(i+random(40), height/2+100+random(40), random(50), random(100));

void birds() {
  for (int i =0; i<width; i+=10) {
    arc(i+random(40), height/3-random(100), i, 40, radians(0), radians(45));


One thought on “Metropolis Loop Art”

  1. Just wanted to say that I noticed and appreciated the Tangled reference! :p And the art is really cool, I had to watch Metropolis for a class and it was very fascinating!

Leave a Reply