Viewing a LOT of Images Effectively (plus 700 Obama Newspaper Covers in Silverlight Deep Zoom )
I don't talk politics as a rule on this blog. However, regardless of your political affiliation, the last week has generated a lot of news. When I saw these 730 Newspaper images from 66 countries at the Newseum, Scott Stanfield and I immediately said Silverlight Deep Zoom!
There's a number of good ways to view LOTS of images at a time. I'll share the ones I use. First, here's our Silverlight DeepZoom Obama News page.
Scroll…zoom…
Scroll…zoom…
Cool. I had to manage these files and check them out before we made the Silverlight DeepZoom version, so I tried these programs:
Windows Explorer
So, the story is, the Newseum assembled 730 newspaper front pages from all over. I downloaded them with DownThemAll and put them in a folder in Explorer. I run 64-bit Windows Vista and didn't have to much trouble with Windows Explorer with only ~700 images. I could use the View Thumbnails feature and zoom in and out and it worked pretty good.
Windows Photo Gallery (the Default Preview)
If you double click on an image in Windows, you'll get the Windows Photo Gallery by default, which just shows the image. You can then navigate around the folder with the left and right keys. It works pretty well, although the previewer fills the screen completely and starts up maximized which I find kind of irritating. Also, there's no way to see previews of the images that are coming up next. The thumbnail view is gone.
Windows Live Photo Gallery
This is a big improvement on the default one. It's a much more polished version of the default one. The most dramatic feature addition is face recognition. If you click on an image, it'll find people:
If you click on "people found," the system will highlight the face that you can then identify, and more importantly, search on.
Picasa 3 from Google
Picasa 3 is pretty much on par with Windows Live Photo Gallery. They are both fast, they both have some face recognition, although WLPG is much more granular while Picass just has a "show me photos with faces" option.
Where Picas really shines is with its replacement of the default image previewer. If you let it take over as your default image viewer, when you double click on a file you'll get a nice animation, a gray curtain that falls over your desktop, but more importantly a "FilmStrip" of all the files. This little touch lets you much more easily navigate while still previewing files.
Expression Media 2
A commenter suggested I add Expression Media 2 as the whole point of Expression Media is to catalog butt-loads of media assets. It shouldn't blink at 700 images…and it didn't.
It's very bare bones from a Consumer point of view, as it's not meant for organizing the family photos. However, it's power is hidden in its keyboard shortcuts. It's obscenely fast. Truly. Everything moves at the speed of thought, and you can batch rename, tag, change, your photos.
It also notably has a ridiculous number of sorting options, like dozens. You can sort by height, width, author or whatever metadata you like. Definitely something I'd return to if I had several thousands images.
Silverlight DeepZoom
First I tried using DeepZoom Composer, which is a free tool for making DeepZoom collections really easily. We figured we'd drag these 700+ files into DeepZoom and bam! We're done. Well, DeepZoom Composer currently can't handle single collections with THAT many images. This isn't a limitation of DeepZoom, it appears, but the editor which hit 2 gigs of RAM and died. Additionally, with that many files, it's easier to just position the images programmatically. I talked to the PM for the product and they're already on it. However, I can still use the DeepZoom tools programmatically. It's not DeepZoom Composer that does ALL the work, in fact. There's a "SparseImageTool.exe" that we can call programmatically.
Giorgio Sardo has a blog post about this (latest version here), and I was able to use his code directly to make a local DeepZoom collection. Here's a snippet of his code with my changes. It's rough, but it's a one off, so be forgiving:
static void Main(string[] args)
{
// Collection name
string collectionName = "ObamaZoom";
// Folder containing images to be processed
string sourceImagesFolder = @"C:\\Users\\Scott\\Desktop\\Obama\\";
// Destination folder of the batch process
string outputFolder = "D:\\DeepZoomObamaNews\\";
// Eventually create the output directory
if (!Directory.Exists(outputFolder))
Directory.CreateDirectory(outputFolder);
CreateCollection(collectionName, sourceImagesFolder, outputFolder);
}
/// <summary>
/// Create a Test collection using automation
/// </summary>
static void CreateCollection(string collectionName, string sourceImagesFolder, string outputFolder)
{
// Create a collection converter
CollectionConverter collectionConverter = new CollectionConverter();
// Required parameters
collectionConverter.SparseImageToolPath = GetSparseImageToolPath();
collectionConverter.ImagesCollection = GetImages(sourceImagesFolder); // IEnumerable<string> containing the path of the images
collectionConverter.ImagesDestinationFolder = outputFolder;
// Optional parameters
collectionConverter.CollectionName = collectionName;
collectionConverter.CollectionFormat = CollectionConverter.CollectionFormats.XML;
//collectionConverter.ConvertedOverlapPixels = ...
//collectionConverter.ConvertedTileSize = ...
//TODO: You can customize the exporting experience here, by setting the according parameters such as:
// Tile Size, File Format, Collection Format, Compression, Quality, ...
// Attach to completion handler
collectionConverter.BatchCompleted += delegate
{
Console.WriteLine("Conversion completed\nPRESS <ENTER> TO EXIT");
};
try
{
collectionConverter.BatchCollectionExport();
}
catch (Exception e)
{
Console.WriteLine(e.Message);
}
Console.WriteLine("Conversion started...");
Console.ReadLine();
}
This code takes the input folder and creates an output folder with the DeepZoom processed files you need. ScottS then said he thought the result would look better if it looks more like the HardRock Cafe Memorabilia site, so we used Vertigo Software's "BigPicture" application (it's internal for now, but he's looking into what to do with it. Contact him if you want more details.) which easily handles all the dynamic positioning of the images in their collections.
The result is pretty cool. Even cooler if you press the Full Screen button (fourth from the left):
I think it'd be interesting if this technology wasn't just used as an occasional showcase when an event happens, but as a regular everyday thing. I wonder if it would be hard/cool/interesting/compelling to read a regular newspaper like this? Or of PDF files supported this kind of view? For me, the fun is just the buttery smoothness of the zooming. The frame-rate is crazy fast. Enjoy.
Thank Scott Stanfield and Vertigo Software for hosting it!
About Scott
Scott Hanselman is a former professor, former Chief Architect in finance, now speaker, consultant, father, diabetic, and Microsoft employee. He is a failed stand-up comic, a cornrower, and a book author.
About Newsletter
There is clearly a limit to the number of items you can show in one collection, I've notice for the Hard Rock site Vertigo has limit that to 500. In the same way as they did there you could have added a menu to sort or filter the results based on region or type of publication or something.
This would actually be an interesting project for Azure. Imagine a service that took the webpage of links (or more likely a SOAP interface), downloaded the images, made them into tilesets, sent them to your final view location all hosted and processed within the cloud. Depending upon how urgent you needed the page up you could have spun up 100's of instances to do this and completed the job in moments?
John.
What's really interesting is that Picasa Web does face recognition.
I'm guessing this announced-at-PDC Silverlight out of the browser will have the same problem. DeepZoom + mousewheel = awesome :)
The best solution I've seen is popup a full screen window, but really this is pretty lame.
John.
@Scott: I need to look more into Azure, but it could do the processing and host the application right? The big issue with the hosted services like Silverlight Streaming is the pain to upload the application. The new Silverlight uploader is much more reliable but still not ideal. Another idea - make your Silverlight streaming account part of your Mesh? This would be much nicer then a web based file uploader.
John.
What I do think is cool is the potential for looking deep into high resolution images (I've been blogging about that), and I think that's where Deep Zoom's biggest magic is.
Eg. take a look at "The Journal" (bottom row, 3 from the left) and tell me what is there about Obama on that page?
hehe
I then used the images to create a slideshow - check it out at:
http://yeswecan.ehuna.org
I also blogged about it here:
http://blog.ehuna.org/2008/11/slideshow_596_newspaper_front.html
(low-res YouTube version of the slideshow included in the blog article)
Good times!
Comments are closed.