Every time I leave my apartment I always ask myself the same two questions:
- “What is the current temperature?”
- “When is the next bus headed downtown?”
Like most people, I used to reach into my pocket for my phone to answer these questions. But I’ve always wished I could look at a display by the door that could tell me exactly what I want at a glance. Luckily for me, I’m also a software developer, so I could make that dream a reality.
Where Other Apps Lack
One of my favorite things about living in Loring Park in Minneapolis is having access to a considerable number of high-frequency bus routes. However, this creates a problem when trying to figure out exactly which bus will be arriving the soonest, and therefore which bus stop I should walk to. In my experience, no app really does exactly what I want.
Google Maps will provide a list of departures, but only for a single stop at a time. The excellent Transit app will show all nearby routes, but they are ordered by walking distance, rather than departure time. The direction of the routes can also be confusing sometimes. For example, Route 17 is labeled as an east/west route, but where I live it runs north/south. It always takes me a few moments to remember whether east or west goes Downtown.
This is where my display is different. I manually entered all of the bus stops I use, which routes I board from those stops and the walking time to each of them (factoring in the elevator time in my high-rise apartment building). I also divided the stops into two groups: routes headed into downtown and those headed south, which I called “Uptown” (the exact borders of which are hotly debated). With this information, my app will go and fetch departure times from Metro Transit, subtract the walking times I entered and then display the routes according to how soon I would need to leave to catch that specific bus. Buses arriving too soon for me to walk to in time are not shown. This means I can easily glance at the display and tell exactly which bus I should head for, and roughly how long I will wait at the stop before it arrives.
I also included the temperature and weather conditions for the next hour at the top of the display, giving me a quick way to decide if I need a coat or an umbrella.
Hardware
When conceptualizing this display, I originally planned on building something custom with some kind of microcontroller and an e-ink display. While that would’ve been cool, it would also lock me into that specific hardware, and make this tool difficult to share with other people who might want to use it.
With that in mind, I decided to make something web-based so anyone with an old tablet sitting in a drawer could mount it on a wall, navigate to the site I’d set up for them and be ready to go. In my case, I ended up using an old Amazon Fire HD 10 tablet that I got on eBay for $20, but really any tablet larger than 8 inches should suffice. I even used a Kindle PaperWhite for a while and, although locked in the portrait orientation, it worked pretty well! Although you could use this on a phone, the user interface is a bit cramped at that size, so I would recommend using a larger device if you have one available.
Technical Stuff
A few details for the tech nerds and programmers out there. For the bus departures I am using Metro Transit’s free NexTrip API. For weather I am using the free weather.gov APIs to fetch the conditions for the next hour. This app does not use any kind of front-end framework or complicated server-side logic. No React, no Next, no Docker, nothing like that. It is simply a Linux machine, running nginx, serving static HTML, CSS and vanilla JS files. Transit and weather data is pulled on the client side every 15 seconds, with requests being proxied through my server to avoid cross-origin issues.
The initial version of the app used many modern browser features, but in testing I realized that the ancient Silk browser on the Fire HD does not support any of those features. I ended up rewriting the entire app the old-fashioned way. No async, no Promises, no fetch, no display: grid. Just XHRs, callbacks and tables. As such, this application should work on even the oldest device without issue.
Want One?
I mentioned in the headline that you could have one of these as well. If you are interested, drop me a line on X (the former Twitter) @kyledrj1995 or on Mastodon at [email protected]. I just need some information about the bus stops and routes you care about, and I can set up a page for you.
Then just navigate on an old tablet to the URL I send you, mount it on the wall and you are done! You don’t have to use my downtown and uptown groups either. You may want to group by direction like “Eastbound” vs. “Westbound,” or maybe “School” vs. “Work” or even “BRT” vs. “Light Rail.” Whatever you want, I can probably make it happen.
I have been using this display for a few weeks now, and it is tremendously useful. If you decide to set up one of your own, I hope that it brings you as much joy (and efficiency) as mine brings me!