Home > Articles > Webmaster resources > 3D > Panorama

Creating panoramas for your website

Here's an example panorama I made, using photographs taken at St Nicholas Church in Stevenage. Because it's made from a set of still photos, you can appear more than once in the panorama.

You'll need Java enabled to see the applet. To scroll the view click on the photo and drag it left and right.

Want to create your own panorama?

The photos were taken with an ordinary SLR camera (you'll need a tripod but can use any camera) and the panorama was created with freeware available from Albatross Design.

  1. Take a series of photos, moving the camera clockwise after each one and making sure there is an overlap between the pictures. This overlap will be used to join the photos up, so try to repeat distinctive features, such as building shapes or lamp posts in the margins of the photos. Beware of dramatic changes of light or weather while you're shooting. It looks weird on your final panorama if it's raining only half the way around.
  2. Scan the photos if you used a film camera, or upload them if you used a digital camera
  3. Put your (digital or scanned) photos in the same folder and give them filenames that say what they are and indicate their order clockwise. So your first shot of a mountain scene might be 'mountaina.jpg', the next 'mountainb.jpg', and so on. Avoid having more than one word in the filename (no spaces).
  4. Download and install ADG Panorama (free for non-commercial use).
  5. Run the program, tell it to create a new panorama
  6. It will import your images and put them in the right order
  7. Click the button for automatic stitching (arrows pointing at red blob)
  8. Tidy it up by aligning photos with the mouse, switching between the mode that lets you move photos (compass button) and the mode that lets you scroll the panorama (camera button) using the buttons at the top.
  9. When it's finished, save the panorama to a new folder and the program will put all the HTML and Java code you need there. You can upload it as it is, or paste the HTML into your webpage template first.

Related pages on this site

Related links to other websites

Credits

© Sean McManus. All rights reserved.

Visit www.sean.co.uk for free chapters from Sean's coding books (including Mission Python, Scratch Programming in Easy Steps and Coder Academy) and more!

Discover my latest books

Coding Compendium

Coding Compendium

A free 100-page ebook collecting my projects and tutorials for Raspberry Pi, micro:bit, Scratch and Python. Simply join my newsletter to download it.

Web Design in Easy Steps

Web Design IES

Web Design in Easy Steps, now in its 7th Edition, shows you how to make effective websites that work on any device.

100 Top Tips: Microsoft Excel

100 Top Tips: Microsoft Excel

Power up your Microsoft Excel skills with this powerful pocket-sized book of tips that will save you time and help you learn more from your spreadsheets.

Scratch Programming in Easy Steps

Scratch Programming IES

This book, now fully updated for Scratch 3, will take you from the basics of the Scratch language into the depths of its more advanced features. A great way to start programming.

Mission Python book

Mission Python

Code a space adventure game in this Python programming book published by No Starch Press.

Cool Scratch Projects in Easy Steps book

Cool Scratch Projects in Easy Steps

Discover how to make 3D games, create mazes, build a drum machine, make a game with cartoon animals and more!

Walking astronaut from Mission Python book Top | Search | Help | Privacy | Access Keys | Contact me
Home | Newsletter | Blog | Copywriting Services | Books | Free book chapters | Articles | Music | Photos | Games | Shop | About