Properly Displaying Ancient Interfaces

As part of the unveiling of our Historic Screenshot Archive, I made some fun images to post to our social media accounts. Making those images was tricky, because interfaces were much smaller in the pre-Retina era. Here is how big a screenshot and app icon from 2002 displays on a Retina screen of today:

Screen resolution has increased so much that a once full-sized app window is tiny on modern displays.

The above screenshot of Audio Hijack’s main window, at a bit over 400 pixels wide, is smaller than even app icons of today, which can be as large as 1024 pixels wide.

I needed to scale the screenshot up by many hundreds of percent to be a useful size for a social media post. Enlarging with interpolation, however, turned the pixels into an ugly blur:

Enlarged with Lanczos interpolation, usually great for photos, this screenshot is too blurry.

So instead, I did a two-step dance. First, I exported the screenshot enlarged to 1000% using blocky nearest-neighbour interpolation. Next, I dropped that in my design app and resized it down to the size I needed:

This is more like it!

To be clear, we only ran this process on the social media images, like this one:

The social image for Audio Hijack. The effect is hard to notice at this size, but at some of the larger sizes it makes a big difference.

The screenshots you’ll find in the actual archive are unmodified. But thanks to this little trick, I could display old screenshots in all their pixely glory, even on Retina screens.