Student
NUS NEXT BUS VER 2.0
OVERVIEW
NUS Next Bus App is a bus application with its main purpose to allow NUS (National University of Singapore) Students to know the estimated arrival timing of the buses in NUS Campus.
The main goal of this app is to minimise NUS Student’s waiting time for the NUS Shuttle bus.
This was my first individual UX project, where I learned to understand users' experience of a certain product using various user research methods.
ROLE
UX/UI Designer
4 - 26 May 2020 (4 Weeks)
BACKGROUND
To empathise with the users of the Institute of Higher Learning in Singapore, I was tasked to revamp an existing mobile app and propose suggestions on how to improve the User Experience of the app.
I have selected to revamp the NUS Bus App. So, to empathise how the users felt, I did some research on it.
MARKET RESEARCH
Competitive Analysis of Similar Apps
To understand and learn the strengths and weaknesses of NUS Bus App. I performed a Competitive Analysis with 3 Similar Apps and took inspiration from particular features that I find can be useful and be integrated into the NUS Bus App.
Features that could be included into the NUS Bus App
-
Alert
-
Indication of Bus Occupancy
-
Report Page
Screenshots of 3 Apps Features
USER RESEARCH
Understanding User’s Perspective of the App
USER PERSONA
My Target User is an Experienced NUS Bus App user. So, I could identify the existing problems of the current App.
Challenges Faced
There were many User persona templates, but I could not identify which was the best template to use.
How I overcome
I decided to create my own persona to best showcase the App Brand colors and the user personality.
EMPATHY MAP
To understand what are some unpleasant experiences my user felt when using the bus App. I used the empathy map to note down some of the emotions and thoughts the user felt.
Key Findings
Using this method I could find what are the major concerns of the users but not much problem was found as the main issue revolves around the accuracy of the app.
Maybe, experiencing the journey of how she used the app and took the bus personally might have a better insight of what are some of the hidden issues.
A DAY IN A LIFE OF USER
To understand the user better and at which point of the day, does the user use the bus application.
Key Findings
Using a day in a life of user, I could understand my user journey better and imagine what are some of problems she might have felt using the app.
But imagining is still a personal view point, I think personally experiencing the journey would help empathizing the user better.
KEY PROBLEMS IDENTIFIED
SEARCH BAR
(red border)
The search bar looks short and does not really stand out. As a main feature it should look distinctive as compared to other elements, So user can identify it at first glance.
SORTING FEATURE
(orange border)
The sorting button is losing its purpose as it not used and identified.
THE BUS STOP LIST OF BUS SERVICES
(blue border)
It is not obvious to the user that the bus stop list bar is a drop down list, only when the user taps on it, he/she will know.
REFRESH BUTTON
(purple border)
It is troublesome to refresh the bus services one by one, especially when the user is impatient.
BUS INFO BUTTON
(green border)
The original design of the arrow button does not give a clear message of what it does, which is misleading for the user.
MESSAGE PAGE
(black border)
The message page is not used or barely used as it does not serve any purpose for the bus arrival function which is the main purpose of the app.
PROPOSED SOLUTION
CHANGED FEATURES
SEARCH BAR
(red border)
Enlarge the size of the search bar and add a gps location button next to it
SORTING FEATURE
(orange border)
Replace the sorting filter with the GPS location button
THE BUS STOP LIST OF BUS SERVICES
(blue border)
Adding of drop down icon on the bus stop list bar
REFRESH BUTTON
(purple border)
Instead of one refresh button per bus service, Change it to one refresh button to update all the bus services.
Add swipe down gesture for fast refresh
BUS INFO BUTTON
(green border)
Replace the arrow button to bus button
MESSAGE PAGE
(black border)
Remove it, and change to Feedback Page with feedback icon
NEW FEATURES
BUS ARRIVAL ALERT
Alert user when the bus is coming within the time selected by the user
INDICATION OF BUS OCCUPANCY
Using the colors red meaning full, orange meaning close to full and green meaning still have lots of space to represent the occupancy of the bus.
NUS STUDENT TIMETABLE
Allow NUS Student to view the timetable while planning their journey to their class
FEEDBACK FORM
Allow user to give suggestions, complains, report inaccurate timings to the bus app
SETTINGS PAGE
Allow users to change settings such as having a dark theme, show notification etc.
USER JOURNEY MAP
Using the user journey map, I identified how the user explore and navigate the app. I picked up what are some of the potential problems they might face and make improvement on it.
.png)
WIREFRAME
I used the wire frame to get a gist of how the app would look like and how the task is supposed to flow. This was an important step for me to visualize how the revamped app would look like. So, I could make changes before I created the digital prototype.
NUS Next Bus Version 2 Paper Prototype
DIGITAL PROTOTYPE
The digital prototype follows 2 Core Objective:
1) A student wants to use the app to view the nearby bus stop bus arrival timing
2) A student wants to report inaccurate timing for the bus app
Challenges Faced
Showcasing the effects of refreshing the bus list which was one of the main changes on Invision(Prototyping Tool)
How I overcome
Tried to experiment creating a GIF animation and input it on Invision instead of linking it with Photoshop as an art-board.
Results and Takeaway
Doing this project work was not easy, as there is no one way solve a problem. I learnt that there are many form of UX methodologies and not all are used, it all depends on the budget you have. There are also many templates of user persona, user journey, empathy map and etc. knowing how to use them is very important, to be able to reflect the ideas the designer wants to portray. Overall, I think it is very important to plan out, take notes and experiment different UX methodologies to be able to best identify the problems faced and solve them.
More Projects
Dengue Interactive Infographics
