Follo: Single-window navigation application
Project Timeline
Project Scope
Tools & Softwares
May 2022 - August 2022
-
Problem Observation, Identification & Definition
-
User Survey to validate the problem.
-
Secondary Research.
-
User Interviews and Personas.
-
User journey and empathy mapping.
-
Wireframing the interfaces.
-
Heurtisting evaluvation.
-
User - Testing
-
High-fidelity prototypes of the application.
-
Sketch
-
Adobe Illustrator
-
Figma
Background
Toronto is one of the top cities in Canada which welcomes the highest amount of Immigration population. As newcomers to Canada, predominant immigrants don't have the financial capacity to afford private transport. Toronto's public transport TTC is the most used means of transport by both Toronto residents and newcomers to the city. Toronto TTC services run across the entire city. The newcomers including myself find it difficult to comprehend the context and often face a situation where they board the wrong transit or walk toward the wrong platform within the stations. Especially during the harsh winters, going to a bus stop and waiting an hour for the bus is one of the most significant pain points that most newcomer experiences.
Research
Hypothesis Validation
I started the validation process by doing secondary research to understand the predominant age group of TTC users and their frequency of usage:
-
According to statistics from Statista, predominant Immigrants moving to Toronto are from the age group 20-39 years.
-
Around 50% of the Toronto population uses the TTC for their commute on a regular basis.
After the secondary research, in order to validate the hypothesis I conducted a user survey among 15 respondents of the target user group. The survey revealed:
-
Around 70% of the respondents felt that it is a problem that they face and required a solution.
-
A few pain points mentioned by the respondents were inefficient signage within the stations, wayfinding difficulties within the station, anxiety about boarding the wrong subways or missing the transit, and a hard time comprehending the directions.
-
Features suggested by the respondents were service alerts, real-time transit updates, directions towards amenities in the stations, application leading the user to right transit.
Persona
Based on the user research and survey, two key user personas were recognized.
Problem Statement
"How might we provide directional guidance and make the newcomer's commute on the TTC convenient and less anxious?"
Ideate
User Journey
I started by mapping out the user journey of the primary target user and their emotions & needs at every step to understand the gaps and optimize their experience
_edited_edited.jpg)
App feature Identification
Based on my findings from user flow and user journey, I started mind mapping possible features that the application can provide and also conducted a workshop with 3 target users to narrow down core functions.
.png)
Based on my ideation, I narrowed down the key functions:
-
Route from Point A to Point B - Users can find the directions to their destinations and can also save their favorite route for ease of access.
-
Indoor Wayfinding - Directional guidance within the subway stations to help users find their way to their transit.
-
Interactive 3D guides - 3D interactive guide bot/avatar will accompany the user and interact with the user throughout the journey.
-
Realtime Transit Information - The user can access and contribute to live GPS updates and crowding information about their transit.
Design
User Experience Theme
After identifying the features of the app, I created the user experience theme to create a positive and meaningful experience for my users.
Prototyping
Before developing the low-fidelity wireframes, I started by creating basic screens and tested them with 5 target users to gain feedback and insights to develop the next iteration.
Few key insights/feedback from the user interviews were:
-
More description about the need for an avatar or AR guide bot to be provided for the user.
-
A clear distinction between different modes of transport is to be provided.
-
Providing options for users to return to the previous screen or to exit the navigation should be included.
-
Mention information about the station name and the map that the user is viewing.
Wireframes
Based on the feedback from the draft prototype, I started by creating low-fidelity wireframes. I faced difficulty initially in developing the AR feature and I made my user flows more complicated by bringing in too many features to the interactive element. But receiving feedback from professors and potential users, helped me to simplify my user flow and focus on the core functions of the app.
High - Fidelity Screens
After the process, I started to create high-fidelity screens. I conducted continuous user testing as I developed my high-fidelity screens and heuristic evaluation to detect usability issues that user may face while using the app.
Reflection
This was the first time I started developing a UX project from identifying a problem to creating a functioning prototype for the solution. It was a great learning curve for me. Initially, I felt confused about the project but with the help of my tutors, peers and collaborators regular feedback and guidance I was able to navigate through the project.
A few key learning were:
Be specific with the features - I was focusing a lot on addressing and solving all the user pain points and creating an app with all functions. But from the feedback, I changed my direction and focused only on the core functions.
Do not rush into the high-fidelity design phase - I assumed that I should start the design phase soon without gathering user feedback, but I soon realized that the user perception of using the app was different and I was redoing the screens. It is important to do user testing before looking at the visual aspect of the screens.