[icm week 9] Swipe (capture & CLM tracker)

Screenshot 2015-11-04 22.42.43

(TLDR: See my Swipe sketch from this week here.)

I did something pretty simple this week. It’s just a part I decided to add to my Tinder Robot project, which I will likely also make my ICM final. The purpose of this sketch was mostly to test if I could use facial emotion reading as one of my sensor inputs for my robot.

I built this sketch in P5 off of the emotion reading CLM Tracker example, the libraries of which are quite dauntingly complex:

Screenshot 2015-11-04 23.02.18

…but I guess that’s why we use libraries rather than make everything from scratch.

Keeping with the idea of my Tinder robot, I wanted to use facial tracking/emotion reading as one of the sensors that would determine whether or not the robot would swipe left or right.

What this means for this sketch was that if the user was making an expressive face (indicating strong emotions), it would swipe right. If the user was not making an expressive face (indicating ambivalence), it would swipe left.

The way I determined whether or not the user was making an expressive face was by adding up all the values the tracker gave for each emotion it detected. The higher the value, the more of that emotion you’re expressing. This should mean that a high total value indicates a strong emotional reaction.

Screenshot 2015-11-04 22.42.54

I’m satisfied that the general concept of the sketch works, but it’s really just the bare minimum of what I have to do, so I’m considering this one just as an initial test.

Check it out here. My sketch code is below.

var ctracker;
var emotionData;
var ec;
var clr;
var sum = 0;
var swipePosition;
var eyePositionL;
var eyePositionR;

function preload() {
  heart = loadImage('assets/heart.png');
}

function setup() {
  // setup camera capture
  var videoInput = createCapture(VIDEO);
  videoInput.size(200, 150);
  videoInput.position(0, 0);


  // setup canvas
  var cnv = createCanvas(windowWidth, windowHeight);
  cnv.position(0, 0);

  // setup tracker
  ctracker = new clm.tracker();
  ctracker.init(pModel);
  ctracker.start(videoInput.elt);


  ec = new emotionClassifier();
  ec.init(emotionModel);
  emotionData = ec.getBlank();
  textFont("Courier New");
}

function drawBot(xL, yL, xR, yR, xRect, yRect, wRect, hRect, eyeSize, pupilSize) {
  fill(80);
  rect(xRect, yRect, wRect, hRect);
  fill(255);
  ellipse(xL, yL, eyeSize, eyeSize);
  ellipse(xR, yR, eyeSize, eyeSize);
  fill(0);
  ellipse(eyePositionL, yL, pupilSize, pupilSize);
  ellipse(eyePositionR, yR, pupilSize, pupilSize)

  strokeWeight(5);
  line(windowWidth / 2, 100, windowWidth / 2, 30);
  imageMode(CENTER);
  heart.resize(50, 50);
  image(heart, windowWidth / 2, 30);

  textSize(15);
  text("change your expression", 0, 160);
  text("and see what happens", 0, 170);

}

function swipeRight() {
  //changes ball color to green and moves ball right
  clr = color(0, 255, 0, 120);
  swipePosition = 5 * windowWidth / 6;
  
  //eyes look right
  eyePositionL = windowWidth / 2 - 150;
  eyePositionR = windowWidth / 2 + 250;
  
  //ball and text
  fill(0);
  textSize(15);
  textAlign(LEFT);
  text("woah!!!", swipePosition - 50, 180);
  text("swipe right!", swipePosition - 50, 200);

  //hearts on eyes
  image(heart, eyePositionL, 200, 20, 20);
  image(heart, eyePositionR, 200, 20, 20);

  //smiley face
  strokeWeight(6);
  noFill();
  arc(windowWidth / 2, 350, 300, 200, TWO_PI, PI, OPEN);
  strokeWeight(10);
  line(3 * windowWidth / 4, 400, 3 * windowWidth / 4 + 150, 300);

}

function swipeLeft() {
  //changes ball color to red and moves ball left
  clr = color(255, 0, 0, 120);
  swipePosition = windowWidth / 6;
  
  //eyes look left
  eyePositionL = windowWidth / 2 - 250;
  eyePositionR = windowWidth / 2 + 150;
  
  //ball and text
  fill(0);
  textSize(15);
  textAlign(LEFT);
  text("mehh...", swipePosition - 50, 180);
  text("swipe left!", swipePosition - 50, 200);

  //frowny face
  strokeWeight(6);
  noFill();
  arc(windowWidth / 2, 450, 300, 200, PI, TWO_PI, OPEN);
  strokeWeight(10);
  line(windowWidth / 4, 400, windowWidth / 4 - 150, 300);
}

function draw() {
  clear();
  
  drawBot(windowWidth / 2 - 200, 200, windowWidth / 2 + 200, 200, windowWidth / 4, 100, windowWidth / 2, 400, 150, 50);
  imageMode(CENTER);
  textAlign(CENTER);
  textSize(100);
  text("~true love tinder bot~", windowWidth / 2, 600);

  var cp = ctracker.getCurrentParameters();
  var er = ec.meanPredict(cp);


//if the sum of the values is high, the user is making an expressive face.
//therefore, swipe right.
//if the sum of the the values is low, the user is not making an expressive face.
//therefore, swipe left.

  for (var i = 0; i < er.length; i++) {
    sum = er[0].value + er[1].value + er[2].value + er[3].value + er[4].value + er[5].value;
    print(sum);
    if (sum >= 1.6 || er[5].value >= 0.8) { 
      swipeRight();
    } else { 
      swipeLeft();
    }
    fill(clr);
  }
  
    
  noStroke();
  ellipse(swipePosition, 200, 120, 120);
}

 

 

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

%d bloggers like this: