Magic Lens, Try 1.

First, apologies to TMIWTM. A while back, I referenced a “paper that changed my life,” and he asked for the full series. I replied with three, and the list did not include Magic Lens. That was, unambiguously, a mistake. (Although, if I only had one “Pure UI” paper, most likely it would be Generalized Fisheye Views)

Anyway. Here is my first try at implementing a magic lens on this website, using the “seemingly1” solid code from Digital Gizmo.

This now works well enough for a “Try 1.” It works, but it’s unclear how much work there is to make it nice. There are a few things that are niggling me:

  • First, I want it to be bigger. It’s a big map I am trying to show here, and it’s hard to see much detail.

  • Second, I want to eliminate the white space at the top and the bottom of the div. It looks bad.

  • Third, one of the tabs in the original image is a bit too revealing, and this needs to be fixed.

The last one was easy enough in Photoshop, and I also got rid of the sidebar. The first two are a lot more complex. The first one involves mucking around with Jekyll and the Minimal Mistakes theme, while I think the second involves mucking about with the Magic Lens itself.

  1. I say “seemingly” because it hasn’t been updated recently. This means one of two things: first, it does something straight-forward, using common web idioms and has been mostly debugged, or second, it’s abandoned, and I’m going to spend hours trying to figure out what’s wrong. My hope, obviously, is the former. 

Updated: