Week 3 – train tracks

Concept:

For this assignment, I wanted to portray train tracks. I don’t know what it is about trains, but I have been fond of them ever since I was a little girl.  I decided to combine the concept of OOP and arrays with my love for trains to create the piece. I used two classes to define the train cars and the tracks and used arrays to store the instances created. The speed of the trains is randomized to have a visually pleasing image of trains moving in different directions at different speeds.

When the mouse is clicked, the screen is paused for 1 second and then the trains start moving again. I also added another functionality so that when a key is pressed the day changes into night.

A highlight I’m proud of:

I am proud of the way I got to make the trains move in alternating directions by creating a variable that stores either 1 or -1 and depending on the value, the direction of motion is set.

move(direction) {

  if(direction == 1){
      this.x = this.x + this.xspeed * this.xdirection;
      this.y = this.y + this.yspeed * this.ydirection;
  }else{if(direction == -1){
          this.x = this.x - this.xspeed * this.xdirection;
          this.y = this.y + this.yspeed * this.ydirection;
  }
    
  }

Reflection and ideas for future work or improvements:

For future work, i would like to work on creatively coming up with more visually and aesthetically pleasing art works. I would also like to include more advanced interactivity elements within my artwork.

Reference:

setTimeout() functionality: https://www.w3schools.com/jsref/met_win_settimeout.asp