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


© 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 and music

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!

Coder Academy book

Coder Academy

Learn to make games and other programs in Scratch, and make a web page in HTML. Highly interactive book for 7-10 year olds.

Artificial: album cover shows a steampunk heart


What happens beyond AI when the machines become emotional? Discover my new album of electronic music here.

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