General User Interface
This document describes the interfaces used by bus riders to track buses in real time. It also outlines the steps required to perform various actions such as searching, vehicle tracking etc with screen shots.
This type of user interface can be accessed using a web browser on desktop. When the application is accessed by navigating to http://bustime.mta.info/, the main page is rendered as shown below
As shown in the screen shot, BUS CIS opens page with a map and search box on the left. It also shows some popular routes as example searches. The map has zooming and panning controls which can be used for respective functions if required. Bus CIS system is also available on mobile and SMS. The overview of these services can be found by clicking Mobile Web and SMS links at the bottom.
If a user is not sure where to start, he/she can always click New to Bus Time? link. Clicking on this link opens an instructions dialog next to search box on the left. This is shown in the image below
The dialog contains instructions required to start using the system such as typing a bus route or stop code in the search text box. This serves as a good starting point for the user. Hovering over the stop code hyper link in the instructions dialog, user can see the definition of the stop code and also instructions on where to find the stop code on bus stop. This is shown in the image below.
A user can start by typing route in the search text. Search control populates the suggestions matching user's route text as user starts typing. User can then select a route from the suggested routes. Otherwise he/she can continue typing and hit 'Enter' or click magnifying glass image on the right of search text box. Once a route is entered and search clicked, the map gets populated by buses in service on that route as shown below
As shown in the screen shot, the map is populated with buses running in both directions on the given route. Each bus image is displayed with a direction indicator to specify bus' current direction on that route. The map updates frequently to reflect most recent bus status on the route. The system also displays bus service in both directions on that route below the search text. User can click on the required service to get more details of the buses en route as shown in the following figure
Clicking on the required service expands the selection and displays a list of stops on that route. User can then click on stop of interest from the list. Clicking on a particular stop opens a details box for that stop on the map. As shown the details box consists of the stop code, buses en route to the stop with their head sign and the distance of each bus from the stop. User can zoom into the map around the selected stop by clicking Center & Zoom Here link on the details box. The time when data was last updated is displayed on the right corner. This box is also updated frequently to display most recent data to the user. Clicking on head sign of the bus en route shows more details on the map as shown below
After head sign is clicked, the system displays more details by zooming in required stop area on the map. All the stops are displayed as green dots with details box showing all the data as before. The system also shows "Other Routes" available on left pane below the service links. This information is also displayed on the details box.
The system can also be used by searching stop code, intersection or location instead of searching a route.
This section describes mobile interface in brief as information given by the system is same as the desktop interface. This type of user interface can be accessed using web browser in a smart phone or a tablet device. When the application is accessed by navigating to http://bustime.mta.info/, the request is directed to the mobile version and main page is rendered as shown below
As shown in the screen shot, main page contains a search text box for searching route, stop code etc along with example searches just like the desktop version. It also contains Nearby Stops and Nearby Routes buttons for location aware browsing. These buttons return nearby stops and routes respectively based on user's current location. Entering a route in search box shows results as shown in the images below.
The results page shows service in both directions on the entered route. It also shows the stops for each service on same page. If the stops have buses approaching, the bus status is updated next to the stop name. The page also has a "Refresh" button which shows when data was last updated. The page is updated frequently to display the latest data but it can also be updated on demand by clicking this button. Clicking on a stop displays the bus status for that stop as shown below
Clicking on the stop displays bus status for that stop and distance between the approaching bus and the stop.
The system can also be used by searching stop code, intersection or location instead of searching a route.