# How do I create an erasing effect with Kinect?

**URL:** https://discourse.processing.org/t/how-do-i-create-an-erasing-effect-with-kinect/12828
**Category:** Libraries
**Created:** [July 19, 2019, 5:58pm UTC](https://discourse.processing.org/t/how-do-i-create-an-erasing-effect-with-kinect/12828 "2019-07-19T17:58:44Z")
**Posts on this page:** 2
**Page:** 1

<div class="post-metadata">

### Author: ![AxeFire](https://avatars.discourse-cdn.com/v4/letter/a/b77776/32.png) [@AxeFire](https://discourse.processing.org/u/AxeFire)
#### Post date: [July 19, 2019, 5:58pm UTC](https://discourse.processing.org/t/how-do-i-create-an-erasing-effect-with-kinect/12828/1 "2019-07-19T17:58:44Z")

</div>

I am trying to create an erasing effect of where the top image will be erased away to reveal another image below. I am using Kinect to control the erasing effect, however it is currently just drawing an ellipse on the top image as seen in this screenshot.

How should I modify the ellipse path as seen in green into an erasing effect to reveal the hidden image? Should ellipse be replaced or is there a way to make ellipse reveal the other image (moonSurface.png)

I am using OpenKinect AveragePointTracking source code.

This is my first time playing around with Processing so I apologies if the code is messy.

 ![Capture](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/e/e3c0472bb3bb7c85eaeca87b9781338f0c2de151.png)

```auto
import org.openkinect.freenect.*;
import org.openkinect.processing.*;
// The kinect stuff is happening in another class
KinectTracker tracker;
Kinect kinect;

PImage moonDirt, moonSurface;

void setup() {
  size(640, 520);
  kinect = new Kinect(this);
  tracker = new KinectTracker();
  moonDirt = loadImage("moonDirt.png");
  moonSurface = loadImage("moonSurface.png");
  image(moonDirt,0,0);
  

}

void draw() {

  tracker.track();

  PVector v1 = tracker.getPos();
  fill(50, 100, 50, 200);
  noStroke();
  ellipse(v1.x, v1.y, 50, 50);

  

  PVector v2 = tracker.getLerpedPos();
  fill(50, 100, 50, 200);
  noStroke();
  ellipse(v2.x, v2.y, 50, 50);
  
  

  int t = tracker.getThreshold();
  fill(0);
  text("threshold: " + t + " " + "framerate: " + int(frameRate) + " " + 
  "UP increase threshold, DOWN decrease threshold", 10, 500);
}

// Adjust the threshold with key presses
void keyPressed() {
  int t = tracker.getThreshold();
  if (key == CODED) {
    if (keyCode == UP) {
      t+=5;
      tracker.setThreshold(t);
    } else if (keyCode == DOWN) {
      t-=5;
      tracker.setThreshold(t);
    }
  }
}

```

---

<div class="post-metadata">

### Author: ![tony](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/tony/32/949_2.png) [@tony](https://discourse.processing.org/u/tony)
#### Post date: [July 19, 2019, 8:27pm UTC](https://discourse.processing.org/t/how-do-i-create-an-erasing-effect-with-kinect/12828/2 "2019-07-19T20:27:53Z")

</div>

Welcome to the forums!

Why don’t you check out [PGraphic](https://processing.org/reference/PGraphics.html).  
With these, you can create two separate layers - perhaps an “erasable” layer and an image layer.

Let me know how it goes