Archive | September, 2016

How to – Add a background image in a stereo panorama rendering

1 Sep

Repost from: Render Them Speechless

How to – Add a background image in a stereo panorama rendering

A stereo panorama rendering created using A360 rendering can be downloaded as a zip file.

Once you download the zip files and unzip it, you will see the following contents in it:

image.png – The main high resolution image

image.jpg – A lower resolution image for preview

imageL.jpg and imageR.jpg – The left eye and right eye

imagespano.html – The html file

twgl-dist.js – Javscript file

readme.txt  –

Here are the steps to adding your own custom background
  • Open image.png in an image editing software such as Photoshop
  • Since this is a png file, it has an alpha mask and you can composite your custom background.
  • Once editing is done, save this as a separate file or you could overwrite the original. But the final file has to be named image.png 
  • Now you have to generate the left and right eye images and the preview image
    • Crop the top-half of the image and Save As imageL.jpg
    • Crop the bottom-half and Save As imageR.jpg
    • For the preview image, Save imageL.jpg as image.jpg. Reduce the size of this image to 1/8 of the original size. For eg: 9216×1536 will become 768×128 pixels.
  • All your images are now ready. If you want to preview how it looks on your computer, open Firefox browser (Chrome does not let you open local files) and drag pano.html to it. You should see a pixelated preview for a brief moment. After it clears up, you will see the new panorama with your composited background image. Example of the link: file:///C:/Users/xyz/Desktop/stereo_pano/pano.html. You should do this to check if your composite looks fine and if there are any edits required.
  • In order to view it in the browser on your mobile device (this is what you really want), all the files in the zip file have to be hosted to your website. They cannot be uploaded back to Autodesk’s site, which happens when we generate a URL for your rendered stereo panoramas

Source: How to – Add a background image in a stereo panorama rendering  – Render Them Speechless