building a transit website around user needs - calact 2016 spring presentation
TRANSCRIPT
Building a transit website around user needs
Aaron AntrimTrillium | [email protected] | 503-567-8422
1.Transit websites from the perspective of their users
2.Accessibility for all3.Find out what
people click -Using Google Analytics
4.Making the most of the website
Users’ perspectiveRiders Board members,
media, etc.Questions:
‣ What route & schedule do I use?
‣ Real-time: When does my bus come?
‣ What is the fare? Policies?
Questions:‣ Latest board agenda
& minutes?‣ Planning documents‣ About the agency‣ Staff names & contact
‣ What route & schedule do I use?
‣ Real-time: When does my bus come?
Users’ perspective
๏ Riders‣ New riders vs. existing riders
‣ Residents vs. visitors
๏ Board members, media, etc.
Design a storefront display
Showcase what you offer, such as:
‣The transportation network itself
‣Freedom & mobility‣Affordability
Administrative & board info highlighted
in purple
First step:
Create a “wireframe” to prioritize limited screen real estate
Selected websitesDesign ideas for transit
bart.gov• homepage
does not require scrolling
• highly multi-lingual
• captures BART brand with colors and shapes
Alaskaair.com• Simple
navigation at the top
• Clean / corporate
• Destination-based marketing beneath the fold
• Mobile-ready
DROP-DOWN NAVIGTION
delta.com• primary “trip tools”
float above feature image
• very consistent branding (Delta Airlines colors, etc.)
LA MetroWhat not to do:Transit website as a maze
mendocinotransit.org• homepage offers
effective “service overview”
• scenic backdrop image
• consistency with printed information
• key information is “above-the-fold”
• Clean but scenic & friendly
sctransit.com• simplified navigation
with “pop-open” drawers• big, central splash
image• consistency with
Sonoma County Transit brand through colors, line elements
• Clean/corporate look
squareup.com• example of current
simple & direct style for websites
trimet.orgOld website; recently revised• busy homepage,
probably overloaded• nice pop-out drawer
navigation• rider testimonials on the
homepage• interactive map & trip
planner is featured
Trimet.org
Mobile view
Friendly about section beneath the fold.
Eldoradotransit.com:• Brand consistency• Simplicity• Information-rich map
Most users will see your website on their mobile
phone.
Our customers didn’t sign up for an easter egg hunt.
Social media:Another field on which to hide easter eggs?
Social mediaProceed with caution!Don’t encourage people to leave your website for a lower-quality experience.
Good for:* Community engagement* Customer service
Bad for:* Organizing service alerts and essential
information
More discussion: http://bit.ly/transit-communication
Real-time information
What is Real-time information?
● Vehicle Positions
● Real-time arrival estimates (trip updates)
● Service alertsRoute 5 is experiencing significant delays
due to flooded roads
● Vehicle Positions
● Real-time arrival estimates (trip updates)
● Service alerts
Real-time information sources
Require automatic vehicle location (AVL) hardware on buses
Can be managed via web-based customer service tools
Route 5 is experiencing significant delays due to flooded roads
Service Alerts
● Your customer service department can manage service alerts
● Requires a web-based tool to translate from human-readable format:○ “Route 5 is experiencing significant delays due to flooded roads”
...to a machine-readable format like GTFS-realtime Service Alerts[1]:header { gtfs_realtime_version: "1.0" timestamp: 1450386709}entity { id: "1" alert { informed_entity { agency_id: "Hillsborough Area Regional Transit" } header_text { translation { text: "Route 5 delays" language: "en" } } description_text { translation { text: "Route 5 is experiencing significant delays due to flooded roads" language: "en" }...
[1] https://developers.google.com/transit/gtfs-realtime/service-alerts?hl=en
Service Alerts Publishing Tools
Google Transit Partner Dash:
● Freely available
● Publishes alerts only to Google Maps
More info at https://support.google.com/transitpartners/answer/6173315?hl=en
Service Alerts Publishing ToolsTrillium Transit Alerts:
● Available as product from Trillium
● Publishes alerts to any app supporting GTFS-realtime Service Alerts
○ Google Maps
○ The Transit App
○ OpenTripPlanner
○ OneBusAway
● Target alerts to particular routes and stops
● Also offers integration to publish same alerts to:
○ Websites
○ Social media accounts
○ Email, SMS, and other Alerts
More info at http://trilliumtransit.com/gtfs/transit-alerts/
Service Alerts Publishing ToolsIBI TRANSIT-alerts:
● Available as product from IBI Group
● Publishes alerts to any app supporting GTFS-realtime Service Alerts
○ Google Maps
○ The Transit App
○ OpenTripPlanner
○ OneBusAway
● Target alerts to particular routes and stops
● Also offers integration to publish same alerts to:
○ Websites
○ Social media accounts
○ Email, SMS, and other Alerts
More info at http://transitrealtime.com/docs/IBI_TRANSIT-alerts.pdf
Service Alerts Publishing Tools
Do-It-Yourself (DIY) open-source tools:● OneBusAway
○ Part of the main OneBusAway server application - https://github.com/OneBusAway/onebusaway-application-modules/wiki/Creating-Service-Alerts
○ A stand-alone web application - https://www.youtube.com/watch?v=roIsmq9R7Wc, https://github.com/OneBusAway/onebusaway-service-alerts
● GTFS-rt-admin
○ A stand-alone web application - https://github.com/conveyal/gtfs-rt-admin
How to share vehicle positions and arrival estimate data?
1.Include RFP language requesting GTFS-realtime[1] or SIRI[2] Application Programming Interface (API) when procuring an AVL system
○ Make sure you retain ownership of your data
○ Require that your real-time IDs match your schedule GTFS data
○ Require that your GTFS and GTFS-realtime data are updated in sync
○ Request the timepoint field in stop_times.txt - it’s increasingly important for real-time
2.Prior to accepting product, test API with at least one app○ e.g., Google Maps
Already have an AVL system, but not a realtime API?
● A good read - “Legacy AVL system? It’s okay, join the club,” https://kurtraschke.com/2015/01/legacy-avl-export
● Open-source converters:○ GTFS-realtime - https://github.com/luqmaan/awesome-transit#gtfs-realtime
○ SIRI - https://github.com/luqmaan/awesome-transit#siri
[1] https://developers.google.com/transit/gtfs-realtime/[2] https://en.wikipedia.org/wiki/Service_Interface_for_Real_Time_Information
On the horizon - open AVL systems
● Choose your AVL vendor to provide vehicle positions
● TransiTime.org - Create arrival estimates from vehicle positions
● OneBusAway.org - Distribute info to mobile apps○ iPhone
○ Android
○ Windows Phone
○ Amazon Fire Phone
○ Google Glass
○ SMS, Phone, and more...
Gives agencies options and ownership of system
● TransiTime.org - open-source project to create arrival estimates from vehicle positions
● OneBusAway.org - distribute info to mobile apps○ iPhone
○ Android
○ Windows Phone
○ Fire Phone
Accessibility for all
More at: http://bit.ly/transit-website-accessibility
What is accessibility?• On the web, access for users
who are sight-impaired and use screen-reader software.
• Federal law (Section 508) defines accessibility requirements.
Accessibility for all
More at: http://bit.ly/transit-website-accessibility
How to achieve accessibility• Write good HTML code,
follow guidelines (https://www.w3.org/WAI/intro/wcag)
• Use an automated checker such as WAVE (wave.webaim.org)
• User testing! Hire a screen-reader user or find a volunteer to use and test your website.
Accessible Not accessible• Images
without “alternate” text
• Maps (!!)• Most PDF files
• Text in an HTML document
• Well-formed tables
• Alternate text that accompanies images
Define “scope” of table headers.<TH SCOPE=”ROW”>Transit Center</TH>
Issue: When there are multiple dimensions of headers
Using Google Analytics
• Cost-free!
• Just insert some code into your website
• Configure monthly reports
What can you discover?
• How many people use your website?• How long do they spend on the site? Various
pages?• What paths do they take through the
website?• Where do they leave?• How do people find your website?
• What search terms do they use?• What links do they click on other sites?
• What devices and browsers are they using?
Making the most of a website in your
marketing program
Trinity Transit: It all started with a map…
Consistent information throughout
Search Engine Marketing (SEO)
• Keywords• Links• Partners• Google search referral performance
