SBS Transit Website Revamp

Project Planning

• Discussion between the team on the project brief that was received, to see what we could understand from it and was there any questions that we would have for our client
• Drafted an email on the same day to clarify on certain aspects mentioned in the project brief
• Discussed about the project plan for the next two weeks, which was helpful where we could allocate and try to adhere how much time should we be spending on certain tasks

SBS Transit Analysis

• Performed heuristic evaluation on the website to find out what we were dealing with and if there were any issues that we could identify
• Noticed that the information architecture of the website was not optimal
• Did further research on the website and found out that 85% of visitors are from mobile
• Researched on the business model of SBS Transit to found out more about the Bus Contracting Model (BCM) 
• With the information about BCM, we had an idea of what role SBS Transit would have in Singapore's public transport services
• Did competitive analysis on various other transport service websites to serve as good examples

User Reseach

• At this point, we needed to decide on the research methodologies that was required in order to proceed
• User interviews - to understand the commuters travel needs and pain points
• From the user interviews, we plotted an affinity map which assisted us in finding out what was essential to the commuters and what would trouble them
• Card sorting - to re-organize the information architecture of the website
• With card sorting, we conducted both an online and physical test. With the results we could see how would users categorize various information into sections that made sense to them
• Usability testing on the existing website - to see how users would navigate the website with given tasks on performing key services
• Results from the usability testing made clear to the team on what needed to be improved on the website
• We went ahead to create a customer journey map based on the local Singapore commuters, to plot out the opportunities that the SBS Transit website could take on

Wireframing for Version 0

• With the data from the research phase, we had to do a feature prioritization on the items to go along with the key services
• Our three main tasks that we wanted to focus on was MRT route planning, Looking up bus information and Planning a bus route
• Also we decided that we would focus design for mobile first since 85% of the website traffic is from mobile
• Even though the team worked on the phases together till this point of time, each of us might have different ideas on how we would envision the key screens to look like
• We decided on doing a design studio between the team, where we would get together and set a time-box to sketch out the key screens
• Once we were done, each of us presented and received feedback on our own sketches
• Following that, we sketched up a version with ideas from the design studio where we agreed on would work best
• We moved on to digitize the prototype to perform usability testing to get feedback for it

Prototype Version 1

• With the feedback from the usability testing, we further iterated and refined the fidelity of the prototype as well
• Performed another round of usability testing to validate the changes and the general look and feel of the website

1. MRT Route Planning

• The existing website only had guides for train services that was handled by SBS Transit(DTL, NEL, LRT), and this feature was not functional as well
• Based on user research, users expect transport operators to have information on all MRT lines in Singapore. Therefore we added a MRT Route planner to address that
• With our solution, users will be able to select the starting and end destination and be provided with travel time and cost, first train and last train timings as well as if there are any train disruption notices
• The selected route will be highlighted on the overview map of the MRT map too

2. Looking up Bus Information

• The existing website made finding information difficult and tedious as you had to know the exact bus stop name and bus service number in order to proceed
• With our solution, users will be able to enter a location and be provided a list of bus stops situated around that location. Information about Bus stop IDs and distance from the user are also provided
• On selecting the bus stop, users will be brought to a page with the bus service numbers that are servicing that bus stop
• The information that will be provided are the bus service timings for three buses away, the occupancy of the bus(based on color indication) and whether the bus is a Wheelchair Accessible Bus(WAB)
• Following that, users are able to obtain more information about individual bus services to find out the bus route for it

3. Planning a Bus Route

• As mentioned above, the existing website required specific information that a user might not have on hand in order to proceed with journey planning
• With our solution, users can enter the start and end destination and be provided with travel options based on fastest traveling time or least walking required
• Within these options, provided information are the total traveling time, time on bus, amount of distance to be walked, bus service number and next bus timing
• On selecting the preferred travel option, detailed travel information for that route will be provided. Such as walking directions to the bus stop, list of last three bus stops before alighting