As computing becomes more ubiquitous in our objects, designers need to be more aware of how to design meaningful interactions into electronically enhanced objects. At the University of Washington, a class of junior Interaction Design majors is exploring this question. These pages chronicle their efforts.

Sunday, April 3, 2016

Maureen M: Processing 1

For our first assignment, "messing around in Processing" I worked on the Scale example.

The original code for Scale is:

/**
 * Scale
 * by Denis Grutze.
 *
 * Paramenters for the scale() function are values specified
 * as decimal percentages. For example, the method call scale(2.0)
 * will increase the dimension of the shape by 200 percent.
 * Objects always scale from the origin.
 */

float a = 0.0;
float s = 0.0;

void setup() {
  size(640, 360);
  noStroke();
  rectMode(CENTER);
  frameRate(30);
}

void draw() {

  background(102);

  a = a + 0.04;
  s = cos(a)*2;

  translate(width/2, height/2);
  scale(s);
  fill(51);
  rect(0, 0, 50, 50);

  translate(75, 0);
  fill(255);
  scale(s);
  rect(0, 0, 50, 50);    
}






For my version of Scale, I changed the colors, screen dimensions, speed of the square's movement, size of the squares and the angle of the cos (from 2 to 3).
Here is the new code:

/**
 * Scale
 * by Denis Grutzw with edits by Maureen McLennon
 *
 * Paramenters for the scale() function are values specified
 * as decimal percentages. For example, the method call scale(2.0)
 * will increase the dimension of the shape by 200 percent.
 * Objects always scale from the origin.
 */

float a = 0.0;
float s = 0.0;

void setup() {
  size(500, 500);
  noStroke();
  rectMode(CENTER);
  frameRate(25);
}

void draw() {

  background(255,99,71);

  a = a + 0.04;
  s = cos(a)*3;

  translate(width/2, height/2);
  scale(s);
  fill(255,160,122);
  rect(0, 0, 50, 50);

  translate(75, 0);
  fill(255,69,0);
  scale(s);
  rect(0, 0, 50, 50);    
}



No comments:

Post a Comment