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.

Saturday, October 6, 2018

Processing Experiment: Greeting Mouse Cursor

Greeting Mouse Cursor

For this experiment I chose to play around with the MousePress example where lines are drawn following the cursor and changes colors when the mouse is pressed. Here is the original example:


I was debating between the MousePress example and the Word example so I decided to combine both by having type follow the mouse instead of a shape. Some of the main things I changed were:

  • Having the default shape/string be 'hi' with a bright and friendly background.
  • When mouse is pressed, the string becomes 'bye' with the colors and background changing to be more ominous.
  • Slowing down the frame rate and offsetting the x and y positions by 5 from the mouse position so that the words are legible and seem to "follow" the cursor. 
  • Changing the font to Work Sans medium because that's my favorite font currently.
  • Not having the string print permanently as the cursor moves.
Here is the result: 


This is the code: 

PFont f;


void setup() {
  size(640, 360);
  frameRate(15);
  
  //font
  printArray(PFont.list());
  f = createFont("WorkSans-Medium.ttf", 24);
  textFont(f);
}

void draw() {
  if (mousePressed) {
    background(0);
    fill(247,45,45);
    text("bye", mouseX-5, mouseY-5);
  } else {
    background(45, 210, 247);
    fill(255);
    text("hi", mouseX-5, mouseY-5);
  }
}


No comments:

Post a Comment