Stefanie Suk – Project 11- Landscape

sketch

//Stefanie Suk
//15-104 D
//ssuk@andrew.cmu.edu
//Project-11-Landscape

let car = [];
let num = 10; //number of cars

function setup() {
  createCanvas(400, 400);

  for (let i = 0; i < num; i++) {
    car[i] = new Car(random(height),
      random(width),
      color(random(255), random(255), random(255)), //color of car
      random(1, 7), //car speed
      random(10, 100) //car size
    );
    print(car[i]);
  }

}

function draw() {
  background(0, 41, 58);

  fill(241, 244, 15);
  ellipse(300, 50, 5, 5);
  ellipse(270, 74, 5, 5);
  ellipse(130, 50, 5, 5);
  ellipse(20, 80, 5, 5);
  ellipse(360, 100, 5, 5);
  ellipse(70, 160, 5, 5);
  ellipse(230, 140, 5, 5);
  ellipse(330, 170, 5, 5);
  ellipse(180, 230, 5, 5); //stars 

  fill(200);
  rect(0, 300, 400, 30);
  fill(200);
  rect(0, 290, 400, 3);
  fill(200);
  rect(80, 70, 30, 330);
  fill(200);
  rect(320, 70, 30, 330);
  stroke(200);
  strokeWeight(5);
  line(95, 90, 215, 315)
  stroke(200);
  strokeWeight(5);
  line(95, 90, 0, 275)
  stroke(200);
  strokeWeight(5);
  line(335, 90, 215, 315);
  stroke(200);
  strokeWeight(5);
  line(335, 90, 400, 220); //bridge


  for (let i = 0; i < 10; i++) {
    car[i].move();
    car[i].display(); //making cars show
  }
}



class Car {
  constructor(x, y, z, s, l) {
    this.x = x;
    this.y = y;
    this.z = z; //color of car
    this.l = l; //length of car
    this.speed = s; //speed
  }
  
  move() {
    this.x = this.speed + this.x; //making cars move
    if (this.x > width) {
      this.x = 0; //where the cars come out
    }
  }

  display() {
    noStroke();
    fill(this.z);
    rect(this.x, 270, this.l, 30, 20); //position of cars moving, adjusting shape of cars 
  }
}

Recently, I went outside with my friends to see the night view of Pittsburgh near downtown. I wanted to create what I saw that day by creating what I think is the most symbolic landscape of Pittsburgh, the yellow bridge. I created an illustration of the yellow bridge and the night sky, and made the cars in different lengths and colors move across the bridge. The yellow bridge and the night sky with stars are static because I wanted to emphasize the movement of the vehicles. The cars are coded to move from left to right in different speeds, lengths, and colors to represent the diversity of vehicles I saw the day I went out.