SearcH MY Website

Google

Thursday, January 17, 2008

How to Create a Time-Lapse Video of any Web Page

Remember the time-lapse movie that helped you visualize the movement of tech stories on Techmeme? It did attract lot of eye-balls and as promised, here’s the secret recipe on how to make such a time lapse video with (almost) free software.

The process is simple and has two main parts - 1) Capturing screenshots and 2) Stitching all these images together so they appear as an animated movie or a flipbook.

Time Lapse Video Tutorial

Techmeme saves a snapshot of its homepage every 5 minutes and each snapshot has a unique URL with the timestamp. For instance, the snapshot of Techmeme at 1:50 PM ET, January 15, 2008 is available at www.techmeme.com/080115/h1350.

To capture those hundreds of screenshots, I created a simple macro (snippet below) using AutoHotKey that would automatically generate URLs, type them in the web browser, press the print screen key and then save the screenshot as an image - this ran in a loop 600 times capturing 50 hours of changes.

techmeme=http://www.techmeme.com/08010
url=%techmeme%%Date%/h%Hours%%Minutes% <- Create URL
Send, {CTRLDOWN}l{CTRLUP} <- Reach the Browser Address Bar
Send, %url% {ENTER} <- Paste the URL and Hit Enter
Sleep, 5000 <- Wait 5 seconds for the web page to load
Send, {PRINTSCREEN} <- Capture a screenshot

You may be wondering how the Print Screen key will save the screenshot to an image file when all it does is capture the current screen content to the clipboard ? That’s possible through SnagIt (available for a 30-day trial at techsmith.com) - You just mark the region that you wish to capture and SnagIt will do everything else.

Once you have all the screenshots, import all of them as a sequence inside Windows Movie Maker, Adobe Premiere Pro, Camtasia, QuickTime Pro or any other video editor - just bring down the image transition time to 0.1 second (or less) and export the animation as a GIF or any video format. The results are always pretty amazing.

You can extend the trick to make time lapse movies of Google Maps, your road trips, construction sites, etc.

Related: How to Make a Stop Motion Animation Movie

No comments: