MBTA Commuter Rail App Concept

A mockup for a better commuter rail schedule, after having a hard time looking at the MBTA's site on my phone. Problems: The original was a non-responsive table, that forced you to scroll sideways in order to view. Not natural. The laptop experience wasn't much better, again, depending on window size it was hard to read and tough to parse side-to-side. Warnings for the rails and the dropdown menus for the rail lines were oriented above and below, which ended up making the design look really confusing. The big benefit of this new interface is that it reads from top left to bottom right, with the information funneling in specificity. So, you choose your line and scroll to see the schedule, and then, you can see the additional snafus and warnings. I wanted the windows to be scalable depending on the device, allowing users to hide unnecessary information. All of the same information from the website page is on this one; nothing is lost, but it's arranged more like a funnel and therefore feels more intuitive. The big downside to this design is that it's still a horizontal orientation. Considering the amount of parallel train times that the MBTA site needs to show, this layout ended up making more sense than a vertical one. Less optimal for mobile.