London Underground

This diagram shows the entry and exit number of each tube station in London without data or characters by only using colours and abstract forms. Different layers of information let the observer get deeper insights about different stations or lines. The size as well as the saturation contains real information of each station based on the database of the London Underground Ltd. This is achieved by programming the whole system using javascript.

The size indicates the number of entries end exits

The colour indicates the line

If a station has multiple lines, a border is shown


Just using colours and forms, this system displays the information stored within the database. The three dots above explain how the system has to be read.


By hovering over a station, all other stations of the same line get highlighted as well to see where the line goes. Clicking on one station results in displaying the whole line in the regular order they appear in real life. The background colour indicates the line name, here it would be the Central Line.

Inside the line-view the stations get more light or dark greyish. The lighter the more people enter trains at this station, the darker the more people left trains at this station.

Multiple Lines

Often one station has not only one line but multiple. Again all stations with the same lines get highlighted but by clicking it would not be clear which line to enter. Thus a menu pops up, separating the station into the lines.


When riding the underground, we usually need to switch trains to get from one place to another. This feeling is included into the system by selecting the other station where the switch should happen.

But test it out yourself and discover the data!

check it out