WindowVR

WindowVR recreates Johnny Chung Lee’s famous Wii Remote head-tracking demo, using nothing but a laptop’s webcam. Move your head and the scene shifts as if your screen were a pane of glass, with targets that look like they float in front of it.

What it does

• Tracks your eyes through the webcam and redraws a 3D room from your exact viewpoint, live in the browser.
• Works out how far away you’re sitting from how far apart your eyes look on camera.
• Detects known Mac screens and webcams automatically, and falls back to adjustable settings on other hardware.
• Tells you when tracking is lost, and holds a sensible resting view instead of jumping around.

How it works

1. Face tracking. MediaPipe’s face landmark model finds the eyes in each webcam frame. The eye point is taken from the eye corners rather than the irises, so looking around doesn’t move it.
2. Distance. The on-camera gap between the eyes, together with the webcam’s field of view and an average real-world eye separation, gives the viewer’s distance from the screen.
3. Smoothing and prediction. A One Euro filter smooths the eye point when you’re still and follows closely when you move fast. Its filtered velocity is used to predict ahead and hide latency.
4. Off-axis projection. Three.js renders the scene with an asymmetric camera frustum built from the eye point and the physical size of the screen. That’s what makes the screen behave like a window instead of a camera that swivels.

No build step and no install: Three.js and MediaPipe load straight from a CDN.