AT A GLANCE
By partnering with Guru Technologies, UTA was able to provide a more user-friendly and easy-to-use interface for its riders.
INDUSTRY
Transportation
PLATFORM
Web
KEY TECHNOLOGIES
The Utah Transit Authority or UTA has partnered with Guru Technologies to create a more user friendly public facing interface. UTA makes it easy for commuters, students, and general riders to get around the Wasatch Front with their system of buses and trains running from Box Elder County to Tooele County. They are the go to transportation for Northern Utah.
Being UTA riders, some of the Guru developers noticed an issue with their online schedule system, so they presented UTA with a concept to consider. The UTA system was difficult to use and some riders would even miss rides because of it. Navigating the schedule pages presented several usability challenges. Users initially had to scroll down just to view any of the schedule times. Even after the schedule table was visible, significant scrolling was still required to navigate through it. Accessing times later than 5:30am for some routes still needed horizontal scrolling, but the scrollbar was inconveniently located at the very bottom of the page on a desktop.
These problems were compounded when viewing this page on a mobile device, making it not just an unsatisfactory user experience on their phone, but preventing the user from finding the necessary information for their ride.
Guru developers researched the interactive and print schedules of major transit systems from San Francisco to Spain, taking into account the various ways to display route trips and times in compact but useable forms. They came up with a design that they believed is better than any of them. Developers drew up mockups of the vision (at that time using Adobe XD) and presented this to the team at UTA. They described the nuances of the user experience they had in mind and ultimately got the green light to begin solving UTA’s usability issue.
You will notice the new schedule boasts a more compact design, enhancing both readability and usability. It uses subtle color and shading to prominently highlight the most crucial data: the stop times. Controls at the top are now easier to use, requiring fewer taps, and dedicated “Earlier” and “Later” controls facilitate horizontal scrolling. Notably, clickable stops (the blue highlighted rows) and trips (columns) not only improve navigation across extensive data tables but also enable users to filter and narrow their selection to only the information they need. The design incorporates smooth animations when scrolling or filtering, ensuring users remain oriented and engaged without jarring jumps, along with other improvements.
For the interactive parts of the new page Guru opted to utilize the jQuery library that was already in use on the current page. For animations they used the GSAP library and to get the animations to work just as they wanted them to, both filtering out columns and rows, Guru had to bring more ingenuity to the project. Guru produced JavaScript code that would create a new, duplicate element of a single column and position it over the old one while the main table faded out. Then that column would animate to the left to be right next to the stop names for easy readability. The “duplicate element trick” was also utilized in reverse when the user would “Show All” again.
Guru Technologies published this new page live alongside the existing one for testing and comparing. This also allowed Guru and UTA to conveniently get feedback from friends and family outside the core teams involved. They tested heavily within various browsers and devices. Once everything was ready, Guru published to the traditional URL.
UTA received positive feedback from users about this new and improved schedule page. UTA reported their customer service complaints in this area decreased by 60% because of the work that had been done to improve the user experience. Transit systems from other states have reached out to Guru to do similar treatments to their schedule pages as well.
UTA and Guru Technologies continue to partner for schedule page maintenance and upkeep to keep UTA’s new and improved system running smoothly. Ultimately, the collaboration successfully transformed a point of frustration into a tool of empowerment for UTA riders, streamlining their journeys and boosting satisfaction.