I was trying to drum out a thumbnail image spec. for Podcastinople this afternoon and of course turned to the Web 2.0 standard for creating them, Flickr. The idea behind a thumbnail is that I want to create a 75×75 version of an image while maintaining the aspect ratio.
Since most photos and images uploaded won’t necessarily be square, (equal in both length and width), some cropping must occur. Since cropping a photo can change what is represented visually even more than say an image resize some attention should be given as to how the crop is performed.
I uploaded three images to Flickr to test this out, two boring graphs and an awesome photo of Dan and me on Anne’s birthday. The first one I uploaded has a 415×265 pixel aspect ratio and can be viewed here. This is how the thumbnail turned out:
As you can see, the image was cropped such that the center region roughly so that the left-over portion is centered in the original image:
Then I uploaded a second grid image that had an aspect ratio that I distorted to 450×700 pixels. That thumbnail came out like this:
Again, here’s what the Flickr’s thumbnail crop against an image that has an aspect ratio with a height greater than the width:
So the conclusion to draw from this experiment thus far is that Flickr will find the smaller dimension X, then draw a box with sides equal to X, but centered across the longer dimension.
My next thought was to check whether Flickr might be using an intelligent guess at its crop prior to creating the thumbnail. Afterall, it may be that a better thumbnail can be created by running a quick function on the image looking for what might be the focus of the image.
For this I took one of my older photos and re-cropped it so that the focus was clearly on one side of the photo, then re-uploaded it to Flickr. (Please note, it is hard to look cool and manly when pulling a tiny little string, even though the result is ceramic exploaded in the sky by the payload of a shotgun shell). Here is the resulting icon:
And a visualization of the approximate crop:
The expectation here would be that the crop notice the focus of the image should be the two people and not cut them off in favor of the background. Instead it appears that Flickr does not perform any pre-crop processing or “intelligent crop” prior to creating thumbnails.
Though it isn’t as cool as it would be to consider the image, keeping thumbnail cropping simple means less computational overhead. Unfortunately, it can also lead to some unfortunate results. Christopher League noticed that this photo received a bum rap in its thumbnail icon:
I happen to think the graphs you uploaded were awesome.