01

The Problem

The SouthWest Transit website was originally developed by Avallo in 2015. In 2021, we completed a front-end redesign to refresh the branding and present a cleaner, more modern look. We also improved how the routes were displayed, while retaining the original backend. The underlying programming for maps and route alerts remained unchanged from the earlier development.

A key focus of the redesign was making it easier for riders to access route information quickly. We made the three main tools—Trip Planner, Route Scheduler, and the mobile app download—more prominent in the new design. To simplify navigation, we removed the large top menu and consolidated it into a hamburger menu for a cleaner user experience.

The redesigned site is user-friendly, fully responsive across all devices, and continues to send real-time rider alerts to route subscribers. Additionally, it was built so SouthWest Transit’s in-house graphic designer could easily update photos, edit text, and add new pages as needed.

02

Improved Route Views

Avallo was tasked with improving the bus routes section of the website to make it faster and easier for riders to browse routes and find boarding and drop-off locations. Because the number of routes was relatively small, we used a simple CSV file to manage and display route data on the website. This allowed for quick updates and an easy-to-maintain structure for web users.

For station signage and kiosks, however, we integrated live data feeds to ensure real-time updates for arrivals, departures, and service changes, providing up-to-the-minute information where riders need it most.

We also ensured that the route pages were fully mobile-friendly for users who prefer not to download the app (see Responsiveness section below). Each route features expandable sections to easily view stop locations and times, with a clear eastbound and westbound split for simple navigation.

To further support riders, we added features like route-specific alert signups and embedded route maps for a complete, at-a-glance view of each route.

 

03

Rider Alerts

Route alerts are crucial in keeping riders informed when buses are delayed or routes are canceled, most often due to weather conditions. Clear, timely communication can make the difference between a smooth commute and a frustrating experience, so maintaining a strong alert system was a top priority.

Building on the success of the previous website, we carried over the existing route alert functionality. Alerts were programmed to scroll visibly across the top of the website, ensuring that any updates were prominently displayed for all visitors. In addition, riders who signed up for notifications received real-time email alerts specific to the routes they were interested in, allowing them to plan ahead with confidence.

Behind the scenes, the system was designed for ease and speed. Administrators could quickly create a route alert, assign it to one or more specific routes (or all routes when needed), and publish it with just a few steps. As soon as an alert was posted, it appeared instantly on the website and automatically triggered emails to the subscribed riders, and no extra work was required.

04

Responsive Design

The new website needed to perform seamlessly on phones, tablets, and desktop computers. Avallo put significant effort into designing and programming a truly mobile-friendly experience, ensuring riders could easily access all transit information on smaller screens.

One of the most significant improvements was how bus routes and stop times were displayed. Instead of forcing riders to zoom or scroll awkwardly across a large table, each route was carefully laid out in a single, streamlined row format. Stop times were listed and easy to read without overwhelming the screen. Riders could quickly expand or collapse route details with a simple tap, making viewing only the information they needed easy.

Overall, the entire site was designed with smooth, intuitive scrolling in mind, enabling riders to easily find schedules, maps, and alerts without feeling lost or frustrated. Every piece of content was optimized for readability and ease of use on any device, supporting riders on the go.

View the website here: https://swtransit.org/