Team LRB Tube Map #2

I wrote about the LRB hack day over here, including all the other hacks, but I wanted to write a bit more about the project my team worked on.

Alternative London Tube Maps

On the day we ended up making a proof of concept of an interactive version of the super cool LRB Alternative Tube Map. Of course, I had some help: Jeremy from the production team for the LRB and another very smart guest Beck Laxton who got the project into shape with their data & UX skills.

Beck and Nicky slaving over a hot image map

We spent a bit of time researching other alternative tube maps and down a bit of a rabbit hole I found this lovely piece on "Tube Maps Only The Colour Blind Will Truly Appreciate" - clearly the title is wrong because I love this idea, and some of the maps are very pretty even to a non-colour-blind person.

Figuring out what to do

We had a bit more information to play with than the original map, in the form of the links to the websites of the organisations the names were taken from, and we wanted to show those off, but also wanted to make it somehow useful if we could. So we hit upon the idea of showing the linked sites in their position on a Google map in the real world. Thus, you can navigate literary London - buy a book, then find a recommended coffeeshop nearby to read it in while it's grey outside. Hey, you can tell it's the British summertime because everyone's wearing their raincoats.

The nitty-gritty

It was a bit fiddly to automate the position of the links on the map, because it's easy enough to find the geographical coordinates of the London tube stations, y'know, in actual London, but what we actually needed were the coordinates of the stations on the map itself. So we ended up resorting to that most old skool of technologies, the image map (hello 1997!) and manually picking out some rectangles for a small selection of stations using ImageMapster.


LRB Tube Map Hack - I'm horrified to admit it doesn't work too good at all on mobile. That can be version three :(

Next!

As is the way with these things, the more I look at it the more improvements I can think of. In an ideal world we'd like to have worked with a designer and tried using something like the canvas API to make something better looking, really worthy of the iconic design of the tube map. That can be version four! We also thought about how it would be nice to give the map more room to show some of the discussion and thinking that went into choosing the various places - or allow contributors to nominate some of the missing stations with their favourite places.

All in all it was a lovely day spent with lovely people, and I'm really impressed with what everyone achieved in such a short time.