I’m a junior developer. I wanted to share a side project I’ve been working on.
The national railway carrier (BDZ) has no public API. They have an official map but the UI is quite dated, often lags, and doesn't show the full route context.
I wrote a short write-up about the process here: https://www.pavlinbg.com/posts/bg-train-tracker
I know it's still rough around the edges (I'm still working on it), but I’d love to hear your feedback or suggestions!
One UX issue on desktop: the train detail panel being fixed to the bottom feels awkward. Consider making it a floating panel or sidebar that doesn't block the map.
Also the arrival/departure times showing "hundreds of minutes" is confusing. Anything over 90 minutes should probably display as hours:minutes instead.
Great work overall though. I've seen plenty of official government transit sites that look worse than this.
Would help with usability but overall seeing this is pretty normal in my part of Europe. I've seen 200+ min delays, written just like that, many times.
Is that something that should be improved? Or is that just a “we’ve always done it that way but no one knows why, so we are going to just keep doing it that way” thing?
- train icon looks like standard metro icon but is easily mistaken for a bus
- train detail panel fixed to bottom is awkward on desktop breakpoints. consider floating or integrating to a single sidebar
- consider having main sidebar fixed to bottom for mobile breakpoints
Regarding the arrival times: Yes, that is definitely a bug I need to fix :D I will update it to format properly into hours/minutes.
As for the icons, I am actually using the official SVGs from the BDZ website. I stuck with those because I assume most users will be Bulgarian, and I wanted them to have that familiarity with the official symbols.
https://www.openrailwaymap.org/
I used it recently to find a land and sea route from Southampton to Marrakesh, along with Google maps faint representation of ferry lines, Google doesn't have public transit directions for the trains in Morocco shrug
- When opening the page the user should be prompted to pick the language and theme. Then you can collapse it in the interface under a settings icon. (put the icon to the left of the close button)
- Push "Train dashboard" all the way to the top. (next to the settings and close icons)
- Make the close button smaller.
- "Search trains" should sit as close to the top as possible.
- Lines around forms and buttons are visible when you look at them directly but are to faint for peripheral vision.
Regarding the prompt for language and theme: I actually received similar feedback via email. Instead of adding a popup, I decided to make it seamless—I just updated(locally) the app to automatically detect your OS settings for the Theme (Light/Dark) and Time Format (12h/24h) and apply them by default. This way it should "just work" for most users without needing an extra click.
My formula is to ask what it is the user should be doing on the page. Not even what they think they should be doing, what they actually should be doing. Why are they there?
Then you give the visitor only what they need step by step. People are great at screwing things up. Rob them from all opportunities.
In my day job I actually use quite a few train apps. If I have several train or trip numbers in my head everything that is not a search box is wildly annoying.
Wait.. let me slap something together....
https://img.go-here.nl/train-app.png
There, except from a settings icon that is how I would make it.
Enjoy
