Interactive Environment

The brief was to create a digital interactive environment that used input to update events within the world that we create. The initial attempt was to create a night landscape containing a road and to convey a sense of motion by animating the stripes on the road, making them approach the user. Creating an alpha channel circle that represented light landing on the road and the ground was useful and attaching the size of the circle to the placement on the y axis allowed the user to make the light bigger and smaller and added a little to the sense of depth.

Creating the motion was a much more difficult challenge, though as an exercise it was very instructive and helped me learn several lessons on order and function implementation. The plan was to animate the stripes on the road and make them approach the user. Creating a road that covered a section of stripes that converge at the horizon was one solution that simplified the movement. Adding a stoplight that reacts to the mouse was an attempt at giving the user an idea of how to interact with the space – when you click the light changes to green (and the hope was that the forward movement would occur, but that is still in process and to be completed).

void setup() {
  size(1000, 1000);
  noStroke();
}

void draw() {
  float x = mouseX;
  float y = mouseY;
  background(10, 16,90);
   if (mousePressed == true) {
    fill(#66ED1F); //Green
  } else {
    fill(#ED301F); // Red
  }
  ellipse(600, 235, 30, 30);
  fill(255, 50);
  // road
    quad(380,200, 520, 200, 900, 1000, 100, 1000);
    // lines
        quad(445,200, 448, 200,450, 220, 444,  220);
        quad(444,240, 450, 240, 452, 260, 446,260);
        quad(446,280, 452, 280,456, 310 , 446, 310);
        quad(446,330, 456, 330,460, 360 , 446, 360);
        quad(442,390, 458, 390,460, 440 , 440, 440);
        quad(440,480, 460,480, 465,600, 438,600);
        quad(438,650, 465,650, 485,800, 440,800);

// Movement of lines effext
  fill(255, 30);
rect(380,0, 120,100);
rect(380,100, 120,200);
rect(380,200, 120,300);
rect(380,300, 120,400);
rect(380,400, 120,500);
rect(380,500, 120,600);
rect(380,600, 120,700);
rect(380,700, 120,110);
rect(380,800, 120,110);
rect(380,900, 120,110);

        //Road hide
        fill(50);
        quad(448,200, 525,200, 900,1000, 480,1000);
        quad(380,200, 440,200, 440,1000, 100,1000);
// light
  fill(255, 50);
  ellipse(x, 300, y, y);
          // horizon
           fill(10, 16,110);
    rect(0,0,1000,200);



}