Extracting Depth Map Photos for the Looking Glass
Now that we have phones that allow us to take photos with depth maps, it’s never been easier to create compelling 3D content using real world photography. If you saw my recent post about taking an iPhone photo and showcasing it in your Looking Glass as a 3D image, then you already know that the most important aspect of shooting photos for the Looking Glass is making sure that the depth map is clean and clear.
If you haven’t read my iPhone photo blog post yet, I highly recommend checking it out before reading the rest of this post.
One of the coolest things I learned through the process of creating 3D images was how to extract the depth map from my iPhone X photos because it opens up a world of opportunity for experimental 3D art.
You can do quite a bit once you’ve extracted a depth map, but I’d like to go over something first:
Edit the RGB photo without worrying that it will strip the depth data from the image
If you’re a color correcting fiend like me, then you’ll understand why this is cool. Portrait mode on the iPhone doesn’t make perfect photos, even if they do look very professional. I like to use 3rd party applications to color correct and change contrast on my photos, but I haven’t be able to do that without destroying the depth data. You can edit your photos using the iPhone’s edit photo option and still retain depth data, but I find that editing tool limited.
Edit the Depth Map
While I’m not going to go into the nitty gritty of best practices in editing Depth Map photos, I do think that it’s important to note that extracting the depth map of a photo gives you more control over how it images in Masuji’s web tools. As you will see, cleaning your depth map makes a huge difference.
Create EXPERIMENTAL ARTWORK
I hope to inspire everyone that reads this to make some wild images after extracting depth maps.
But let’s start with learning how to do it.
Extracting depth data with Exiftool
1. Create a folder on your desktop and add portrait mode photos with depth maps you want to correct.
You can technically place this folder where you’d like, but you’ll be using the terminal for mac or command for windows in order to navigate to it so I wanted to make this easy for those that aren’t familiar with using command lines on their computers.
2. Visit exiftool and install its software.
The process of installing isn’t cumbersome, but here are more detailed instructions if you need them. Open up the application that you’ve downloaded after install.
3. Open up Command or Terminal
If you’ve never used a command line before, don’t stress. You can do this. On Windows, open a new Command Prompt window. If you’re on Mac, open a Terminal window. Navigate to the folder containing your portrait mode photos (Windows help here and Mac help here).
Once you’re in your folder, run this line, replacing the XXXX with the image number on your portrait photo:
“exiftool -b -MPImage2 IMG_XXXX.jpg > IMG_XXXX_depth.jpg”
When you open your folder on your desktop, you’ll find that a depth image has appeared of the photo you ran the command on.
****I would also like to point out that the Depth Cam iOS app is an option for those who are willing to spend $3.99 to easily extract and mess with depth map photos. It’ll grab depth data from portrait mode photos and also allows you to create depth maps for non-portrait mode photos****
Examining the Depth Map
Understanding Black vs White
For most cases, when you look at a depth map, the furthest parts of the photo should be black and the closest points should be white. So take a moment and look at the photo you extracted a depth map from — is the furthest point in the RGB photo also the blackest point in the depth Map? Is the nearest point also the whitest point in the depth map?
Subject Lines in the Depth Map
An ideal depth map has very clean, smooth differentiation separating the nearer and farther aspects of the photo.
However, depth maps derived from modern phone technology aren’t usually (if at all) this clean, so if you want an optimal 3D image, you’ll have to ascertain where the jagged and unclear boundaries are and edit them.
Re-combining your RGB and Depth map images
Editing a Depth Map pulled from Exiftool
I’m not going to go into too much detail here, but I will mention a couple of things that I find important when editing a depth map in Photoshop. If you use a different editing software, I’m sure that these following suggestions will still be helpful for you.
- Open your RGB image in Photoshop first so that the canvas is set to the size of the photo (make sure you unlock it from being the background layer).
- Pull in the extracted depth map, and resize it to be the same size as your color photo. When exiftool extracts the depth map, its smaller than the image that it is extracted from. When I layer my RGB and depth map on top of one another, it’s also easier for me to see where in the depth map I might need to edit to match the depth in the photo better.
- After you’ve messed with your RGB and depth map images to your liking and you’re ready to view them in the Looking Glass, open up Canvas settings in Photoshop and resize your canvas to double its current width (which should be the width of the RGB image.) If you set the anchor to the middle left point on the grid, you’ll have an easier time aligning the depth image to the right of the RGB image.
^This is very important. Make sure you do this.
Save your RGB Image and Depth Map as one jpg image
View Your New Image in the Looking Glass
Now we should be ready to pull this baby into the Looking Glass. This is a similar process to pulling a iPhone X photo directly into one of Masuji’s web tools, so again I beseech you to read my first post about iPhone portraits in the Looking Glass if you have not already.
If this isn’t your first rodeo with me, then let’s giddy-up.
- Go to StereoPhoto Maker’s Looking Glass Web Tools site.
- Find the link that says 2D+Depth map viewer. Drag the popup window into your Looking Glass and expand the window. It has some sample images under the link that you can take a look at and drag and drop in to test.
3. Drag and drop your RGB+depth photo into the window in your Looking Glass.
4. Enjoy your photo.
If you have any questions about how to use any of these tools, feel free to shoot me a note at missy@lookingglassfactory.com. If you just landed on this post and have absolutely no idea what I’m talking about, then head on over to the main Looking Glass Factory website to learn more about the Looking Glass.
