Currently it is difficult for people to purchase MTA cards and add funds to their accounts because they are limited to the physical MTA machines found in subway stations, which are outdated and slow.
My app solution, the MTA Mobile App, will allow users to purchase MTA cards and add funds to their account on the go. Additional functionality includes scanning into the subway station with a mobile ticket and being able to check the status of trains.
In order to gain a better understanding of what users would most want out of an app like this, me and my group members interviewed two commuters in New York City who frequently use the MTA subway system using a script we drafted documented below.
From our interviews we found that users most commonly stated that being able to add funds from their phone to skip the lines at the MTA machine, and being able to scan through the turnstiles rather than relying on a physical card which can get lost or worn out over time, would best improve efficiency.
Using feedback from our interviews, I created a user journey map that would help us visualize the typical user experience of adding funds to your card and boarding the subway, and determine pain points that the app could alleviate.
For this project we were tasked with sketching wireframes that would give an overall view of the user flow, and how each screen could serve function to the overall goal
1) Login Screen
2) Guest One-Time Ticket Purchase Screen
3) Home Screen, NFC readable card readily available
4) Add Funds screen
5) Hamburger Menu
6) Train Routes Screen, offers train status (on time, delayed, etc.)
7) Times until train reaches each destination on specific route
Because we weren't able to test anybody who would classify as a tourist to New York City, we had to make assumptions about features they would need, such as a one-ride ticket purchase option, and a breakdown of where each route stops.
For this project we were not given the opportunity to test our designs with users, but instead the professor gave feedback on the wireframes and pointed out areas for improvement for when we designed our high-fidelity prototype.
We weren't tasked with many changes, however were challenge to push the final design to as close to realism as possible by implementing real information in place of the placeholder text and to flesh out the schedules page more.
Taking into consideration some of the complications users had with the second set of testing, I decided to design on on-boarding tutorial to teach users how to navigate the interface. Additionally, I labeled the tabs at the bottom to be more easily understood, and
Embedded below is an interactive prototype.