I often get asked for advice on setting up a home shop so I started writing a series of posts on selecting tools and arranging your work space when I realized I wanted to include one of those cool interactive 360º scrollable & zoomable panoramic pictures you often see on web sites advertising vacation spots. These images offer users a virtual tour of the environment and just look really cool. I begin the process of learning how to create these images with one goal in mind. It had to be free! I wasn’t going to buy some panoramic lens for my camera, I wasn’t going to pay some company to produce it, and I wasn’t going to shell out any money for software. After 2 weeks of research and failed experiments I finally put all the pieces together. Below you can see the results of the experiment and a step by step how-to guide if you would like to make your own virtual tour (for free).
Click here to take a virtual tour of my shop
(4 Mb file)
To begin, you simply need a camera and a tripod. Take a series of pictures (15-20) rotating the camera a few degrees each time. When finished, you should have a set of pictures covering the entire 360º view. Try to make sure your pictures have some overlap as this helps the software when it stitches together the final panorama. I also found it usefull to put the camera in manual mode. In auto mode the camera adjusts the picture based on lighting. As the lighting may change for different angles, your pictures may not all look the same. This will make your final panorama have obvious seams. Manual mode fixes that. Here are the images I took of the shop. As you can see, each picture shows a slightly different area of the shop (and you can see the jatoba table waiting to be completed on the floor…).
Now you need to download the software that will create the single panoramic image from your photos. The best free tool I found was AutoStitch. After downloading and launching AutoStitch you can play with a few settings (although I used most of the defaults). I did change the scale value (edit>options) to 50% to increase the detail of the final product.
Now click file>open and select all the images from earlier. As soon as you click OK, AutoStitch will begin to create your panoramic image and save it as pano.jpg in the same directory as the original files. Be sure to move or rename the file if you want to try again as AutoStitch will overwrite without warning. Mine looked like this when it was complete.
The next tool you need is some software to take your panoramic image and turn it into an interactive movie. I found that the free version of Pano2QVTR worked great. It can even add clickable hotspots to your movie but I choose not to use that feature. After installing and launching Pano2QVTR you’ll need to change one setting. The default setting for image type is equirectangular but you need to choose cylindrical.
Next you need to tell it where to find your panoramic image (pano.jpg) from AutoStitch. Click the … button next to the “Cylindrical image” field and locate your panoramic image file
Under the “QuickTime Output filename” you can choose the location for your completed movie. Under the settings tab you can also change the size and quality of the final movie. When you are ready click “Create” and Pano2QVTR will take care of the rest. It’s surprisingly fast (about 30 seconds) and upon completion it will show you a preview of your movie. After that you can email or post it to the web if you choose. If you are posting to a web site, here is the minimum code for embeding a quicktime movie.
<param name=”src” value=”garage.mov”>
<param name=”controller” value=”true”>
</object>
There are other options you can choose to include such as an auto download of the QuickTime plugin. A excellent explanation for all the embedding options can be found here.
Have fun making your own panoramic movies!
PS the shop setup posts are coming soon…
Event Horizons 
This tutorial is impressive, but I’m more impressed with how clean your garage is!
very spiffy tutorial!
i love that its free, and simple, and effective
cant wait to try it!
only question that i have is where would be the best place to post such a movie, considering you dont own your own website domain…
nevertheless, sweet tutorial!
Boris, more then likely your internet service provider provides you with some free web space. Sure, you won’t have your own domain name for it but it’s free. If not, then there are a number of sites that offer free web space (a few hundred megs and limited bandwidth) but just fine for trying out a few panoramas. Truth is that unless you are trying to share it with people the QuickTime file runs just fine of your local hard drive…Let me know if you have any questions about finding some free web space…I’m happy to help
Mine are ending up so small and your 4 mb final product is nice and big/high res. Any tips on how to achieve this?
By the way, this tutorial was perfect for what I was trying to do, I appreciate it a lot! Thanks for going through so much work.
Snively, under the settings tab in Pano2QTVR change the window size options under Movie Properties. I used 400×300 for my movie. You also need to make sure that you bump up the scale value (edit>options) to 50% in AutoStitch to make sure there is enough detail in your panoramic picture to render a large quicktime movie with
it’s very cool tutorial…, it’s all that i need,thanks for share your interesting expriment
hello, GOT TO BLOGSPOT.COM sign up and get a free web site, then your can get your free domain name like myne above, at http://www.dot.tk its all free, TRY IT!
how can you make the image so it goes up and down aswell, not just side to side???
You just need to start the image more zoomed in. You’ll notice on the example that if you zoom in then you can pan up and down as well as left and right. In the Pano2QTVR software you can set the initial zoom level for your quicktime movie. Simply click the settings tab and change the Start value for FoV
Hey, I really like the blog. It’s been very helpful.
My only question is how can I make the two ends of the picture mess together? They always come out in the end looking like two pictures just laid right on top of each other.
The image is almost a complete circle, it just doesn’t seem to tie together on the ends.
Am I just not clicking on the right option or something?
Nah…sometimes that is hard. The issue is the image that Autostitch generates. I had to clean mine up in photoshop. I opend the pano.jpg image and copied the right edge…Next I pasted that edge on the left side (in another layer) and then did some editing to make the seam dissappear. Then I removed the layer and saved the file. Now pano.jpg ends will line up in the final product.
Excellent tutorial! It was just what I needed to get started, as I was putting up some 360° virtual tours of my house, which is up for sale.
Autostitch is a great program requiring minimal user input. I used it a few times, and was somewhat satisfied with the output. However, if you are finding edges not quite lining up, or you want more control over the stitching/blending, I highly recommend the open-source, cost-free Hugin, which you can easily find from a search (it’s located on SourceForge). It’s a Windows GUI that will let you refine the stitching by specifying matching “control points” as you view two frames at a time. It’s also very 360° panorama friendly, so you can stitch all frames together in a continuous circle (rather than having to Photoshop the right and left ends to blend together). There’s a learning curve to using the tool (definitely much more effort than Autostitch), but the results are much sharper/better! The tool also takes into account things like exposure levels, focal length, and all that info from your camera (embedded in the file’s header) to render a much more seamless and natural-looking output. Just remember to specify “cylindrical” output.
Pano2QVTR was also great to get things working without much effort. I recommend unchecking the Enable Preview and Grayscale options (I’m going by memory, so I think those were the options) because this will result in a much smaller file (quicker for the user to download/view and eliminate the need for a preview to begin with). For me, it shrank the file from about 4-5 MB down to 250 kB (my source jpg was around 4200×800, and with the quality setting I used, was around 220 kB). Other options I selected were Compress Headers and 80% resolution quality.
A free alternative to Pano2QVTR is to use Java. I found a Java applet called PTViewer (you can find it by specifying PTViewer in Google, and picking the first link). This applet will take your 360° JPG file, and display it as a virtual tour. All you do is upload the .jar file, the .jpg image, and add a few tags for the applet in your HTML, much like you do for the QuickTime version. PTViewer is packed with features and capabilities, which I haven’t yet used (such as hot spots). I wouldn’t say that it’s necessary better or worse than Pano2QVTR; it’s just an alternative that I wanted to provide to site visitors since some are unable to display QuickTime (while the QT version is nice since others are unable to load/run Java applets).
Hi
Looks great. I was wondering if anyone knew how to do a 360deg pic of an object (ie camera goes around the object rather than vice versa)?
Thanks
great tutorial! im glad i found your website. very easy to follow and all the software are free!!! more power to you! and yes, your garage is clean!
and i have one question- using the same software, can you include the sky and the ground, too? like having the feeling that you also look up and look down?
This great,how long did it take you to do it. Thanks for sharing! I will post a link to mine when Im donE!
Kim
hey its seems interesting but I would like to know how it can be generated with flash. Actually I need to create a .swf file …..can u help it out.
Just what I was looking for! Thank you!
Great article! Thanks a lot. I have made a bracket for my tripod to eliminate parallax and I’ve made one panorama. Huggin worked better for me than Autostitch. I’ve been doing a lot of reading the last couple of weeks. One thing I read is that Quicktime can’t be made full screen. You are limited to that box. I want full screen. Also, you can view Quicktime or Flash on a web page but you can’t save it. I think you can save Java. Check out Peter McCready’s web page for ‘over the top’ pano’s of the Large Hadron Collider. http://www.petermccready.com/
Which may help unlock the secrets of how the universe came to be.
This is a great tutorial.. very helpful
Congratulations.
thanks thats what I was looking for
thanks again
Please tell mow how can I see the picture , as once I click to see the projects its says that Object movie are avalaible only with Pano2QTVR. the porejects has been saved but it goes on and one the same windows comes on display everytime
so pro
Thanks for the great tutorial. I haven’t tried it yet but will do in the next few days. In the meantime, thought others might be interested in this jQuery virtual tour plugin, It’s what I’m planning on using (no need for Flash, Java or Quicktime): http://www.openstudio.fr/jQuery-virtual-tour.html
Hello.
Ive stictched photos before and seen 360 degrees ones done so i thought id give it ago, however, the program you give here that makes it into the cylinder video seems to be for windows only. Do you have a program for macs ?
thanks for your excellent tips.. One question, where do I change default setting for image type is equirectangular but you need to choose cylindrical in Pano2QVTR software, as soon as I click the executable it is asking us to locate the file.. I don’t see any options to change the settings.. Please help.
Great work. I wonder if you can add any link on special part of the panaromic image?
Awesome post mate 🙂 i got what i was looking for. great tutorial.
nice article… i was using autostich for quite a time but 360 degree was new to me.
Not able to see the virtual tour. Complains about the web page name having expired. Would be great to have a look at the final output.
Fixed the link!
Does this stitching program remove distortion? I tried some other programs, shooting 20+ shots per panorama and was getting some massive distortion. Especially noticeable when I was doing a shot of the stone entry way at my house and the mortar lines are all waving up and down at me.
Hello, I just hopped over to your webpage using StumbleUpon. Not somthing I might usually browse, but I enjoyed your views none the less. Thank you for making some thing worthy of reading.
I down load the program but it dosen work .why?
rookiey@hotmail.gr
please answer
Great tutorial. I made the vid work, but am still not sure how to embed and post to a web site. Any further tips would be great!
Rookie, which part could you not get to work?
How do you put on a site please !
Sorry to the short evaluation, but desired to let you know I appreciate your blog and the info you supply.
Their is some greatinfo that have already been
written right here. Exactly where am i able
to go to subscribe towards the blog?
Want to copy posts from other websites rewrite them in seconds and
post on your website, or use for contextual backlinks?
You can save a lot of writing work, just search in google:
Daradess’s Rewriter