Unitrans Redesign

Shang Lu
Principles & Practice of User Experience
4 min readJun 7, 2015

The Unitrans website was designed to provide bus information to both students and residents at Davis, but the current Unitran website seemed to be not user-friendly, and its design also lacked good artistic feeling as well; therefore, my partner Albert and I decided to redesign the website.

  1. Identify the problems:

After examining the Unitrans website, we found that current website was not user friendly since most the users would have troubles using the Arrival Predictions tool.

Another problem that we found was that the “Plan Your Trip” option can actutally be further improved. Although the current design still works well (routing with Google map is a really good option that Unitrans website included), but we still believe there could be changes made to improve its functionalities.

Besides that, we also found that we needed to find a better way to organize the information provided on the web page. To prove if our hypothesis was correct, I conducted several interviews with my roommates and friends who use Unitrans website/app frequently. The results of my interviews were clear, most of the participants all stated that they often have difficulties using the site to track the bus arrival. On the other hand, they do feel much more comfortable using the mobile app. They also told me the website design seems outdated and little bit “ugly”.

2. The struggles we faced during the design process:

During the design process, Albert and I faced many struggles and problems. Since there were a lot of information that we needed to include in our redesign, we decided to separate the work. Albert was in charge of redesigning the “Trip Planning” section. I was in charge of redesigning the narration parts, for example, the “Home page ”, “Login page”, and “Information page”. This method seemed to reduce the work for both of us, but we later realized that working separately caused us to have different website design.

Albert’s (top) and my previous design (bottom)

Albert also faced some struggles when designing the “Time Prediction” page. Since he had difficulties in including all the information. Since the page was not big enough, there was no much space for Albert putted all the time predictions.

For me, my struggle was how to create web pages that only contain information like “Fare” and “Announcement ”. Albert and I initially came up with a scrolling website idea, but we received some critics that questioned about the accessibility for older people who are not familiar with this kind design. Besides this, we also had time constrain since both of us had trouble scheduling time to meet, and we both had other classes to focus which left us not much time to work on the project.

3. Solution:

I will talk about the solution I came up with, and you can learn more about our redesign in Albert’s documentation.

This is my home page, and this design is inspired by My UC Davis web page. The redesign allows you to use “scrolling down” option which means all the information is included in one page, and all you need to do is scrolling down and click “Discover” to expand the web page.

The redesign also gives you an option to use the control bar on the top. If you click one of tabs, for example, “Fare” then the page will automatically scroll down the web page directly to the “Fare” section.

These are the user “Login/Sigh up” and “My Account” pages that I added in the redesign.

You can purchase your bus pass under “My Account”, and you can also manage your saved trips too.

Conclusion

Albert and I really enjoyed doing this project, and I learned a lot about UX design, and the processes I need to include in my design. There is still a lot of improvement I can add to my redesign, but I am still happy with the new Unitrans website Albert and I designed.

--

--