Depth-Viewport: A Headset-Free 2D to 3D Web App Demo
Live Demo & Source Code
🔗 Live web app / demo: depth-viewport.netlify.app
💾 Source code: github.com/joshuatz/depth-viewport
Project Overview / Elevator Pitch
From the README: A 100% client-side web app that transforms 2D images into interactive 3D parallax viewports using in-browser ML depth estimation and Three.js. Use your mouse, face, or gyroscope / phone position to control!
Depth Viewport is a fun (in my opinion) prototype web app that lets you interactively experience 2D->3D depth map generation and presentation. With the goal being the experience of looking through a virtual viewport into a 3D space, without requiring a VR headset, special tracking hardware , or anything other than a standard display and webcam or smartphone.
It is far easier to show what this means than describe it, so I recommend either checking out the live web app yourself, or watching the short demo video below:
Additional Background
I made this because it is something that has been in the back of my head for a while as something I would love to see, but every time that I went searching for an existing version of it, I came up short. Which was surprising to me, given that the technology is all there - it just seems like no one was really putting the pieces (depth inference, face tracking, WASM) together in one single demo.
Of course, after posting this, I’m sure I will stumble across a nearly identical project ¯_(ツ)_/¯
That isn’t to say that the concept is uniquely mine; far from it! As someone a bit obsessed with VR/AR, I am familiar with a number of projects in this domain (headset-free stereoscopic displays, aka Autostereoscopy) that are far more impressive and novel than what I threw together here.
For starters, back in high school, I remember coming across the work of Johnny Chung Lee and being absolutely blown away by his project that reused inexpensive wiimotes as positional tracking devices. This demo from 2007 still hits hard in 2026:
Side note: Johnny Lee also pioneered using wiimotes as positional trackers to emulate expensive educational interactive classroom whiteboards (aka “SMART Boards”). I myself used his work to set up a SMART board clone for my mom - an elementary school teacher - and I remember it working great at the time.
There was another project a bit later, winscape, that used Kinect sensors (another great piece of consumer video game hardware embraced by hackers to be given new life as input devices) to create virtual windows:
And using a device’s built-in webcam for cheap head tracking and 3D view control is not a new idea either; for example, see this EHCI (Engineering Human-Computer Interaction group) iPad demo from 2011 (an app they called i3D):
As you might be able to guess, a substantial limitation with all these projects that use standard displays, including my own project, is that they don’t work with more than one viewer at a time.
Technology like voxel / volumetric displays are the obvious solution - a true 3D display - but that is a very tough nut to crack in a way that has any chance of being affordable for the average consumer.
A final and much more recent find that I will leave you with is an exciting approach that kind of blends a volumetric display with parallax viewing - usually referred to as Light Field Displays. I’m vastly oversimplifying here, but they kind of remind me of old-school lenticular printed displays (think fast food promotional material, I think sometime around the 90s?) in how they work - multiple angled views are rendered at the same time - physically - enabling glasses/headset-free 3D, for multiple viewers in different positions, simultaneously.
This might seem like unobtainable science-fiction, but I’m very excited by companies like Looking Glass, which already have manufactured these types of displays at a price point that is affordable not just for businesses, but also for consumers (well, at least a magnitude more affordable than prior tech).
