Recitation 7: Functions and Arrays

Part 1

屏幕录制2022-04-13 下午4.55.23

void setup() {
  size(800, 800);
}
void draw() {
  int a = millis()/1000;
  if (a%2==0) {
    background(178, 247, 252);
  } else {
    background(150, 232, 150);
  }  

  for (int i = 50; i < 800; i+=100) {
    for (int j = 50; j < 800; j+=100) {
      noStroke();
      if (a%2==0) {
        fill(255, 203, 232);
      } else {
        fill(255, 251, 118);
      }
      ellipse(i, j, 100, 20);
      ellipse(i, j, 20, 100);
      fill(255);
      circle(i, j, 18);
    }
  }
}

Part 2

step1

屏幕录制2022-04-13 下午8.54.45

//local variable
int n = 10;
float[] x = new float[n];
float[] y = new float[n];
float[] c = new float[n*n];

void setup() {

  size(800, 800);
  for (int i = 0; i < n; i++) {
    for (int j = 0; j < n; j++) { //nested loop
      //Fill the arrays with values for the positions and colors
      x[i] = 100*i + 50;
      y[j] = 100*j + 50;
      c[i+n*j] = random(0, 255);
    }
  }
}


void draw() {
  int a = millis()/1000;
  if (a%2==0) {
    background(178, c[0], 252);
  } else {
    background(c[0], 247, 150);
  }

  for (int i = 0; i < n; i++) {
    for (int j = 0; j < n; j++) {

    
      noStroke();
      if (a%2==0) {
        fill(c[i+n*j], c[i+n*j], 232);
      } else {
        fill(255, 251, c[i+n*j]);
      }
      ellipse(x[i], y[j], 100, 20);
      ellipse(x[i], y[j], 20, 100);
      fill(255);
      circle(x[i], y[j], 18);


    }
  }
}

step2

屏幕录制2022-04-13 下午8.50.52

//local variable
int n = 10;
float[] x = new float[n];
float[] y = new float[n];
float[] c = new float[n*n];

void setup() {

  size(800, 800);
  for (int i = 0; i < n; i++) {
    for (int j = 0; j < n; j++) { //nested loop
      //Fill the arrays with values for the positions and colors
      x[i] = 100*i + 50;
      y[j] = 100*j + 50;
      c[i+n*j] = random(0, 255);
    }
  }
}


void draw() {
  int a = millis()/1000;
  if (a%2==0) {
    background(178, c[0], 252);
  } else {
    background(c[0], 247, 150);
  }

  for (int i = 0; i < n; i++) {
    for (int j = 0; j < n; j++) {

      pushMatrix(); //store the new coordinate system
      translate(x[i], y[j]);
      rotate(frameCount/400.0);

      noStroke();
      if (a%2==0) {
        fill(c[i+n*j], c[i+n*j], 232);
      } else {
        fill(255, 251, c[i+n*j]);
      }
      ellipse(0, 0, 100, 20);
      ellipse(0, 0, 20, 100);
      fill(255);
      circle(0, 0, 18);

      popMatrix(); //restore the coordinate system
    }
  }
}

questions

  • Q1: In the reading “Art, Interaction and Engagement” by Ernest Edmonds, he identifies four situations in an interactive artwork: ‘Static’, ‘Dynamic-Passive’, ‘Dynamic-Interactive’ and ‘Dynamic-Interactive(Varying)’. From the exercise you did today which situations do you identify in every part you executed? Explain.

I think both of the parts were dynamic-passive. In part one, the color of the graphic could change according to the time change. And in part two, not only does the color change, but the combination of ellipses and circles also rotates around their center. However, none of them can be influenced by the audience.

  • Q2: What is the benefit of using arrays? How might you use arrays in a potential project?

I think arrays can store a lot of variables. With the help of for loop, it can present a series of variables that fit certain regulations. Even if there is no for loop, it can also present some variables that have something in common. And I think there are at least two advantages that are easy to find but very helpful. Firstly, it can save space and make the code look clearer, which may help avoid some mistakes. Secondly, it can function as a kind of mark, so it can be used to represent things that have something in common. For example, if there are two different graphics in the same project and each of them should use many different variables, maybe we can set an array []A and use A[0], A[1] as variables in the first graphic and set array []B and use B[0], B[1] as variables in the second graphic.

And these two advantages are also two ways that I may use arrays. I can use it to present a lot of variables, or I may use it to classify the variables. 

Leave a Reply

Your email address will not be published. Required fields are marked *