Andrew Maddison


TFL Live Bus Departures a Little Usability

TL:DR If you’re at an unfamiliar bus stop in London and don’t know when the next bus is arriving, visit this little page that I’ve written to help find bus stop departures pages. Just type the number into the box and hit ‘Go’!

Any bus Stop on Chrome's iPhone 4 simulated display size

Longer: All this does is provide a light, mobile optimised (ish – see below) page that redirects you to TFL’s existing mobile departures pages. It’s pointless, and TFL do have such a page of their own now. But most of my pet projects are more about having fun and solving a problem.

So, for this project I’ve used some things, and learnt some things:

  • It’s static html, javascript and CSS
  • My first attempt (outside work) using Media Queries to create a not-awfull small screen experience.
  • I’m using SASS
  • Compiled with Gulp
  • Which required the grokking of NVM to install Node to get NPM working to install Gulp (it’s package managers all the way down).

It’s also my first (fairly unsuccessful) attempt at a mobile first design. It’s already looking better than it did thanks to some of my awesome colleages helping me out a bit.

It’s all on github here (unusual for me, as I usually use bitbucket). Pull requests welcome.

PS – I think this would be awesome on a .London domain name, but they cost about £30, so that’s not happening unless someone want’s to sponsor me!