Part 2 : UI Re-design on Mytransport.SG
This is a UX case study report on a transport mobile application, Mytransport.SG.
Introduction
This Design Sprint project done in collaboration with 5 UX designers over the course of 6 weeks. In this 6 weeks, our team made use of Design Sprint methodology to identify area of focus in MyTransport.SG, ideate solutions and quickly iterate prototypes to test out new ideas.
Meet the team
Team meeting in progress.
Everyone in the team played a part and took on different roles:
Lee Le, Decider
Ain Sahimi, Facilitator
Intannur Ain, Team member
Huang Junyi, Team member
Sean Neo, Team member
The design sprint was done mostly remotely due to the safe distancing measures during the COVID-19 pandemic. We made it up by using Zoom and Miro to help us through this project.
Background Information
Existing MyTransport.SG Application with a 2.4/5 Rating on Apple Store.
The MyTransport.SG is a mobile application commissioned by the Land Transport Authority (LTA) in the year 2011 to provide users with navigation and transport services in Singapore.
Despite multiple updates and revamp of the application, MyTransport.SG has consistently received low ratings and to date has a rating of 2.4/5 in the Apple application store.
Design Challenge
The objective of this project is to identify a particular problem area, iterate and test solutions to validate if new proposed design improve users travelling experience in Singapore.
About Design Sprint
The design sprint methodology was developed by Jake Knapp, a former designer with Google Ventures. Design Sprint 2.0 is a 4 days process with the principle of learning early and validation through testing and getting valuable data from prototype. This helps the team develop products that are more in lined with user needs and compress potentially months of development into a single week.
Our Design Sprint timeline
Design Sprint Process
Design Sprint is typically completed within a week. But for our learning purposes, this design sprint project was completed in 6 weeks to enhance our learning.
Map (Week 1): In this week, other than asking and hearing from the experts, we sought out on setting the tone right for the sprint. We determined our long term goal, listed sprint questions to raise concerns and narrowed our broad challenge into specific target for this sprint.
Sketch — Produce Solutions (Week 2): We conducted lightning demos to get inspired and undergone the 4-step sketch process where we took notes, ideate, drew rapid variation of ideas and detailed solution sketch.
Decide (Week 3): Through processes like heat-map, speed critique and straw poll, the winning solution was then voted to be prototype.
Storyboard (Week 4): We conducted user test flow to prepare the steps for prototype and sketched exactly what would be in each step for storyboarding.
Prototype (Week 5): We made use of the software Marvel to design our prototype.
Test & Learn — User Testing (Week 6): We conducted our usability testing with 5 users. Testing results were then synthesized to find out the challenges and what worked for our prototype application. This helps to guide the team for future development.
Week 1 : Map
Ask the Experts
As our roles are now defined, it was time for us to scope out the project. Having done user research on the MyTransport.SG, each member of the team begin sharing key insights discovered during the research.
We listened to each sharing, while each members took down their own individual ‘How might we…’ statements. This allowed the team to expand, look for opportunities or challenges and think deeply of the possible obstacles.
Turning insights into opportunities.
Each member was then given four votes on which ideas they think the team should pursue. The team then gathers again and identifies the most voted questions and further discusses and challenges the questions.
Voting Result for our ‘How Might We’ Questions
Among the ideas that were voted, we also identified a overlapping pattern among the voted post-its. We discussed and decided to classified them together.
The results for this voting were as follows:
How Might We cater the app functions to be more customixed?
How Might We find a focus target audience for the application?
How Might We rebrand the app so that it is not just a government app?
Long-Term Goal
Now, we had to define the long-term goal for the product that reflects the team’s principals and aspirations. First, each of us individually set out in establishing a 2 year-goal for the product.
Our Long Term Goal in 2 Years.
When that is done, we gathered as a team again and voted.
Once again, the team, except for the decider, were then given 1 vote each to cast on the most sensible goal. Thereafter, the decider of team, who has the ultimate say on finalising the long-term goal, comes in and decide on the goal which he or she thinks will be ideal and achievable in the next 2 years.
In this project, the proposed goal of — ‘In 2 years time… Our product will be used by Singaporeans as their go to travel app!’ has shown to be in favor by both the majority of the team and the decider.
Sprint Questions
Moving forward onto deciding our sprint questions, we individually proceed in identifying potential challenges we might face with the chosen long-term goal by laying down constructive questions.
Brainstorming for our Sprint Questions
Each of the team members were given three votes each to cast on questions that needs solving and and could be of a great positive impact and improvements to the Mytransport.sg app.
Voted Sprint Questions
Filtering out the top voted sprint questions, we came to a agreement where ‘Can we… make the app easier to use for our senior citizen or handicapped users?’ is a subsidiary of ‘Can we… provide a service that is relevant and able to help Singaporeans from all walks of life’, thus combining this two potential sprint questions as 1.
We then took the voted sprint questions and further take it on an open discussion.
Challenges: We realised that we were unable to proceed with the potential sprint question that focus on users with physical disabilities or special needs as it requires an extensive amount of research and data. We then decided to keep the sprint question in a more general terms of :
Can we provide a service that is relevant and is able to help Singaporeans from all walks of life in their daily commuting.
A second sprint question that we also took in consideration for this sprint is
Can we make the application customizable for their different needs?
This session is fundamental to move on to the next step in making sure all the team members agrees and are on the same ideologies.
Map and Target
As the name suggests — Map and Target, is where decide on a particular area that we wish to target on for the rest of the sprint.
We listed down the end-goal of the a user which is for them to
Reach their destination successfully and/or with all the information being available on the app.
We then also classified the main users of the Mytransport.sg app —
Public Transport Users
Drivers
Cyclists.
Mapping out user flow to target on one area we want to focus on.
We then took our time to map out with the aid of ‘HMWs’ questions that we had created earlier to help us identify an area that is worth working on.
Target for our Sprint.
Through voting and decision made by the decider, it was clear for the team to bring our attention of this sprint to our target — Public Transport Users.
Week 2: Sketch — Producing Solutions
In week 2 of our Sprint, we focus on ideating on possible solutions.
Lightning Demos
As part of the lightning demo session, we wanted to share as many ideas as possible to get the team inspired and going.
By sharing interfaces and ideas from existing application and web, we hope to push the team towards the right direction in creating an interface where user would enjoy using.
Ideas from Lighting Demo.
Some ideas from our Lighting Demo session includes :
Google Maps — Breakdown of bus stops, the duration in between transits, Navigation Guide, etc.
Office 365 — An overview of the various softwares, where users are able to customise based on whichever softwares they used most often.
Visit Singapore — Filter & Sort out the features that users may want/need
gothere.sg — Sorting out of routes and providing key information.
Taking into consideration to the various ideas and its relevance to our product, we made sure to remix the feature a little bit so that we are not blindly copying the idea.
4-Step Sketch
Perhaps the most intensive part of the sprint, it is time for us to make use of our creatvitiy as each of us was tasked to come up with tangible ideas that will be used for our protoype.
Overview of the 4-Step Sketch Process
Part 1: Note Taking (20 minutes)
Here, we spent 20 minutes writing down words to describe our Long Term Goal, our sprint questions, favourite demos or anything at all to get our creative juices flowing.
Part 2: Doodling (20 minutes)
Looking at the notes we have done above, we started doodling our ideas that we would want to start exploring and just kept drawing.
Part 3: Crazy 8 (1-minute x 8)
An example of a Crazy 8 sketch by one of our team members.
Here, we folded A4 sized paper 3 times to get 8 rectangles and challenge ourselves to draw 8 variations of the same idea within 8 minutes.
This section was the most challenging for us because we had to do it in silence without discussing it with anyone. We also had to push our boundaries to innovate out 8 different ideas within short 1 minute time frame.
Thankfully, this segment was forgiving on the solution and did not had to perfect. Why? Because the main objective is to just keep drawing!
Part 4: Solution Sketch (30–45 minutes)
Finally, its time to show what we had in mind!
Our Solution Sketch
By using 3 pieces of A4 paper, we took not more than 30–45 minutes to come up with our solution sketch individually. Our sketches will have to speak for themselves for the rest of the team to be able to understand. Even if it is obvious enough, we still had to explain and write down every detail of our drawing as all sketches will be kept anonymous and we will not have the chance to explain our idea.
We also made sure to give our own masterpiece a name!
Week 3: Decide — Vote on Solutions
Week 3 of the Design Sprint session is where we voted for the best solution and decided on how to build the prototype. There are many voting steps for this session but it was the Decider who made the final call to the prototype.
Heat-Map
During the Heat-Map exercise, we chose the right solution to be prototyped by voting the most interesting sketch prepared during the first week.
Refreshing ourselves with our Sprint Questions, we spent a few minutes doing quick research and review on each other’s solution sketch. Following which, we(excluding the decider) then voted for whichever idea that had potential.
Voting on Solution Sketch.
Among all the sketches presented, the majority voted on following idea :
Customize available transport features
Ability to expand and hide the features’ interface.
We all felt that it addressed one of the Sprint Question and also makes the user interface clean and user friendly.
Speed Critique
This exercise is about calling out the ideas with the most red dot stickers. The facilitator will walk through the solution and and a Scribe will summarise down the big ideas and any other important issues.
This process is not to describe every single part of the concept presented but its main point. Here, team members can also ask questions and seek any clarification.
Speed Critique
Some of our discussion include:
Having personalised features
Having an alarm notification feature to help user on their journey
Having travel related news flash
Having various features customisable for users based on their needs.
Straw Poll
Everyone except the Decider will look back at the top voted concepts, and decide on concepts or part of the concept that they think the team should prototype and test. Each team member is given three blue dots stickers to choose their three favorite ideas and gave a brief explanation of their vote(s) with a sticky note placed beside the idea they chose.
Below are the 3 favorite chosen ideas:
Organized transport feature in an expandable window below the app
Filters to explore different amenities on the map
Personalized feature such as greeting message to the user when login
Supervotes
The supervotes are the ultimate decision where the Decider picks up the concept or feature which will be built to prototype. The Decider was given 6 green stickers to vote and can either cast all 6 supervotes on 1 whole sketch or vote up to 6 ideas.
Our Supervotes Results
The Decider voted for 2 concepts which was interesting and good to have for the user.
A personalized greeting message.
Filtered amenity feature.
Our final solution
Based on the two voted solution sketches, we did a mix and match to come up with the wireframe for the landing page and map page for our final solution.
Week 4: Storyboard
This week of the exercise is to use storyboarding to form the step by step solution to the problem which will be helpful for building our prototype. A User Test flow was done before storyboarding to speed up the processes.
User Test Flow
During the User Test Flow exercise, each team member wrote down the 6 story steps individually on how the user will navigate through the app to reach his/her final goal.
Everyone except the Decider will then use a red dot sticker to vote on the row they think has the clearest story. After which, the Decider takes 1 green dot sticker to make the final choice and also use another green dot to vote on 1 action in other rows that would be interested to include in the storyboarding process.
Our User Flow in a summary
Here is the chosen steps :
1. Launch the app
2. First-time user create account
3. User personalized features available
4. User use the journey planner and search for an address
5. While looking at the map, the user can use filters to look at other amenities
6. Follow the instructions and reach the destination on time
Storyboarding
Finally, before we can start prototyping, we had the final step to take — Storyboarding. The purpose of this is to leave no open questions for the prototypes.
The team started by drawing a grid with 15 frames followed by inserting the winning User Test Flow into the first 6 frames.
First draft of storyboarding
Next, we review all of the solution sketches and re-use any drawings that are similar to any one of the User Test Flow story. This is to help us save time and not having to draw or find images for the storyboarding process.
Final Storyboarding with images
We started with the first frame and worked our way to the last frame of the storyboard using images online to represent our ideas. Along the way, we expanded or inserted new frames while ensuring that we kept the storyboard within 15 frames. We also had to make sure not to add in new ideas that were not originally chosen.
Week 5: Prototype
Here comes the exciting part in watching our ideas come alive! Based on our user flow & storyboard, a high fidelity prototype was created using Marvel, hoping to reach the goal of :
Improving the journey planner of the app
Making the app more personalized for users
Integrating various features into the app.
Each team member was tasked with a role that includes :
2 Maker — Responsible for the skeleton and wireframing of the app.
2 Asset Collector — In charge of the visuals of the prototype.
1 Stitcher — Final touches and making sure every page runs seamlessly.
Our Challenge
Low Fidelity Wireframe Sketch
Halfway through prototyping, our team had to re-evaluate and revisit the user flow & storyboard as we found some loopholes & blind spots. We then discussed and sketched out a rough wireframe for more clarity and detail. Now, with a better picture in mind, we were then able to improve our prototype accordingly.
Our final prototype done on Marvel.
Week 6 : User Testing — Moment of Truth.
After the completion of our prototype, we sought out to test and gather feedback for it — allowing us to uncover any other blind spot that we may have missed out.
We set out to test the prototype with a total of 5 users — the golden number for user testing.
As our team worked remotely the majority of the time, we tasked each member to conduct 1 user test each at their own time. Our interviewees were aged between 26–30, and all of them either heard of or used Mytransport.sg App before.
To ensure our user testing interview run smoothly without any hiccups, we create a task guide and a list of questionnaires to ask the user. This is done to help us better facilitate user testing in a smoother manner.
Task :
You are an existing user of mytransport.sg. Login to your account and start using the app. You are in a rush to meet your friend at Plaza Singapura. Use the app’s journey planner to find your way to Plaza Singapura via Public Transport.
Now that you have found the best route, you are on your way via the route. Continue your journey and see what else the app can do for you!
Post Testing Questions
How was your experience? How is the flow?
What are your thoughts about the alarm?
What are some of the other improvements you think the app can have?
Note if the user taps on any other functions that we did not link up
if they swipe up to see the feature can ask them why did they do that.
Anything features that they like.
What would they expect from the filter tabs?
In addition, prior to the testing, we also stressed to the user that the focus of this testing is the prototype and candid and real feedback would be the most valuable.
User Testing Findings
Now that we have made it through the testing, it is time to make sense of the feedback given to use and reflect on our findings.
Upon sharing our interview findings, we then narrowed down and sieved out the important insights that we found and classified them as either positive, neutral or negative feedback.
User Testing Findings Table
We created a table and classified our user testing findings accordingly.
From there, we then looked for distinct patterns among the responses collated. A pattern that showed up recurring from at least 3 different users.
User Testing Pattern Findings
What worked?
The user used the recommended route (5 Users)
The alarm function is useful. (4 Users)
They liked the bus arrival timing feature (3 Users)
Challenges
Instructions on the screen may not be clear enough. (4 Users)
Map/Route must be zoom-able/move-able. (3 Users)
Feature not applicable to the user or never use (3 Users)
Overall, there is a mixture of positive and negatives feedback for the prototype. Thankfully, some of the features that we purposefully included yielded a positive outcome while at the same time, we also uncovered issues that can be further improved from the negative feedback provided.
Sprint Reflection
As our 6-week sprint journey is nearing its end, we look back at the goals and objectives that we wanted to achieve and reflect on this project.
Our long term goal was:
2 years’ time, our product will be used by Singaporeans as their go-to travel app even for people with special needs.
While it is not conclusive at the moment. But with baby steps and many improvements to be made along the way, we believe with the combined effort, it is possible that the Mytransport.sg app becomes Singaporeans’ go-to travel app. Hopefully, we will eventually also make the app more inclusive for even Singaporeans with special needs.
Sprint Questions
Can we provide a service that is relevant and able to help Singaporeans from all walks of life?
A tentative Yes. The app provides Singaporeans with a service that allows them to help and guide them through navigating this little island. The app also has extensive features that are able to help people from different walks of life, be it drivers, public transport takers or avid cyclists in their wayfinding.
Can we make the application customisable for their different needs?
A work in progress — as it requires a lot more research and data to further understand what are the needs and wants of each different user demographic before we can create cohesive customisation for users.
Recommendations
Moving forward, some of the steps that we can take now is to :
Taking the negative feedback and turning them into opportunities by improving the prototype and hopefully fix the existing issues.
Gather more data to better understand the user and their needs.
Continue doing more sprints to further improve the other parts of the app.
Our final takeaway
On the final note of our sprint, some of the takeaways that we learnt as a team.
Given the tight schedule of the sprint, we managed to target and resolve some of the questions that we sought out to answer.
Design Sprint in a remote setting is challenging as it may lack clear communication between team members. Thus, we had to put in extra effort and make use of other tools to overcome this gap.
There are still much to be improved from our prototype but everything is a work in progress and there are always learning outcomes that we can take away even if it is not 100% successful.
It is important to stay on track and align to our goals and always refer back to the Sprint Question.
This marks the end of our Design Sprint Journey. Thank you for reading and your time. Have a great day ahead!
