Looking out the Window

I’ve been playing around with using face tracking to help make images/renderings of spaces on a computer screen seem more realistic because of the way that they’re responsive to the position of our eyes. I think this would be an interesting thing to play with for websites. I have a bit more work to make it seem more realistic but I’m getting there. It may help to separate the background into additional layers. The code is below:

import oscP5.*; OscP5 oscP5;
//PVector posePosition = new PVector();
float posePositionX;
float posePositionY;
float poseScale;


PImage interior;
PImage exterior;

void setup() {
  size(1000,667);
  oscP5 = new OscP5(this, 8338);
  oscP5.plug(this, "posePosition", "/pose/position");
  oscP5.plug(this, "poseScale", "/pose/scale");
  interior = loadImage("interior.png");
  exterior = loadImage("exterior2.jpg");
  imageMode(CENTER);
}


void draw() {
 translate(width/2, height/2);
  
 float exteriorScale = map(poseScale, 6.5, 1, .7, 1);
 float exteriorMoveScale = map(poseScale, 6.5, 1, 6, .5);
 float interiorScale = map(poseScale, 6.5, 1, 1.5, 1);
 interiorScale = max(1, interiorScale);
 
 float exteriorImagePosX = map(posePositionX, 60, 586, 50 * exteriorMoveScale, -50 * exteriorMoveScale);
 float exteriorImagePosY = 30 -  map(posePositionY, 60, 370, 50 * exteriorMoveScale, -50 * exteriorMoveScale);

 image(exterior, exteriorImagePosX, exteriorImagePosY, exterior.width * exteriorScale, exterior.height * exteriorScale); 
 image(interior, 0, 0, interior.width * interiorScale, interior.height * interiorScale);
}

public void posePosition(float x, float y) {
  posePositionX = x;
  posePositionY = y;
}

public void poseScale(float s) {
  poseScale = s;
  println(s);
}