UX Enhancement - New Iconography For Buses & Streetcars

[AndrewLeach94]

User Story

As a user, I would like the ability to quickly and visually identify streetcar routes from bus routes from the map view.

Tasks

Preview Give feedback

1. Design / Create assets
2. Conditionally append icons to map markers

[its-all-waves]

Hey @AndrewLeach94, any progress on this?

I couldn't find anywhere in the codebase where we actually differentiate between streetcars and buses, but vehicle type data is easy to obtain via scraping, so I've done that. Made a little Go script to retrieve the data in this shape:

lookup by route

{
  "3": { "type": "bus", "name": "3 Tulane - Elmwood" },
  "8": { "type": "bus", "name": "8 St. Claude - Arabi" },
  "12": { "type": "streetcar", "name": "12 St. Charles Streetcar" },
  "46": { "type": "streetcar", "name": "46 Rampart-Loyola Streetcar" },
}

(Annoyingly, not all of the streetcar route names contain the substring "Streetcar.")

I also noticed the route select/dropdown doesn't show route names. I think this data structure would be helpful for the frontend to provide names and vehicle types in the dropdown, as well as during the process of generating the markers for each vehicle.

[AndrewLeach94]

@its-all-waves heya!

Great thinking. And yeah this is exactly what I was thinking as well. Having the names in the drop-down would be extraordinarily helpful. Between work and holiday travel it might be a couple more weeks until I get around to this but if you have the cycles and and want to take this ticket on then by all means you're welcome to go for it!

[its-all-waves]

This is the best I could come up with while effin around in the codebase. These graphics are temporary.

There's a great designer who's interested in contributing, so I was thinking he could design the icons, popups, and the interior of the dropdown menu. @HauntedHamburger

And I'm basically half way there with this issue, so I guess I'll just finish, @AndrewLeach94, if you're still cool with that.

I also want to ask the group:

Where should we mix in the vehicle type data? The backend makes sense, generally speaking (keep work on the server ethos), but I wonder if that would reduce consistency, given the current state of things. Looking at the React app, it feels like we should keep the backend as is, and do this in the frontend.

What do we think? A or B?

• A) Keep it consistent by including data/vehicle_types.json (doesn't yet exist) in the frontend, and query that object for the route type when we need vehicle type data
• B) Mix vehicle type data into BustimeData in the backend before sending to frontend?

[AndrewLeach94]

@its-all-waves I vote to keep things consistent by handling vehicle types in the FE.