- The tool-tip feels wrong in how it covers up the highlighted route. Perhaps it should go at the left top of the screen.
- 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.
That's even better. Do remember that the OS language isn't the preferred language. From HN you should really link to an /en version.
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.
Thanks for the effort on the mockup!! :D You make a great point about the user's mindset. I will try to implement that streamlined, search-first design."
Really polished UI. The real-time train positions are a nice touch.
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.
> Also the arrival/departure times showing "hundreds of minutes" is confusing. Anything over 90 minutes should probably display as hours:minutes instead.
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 there any point of using cumulative minutes rather than standard time format that I may not be considering?
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?
- trains all look to be arriving/departing in hundreds of minutes when you click a random station, even near active trains. Assuming a bug. Regardless, consider changing this to hour/minute display if over 60|90m
- 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.
Great resource, many thanks for sharing. I've bookmarked it and will keep an eye on its development. Wish you good luck with it!
(Not a Bulgarian, but live in your country for several years and really felt in love with it!)
Thanks. I wish we had a map with freight trains too. I have always been a railroad fan and my favourite trains are those long freight trains. I also love watching the operations of marshalling stations too!
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
Fair point! I relied entirely on scroll/pinch-to-zoom to keep the interface clean, but I should add standard +/- buttons for accessibility and desktop usability
BDZ is Balgarski Darzhavni Zheleznitsi, Bulgaria's national railway.
Thank you; would be nice if the country would be clear from the post title
Well done! The UI feels incredibly polished. Without really digging into the detail at I'm on mobile, at a glance you've done a great job.
- The tool-tip feels wrong in how it covers up the highlighted route. Perhaps it should go at the left top of the screen.
- 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.
Valuable feedback, thank you.
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.
That's even better. Do remember that the OS language isn't the preferred language. From HN you should really link to an /en version.
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
Thanks for the effort on the mockup!! :D You make a great point about the user's mindset. I will try to implement that streamlined, search-first design."
A similar (unofficial) map, but for The Netherlands: https://spoorkaart.mwnn.nl/
Really polished UI. The real-time train positions are a nice touch.
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.
> Also the arrival/departure times showing "hundreds of minutes" is confusing. Anything over 90 minutes should probably display as hours:minutes instead.
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 there any point of using cumulative minutes rather than standard time format that I may not be considering?
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?
- trains all look to be arriving/departing in hundreds of minutes when you click a random station, even near active trains. Assuming a bug. Regardless, consider changing this to hour/minute display if over 60|90m
- 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
Thanks for the feedback!
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.
Congrats, it is heartwarming seeing the young doing their own things. :)
PS: Only BG comprehensible joke - be careful with showing BDZ looking bad, they might hide the data MVR style.
Thank you!
Nice job! I took the train from Sofia to Plovdiv a few months ago, and this would have been a great resource to have.
(I wish someone would make a similar thing for Amtrak, which has a route/progress tracker that only marginally works IME.)
https://amtraker.com/map
Great resource, many thanks for sharing. I've bookmarked it and will keep an eye on its development. Wish you good luck with it! (Not a Bulgarian, but live in your country for several years and really felt in love with it!)
Thanks.
Thanks. I wish we had a map with freight trains too. I have always been a railroad fan and my favourite trains are those long freight trains. I also love watching the operations of marshalling stations too!
In case you haven't stumbled upon it
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
no zoom buttons :(
Fair point! I relied entirely on scroll/pinch-to-zoom to keep the interface clean, but I should add standard +/- buttons for accessibility and desktop usability