Road to a redesign — A UnitransNow UX case study

Design Interactive
8 min readSep 30, 2020

Starting Route

Project Overview

Our team redesigned the UnitransNow Mobile app over the course of 6 weeks. The main purpose of the app is to provide students with updated information about the bus schedule, local bus stops, and arrival predictions for various lines that run throughout the city of Davis.

The current UnitransNow experience

Upon our first interactions with the app, we found that features like the map, messages about bus lines, and options to other routes were not the most intuitive. They mainly lacked the ideal functions found in other navigation apps that we personally use when getting around with Unitrans.

We redesigned the UnitransNow app to make it faster and more intuitive for students to access all the information they need to take the bus.

Meet the Team!

The UnitransNow Crew

The Problem

Problem Statement

From our research, we articulated our problem statement, which was key in navigating us through our design process.

“College students at UC Davis find themselves using various resources to navigate the bus system because the UnitransNow app does not sufficiently compile all the necessary tools and resources in one place.”

From there, we set our goals to make the app more intuitive, consolidate information better, and produce a simpler layout.

The Riders

Users and Audience

UC Davis is known for its efficient public transportation system, and college students commonly use UnitransNow to check bus times at their frequented bus lines, navigate their way to new places, and receive helpful updates during their bussing journey.

Running into a Flat Tire

Scope and Constraints

  • Time constraint
  • Remote work
  • Learning curve using Figma

Process

Understanding our audience

To better understand how people navigate and perceive the UnitransNow app, we conducted nine user interviews. Given our time constraints, we found surveys to be a relatively fast way of collecting the demographics of the students at UC Davis using public transit.

To better understand how people navigate and perceive the UnitransNow app, we each conducted 2–3 user interviews virtually. People who were new to using Unitrans and didn’t know all the stops or bus routes often found themselves very limited and stuck without the capability to search within the app. Additionally, about 80% of the participants we interviewed found themselves juggling between several transit apps in addition to UnitransNow to receive all the information they needed to complete a trip successfully.

“It is hard not having a search feature, I would like a way to put in a location and have it tell me the nearest bus stop because I don’t know the lines” — Sophia Acker

Re-Routing

Reframing the Problem to Ideation Phase

We organized the observations from our user interviews to identify patterns on how they were using the current UnitransNow app. Our group discussions about our interview findings revealed that current users liked the simplicity of UnitransNow.

Through competitive analysis, we compared and were able to draw inspiration from reliable resources students were already familiar with, such as Google Maps. Common features throughout these platforms included the to/from feature, a time table, notifications, and navigation bars, which help the user get from point A to B purely using Unitrans. Through these discussions, we began to dissect the features of the UnitransNow app.

We noticed that the app lacked functions that accommodated users who were unfamiliar with the bus system and found that there were quite a few features that weren’t being used well or used at all, such as the bookmarks, messages, and the nearby tab. We decided to prioritize features that would make the whole journey of navigating the bus system more user friendly to those who are new to using the Unitrans bus system.

During our ideation phase, we recognized we needed to display information clearly without overcrowding the mobile screen and had to figure out how to organize information effectively to introduce proposed solutions. Another major consideration was determining how to make the app accommodating for first time users, such as students who are new to the Davis area or who are not familiar with the bus system.

Operations and Maintenance

Sketching for a Solution

In our sketches, we drew inspiration from existing navigation apps and tried to recreate features that would help students “plan their trip” more effectively.

Since UnitransNow is used for navigation, we felt that the map should be immediately accessible upon opening the app. We sketched prototypes of what the map would be primarily used for, whether it would serve as just the to/from search feature or as a live map for saved bus lines. A filtering function was incorporated into the map to help students when searching for a specific route. We wanted each individual route to have their own page with the time table, map options, and shortcuts to arrival times from one bus stop to another.

We considered having a section on the landing page for “upcoming trips” where the user could create a new event (like in Google Calendar) and plan their route ahead of time. This would be helpful for students if they decide to take a different bus line or visit a new place. However, this would be more of a rarity than a recurring event, so we chose to not include this feature.

Finally on the Road

Low fidelity/Mid Fidelity

In our low and mid-fidelity prototype, we wanted to explore options that would increase usability and consolidate important resources in one place. We wanted to eliminate the need to switch back and forth between different apps and resources in order for the rider to be able to see when their bus was coming.

We decided to implement several new features into the UnitransNow app, which included:

Time tables from Unitrans

  • This would be a reliable place for riders to refer to when their app is not loading the predicted times or is being uncooperative. Riders would be able to download the time table to refer to later, if needed.
  • There are times, however, when the buses do not run on the specified times on the timetable. This may pose confusion to the rider if they are not already familiar with what times that their desired bus actually runs.
Flow for finding the time tables

Live map feature

  • This shows exactly where the bus is in real-time. Users are able to track down the bus and see how close the bus is to coming to the stop.
Flow for navigating to the live map feature for the bus

Navigational map feature

  • This feature can tell the rider how to get from point A to B using the Unitrans bus system. This will help to eliminate any confusion regarding how to navigate Unitrans.
  • Oftentimes, however, the rider may need to transfer at one of the terminals on campus in order to get to their destination. For those who are new to using public transportation, this may be a little confusing.
(Mid-Fidelity) Flow for “to-and-from” navigation feature

Almost There…

High Fidelity & Design System

Walkthrough of adding a stop to the homepage

In our high fidelity prototype, we worked on refining our designs, as well as taking a look at some of UnitransNow’s current features to see how they could be improved. Instead of a Bookmarks tab that the app currently had, we transformed it into a more robust section called “Your Stops.” This feature helps users save their most-used stops so that they have easy access to them on the home page.

Walkthrough of the navigational feature

One of the biggest features of the new redesign of UnitransNow was the navigational map feature. For many, the bus is the main source of transportation not only going towards the UC Davis campus but throughout the city of Davis as well. However, it’s not always easy to navigate public transportation, especially if you have never taken it before.

Bus systems are never perfect. Sometimes, things come up that may delay the bus, or there might be a special schedule running at a particular time. With the implementation of an announcement system, riders are able to see important updates regarding Unitrans.

Announcements Feature

Arriving at our stop

Outcomes and Lessons

At a glance, our major contributions to this redesign involved creating a home/landing page so that the user’s saved information could be accessible from the moment they open the app. This includes bookmarked bus stops and new announcements, which was also a feature that was previously nested within each individual route in the old app. Now, people could see up-to-date information regarding their saved bus lines or plan sooner if any delays occur.

After compiling all our information from our competitive analysis, we found that many people needed used apps in addition to UnitransNow because they sought the “to-and-from” feature offered through Google Maps and other resources. We created a separate tab for the maps feature, which not only would help people estimate the travel time and distance of the route they plan on taking but also suggest alternate routes, just in case.

Tidying Up

Planning for the Next Trip

Usability testing was smooth sailing (or driving), except that we conducted our test runs near the end of our project — the reason being that we felt even the little interactions and finishing touches were what made the experience unique apart from the original UnitransNow app. Thus, we weren’t able to incorporate the feedback we received in time for Presentation Day, but we do wish to make improvements based on responses from usability testing. Further development would likely include creating more seamless transitions between the pages, refining the accessibility of information specific to each bus line, and improving the customization settings of the overall app.

We hope our redesign of UnitransNow can allow students to get places faster and smoother.

--

--