Recipe for a spatial-photo experiment
Reading time: 3 minutes
Ingredients: one photo, a depth map, a WebGL canvas, and a little curiosity
Difficulty: 🟡🟡⚪⚪⚪
Complexity drill-down:
- 🟡 Load an image and let the browser prepare a depth scene
- 🟡 Tune depth, parallax, blur, focus, and camera motion until the photo feels dimensional
- ⚪ Use the matte tools when foreground and background need cleaner separation
- ⚪ Export the result as a shareable visual or keep tweaking inside the app
- ⚪ Reward: a static image that starts to feel like a small world
I built AetherDepth because I got a bit obsessed with Apple’s spatial photo effect as soon as I tried it. I started applying it to almost every picture I could, and after the initial “this is cool” phase, I ended up asking myself a question: could I recreate a similar feeling as a one-page web app?
That question stuck with me. I was not trying to copy Apple’s implementation exactly. What interested me was the feeling of taking a flat image and turning it into something with a little depth, a little motion, and a little more presence than a normal photograph. Apple’s spatial media and newer spatial scene experiences are built around adding depth and movement to photos, and that same sense of layered motion is what pushed me toward this experiment.
The idea gradually became AetherDepth: a small browser app that turns a single image into an interactive depth scene. You drop in a photo, shape the parallax effect, adjust the depth response, and push the image toward something that feels less like a file and more like a small moving composition. Depth-map-based parallax on the web follows that same basic logic: the image is paired with depth information so nearer and farther areas can shift at different rates.
The App
AetherDepth lives in my growing collection of small, self-contained browser tools. I like building apps that do one thing clearly, stay easy to open, and let you start experimenting without installation friction or account ceremony.
If the embed feels cramped on your device, open the full-page version here: https://viscioletti.com/apps/media/aetherdepth
Why I Built It
What I really wanted was not just a fake 3D filter. I wanted to make a photo feel alive in the browser, and I wanted the output to be useful beyond the preview itself.
That meant building something that could work in two modes:
- as an interactive HTML experience where you can move through the effect and tune it by hand
- as a way to generate a short looping visual that feels closer to a tiny art piece than a static image
That second part mattered a lot to me. Some pictures do not need a huge transformation to become interesting. A slight shift in perspective, a bit of depth, and a restrained loop can be enough to turn an ordinary image into something more atmospheric.
What You Can Try
Some images work better than others. Photos with a clear foreground, a readable subject, and some separation between near and far elements usually give the nicest results, which lines up with Apple’s own guidance for capturing spatial media with visible foreground, midground, and background layers.
Once an image is loaded, you can play with:
- Depth strength: how much separation you want between nearer and farther parts of the image
- Parallax motion: how reactive the scene feels when the camera or pointer moves
- Focus and blur: how much atmosphere and depth-of-field styling you want to introduce
- Matte tools: when the automatic separation needs help around a foreground edge
- Export options: when you want to keep the result as a looping visual or a shareable output
The nicest results usually come from being subtle. Too much movement makes the trick obvious; just enough movement makes the image feel strangely present.
A Note On Privacy
I kept AetherDepth as a self-contained browser tool on purpose. There is no account flow, no saved project system, and no extra ceremony around trying it.
That lightweight approach also keeps experimentation fast. You can open it, test an image, tweak the scene, export something, and move on.
Try It
AetherDepth is now part of the Apps section on my site, alongside the other small tools I build for experimentation, writing, and learning.
- Use it on the site: https://viscioletti.com/apps/media/aetherdepth
- Browse the app collection: https://viscioletti.com/apps.html
Star The Repo
AetherDepth is part of my broader collection of single-page web apps. If you enjoy these little experiments, consider starring the repo so more people can find it.