MTA UPGRADE

We were tasked with finding brand that our team was interested in and try to address a problem that that brand had. After a long half day of topic mapping and trying to figure out each member’s individual interests and strengths, we landed on the MTA. The MTA is the largest commuter network in America, but it is so outdated. Users and still using cards from vending machines that were created in 1999. Our problem that we wanted to tackle was to bring that shopping experience of refilling their cards to the online space. It’s definitely been a long process trying to fully understand the ins and outs of the MTA.

RESEARCH

We want to give MTA New York City Transit commuters the ability to buy and refill their MetroCard balances online.

The MTA currently has separate apps that allow for refilling and buying new tickets for the Metro North, LIRR, etc. We want to extend that reach into a more practical application for users of the Subway and Bus systems, and bring the subway station experience of buying, refilling, and checking balance into an online app.

We knew that the MTA kiosks were a huge problem for our users, but we really wanted to address the why. We created a survey to better narrow down the group that we were trying to target, and from that we performed both contextual inquiry and user interviews.

We began our user research by putting together a survey to screen potential interviewees. Of our 49 respondents, we selected 15 individuals to interview, including people who have leftover MetroCards and those who don’t, and people who have taken different transit systems. We wanted to get a sense of how often people fill their cards and buy new ones, but also their general online purchasing experiences and habits.

COMPETITIVE/COMPARATIVE ANALYSIS

It was difficult to find a competitive system to an online MTA refilling app because nothing of this nature exists at the moment. We were able to look at a lot of comparatives from other cities that already have the ability to purchase and add money to their metro cards online.

We were able to use this analysis to see the features that we absolutely needed to have and model those after the Clipper Card based off the heuristic evaluation. We wanted to address the creating of and account / signing in, adding a card to that account, and adding value to the cards.

After taking a deeper look into the user flows, we were able to find a general baseline for the features that we wanted to incorporate. We noticed a pattern of 3–5 steps for each of the aforementioned tasks and we knew that our app had to either achieve that goal or surpass it.

USER INTERVIEWS

Conducting user interviews yielded a couple of key takeaways for us to focus our attention on.

“They need to communicate better with users better”

“I definitely don’t like the waste of paper. It’s unsustainable”

“I live by Venmo”

“It’s so ridiculous! Why don’t they add more machines”

“I care more about efficiency than anything else”

With our users in mind, we were able to begin to affinity map and start mapping out trends and patterns that were readily visible to us. After that round, we began to group smaller patterns and funnel our problem down into smaller pieces. This helped us to see features that all of our users talked about along with problems that they all had.

Some key takeaways we had from this process were

• I would rather purchase tickets online
• I am more worried about my safety when using the ticket vending machine
• I think the MTA has communication issues. Getting something done through them is a hassle
• I like to be aware of the status of my card (Active v. Inactive)
• I feel comfortable linking my bank account to my card

These were key in our decision making on what was important for our users that we needed to address for them. Affinity mapping coupled with feature prioritization were key in creating the personas that we had to accurately address each interviewees pain point and pleasures.

DESIGN

We started our design process with design studio work and really collaborated when it came to addressing certain screens that were important pieces for us.

This allowed us to solidify our concept of a sticky bottom navigation bar and the list view during card management where users would go and handle the individual features of their card. This was the framework for our low/medium fidelity wireframes.

After going through usability and validation for design decisions, we realized that people thought the interface reminded them of the current kiosk, so it was recognizable and easier to navigate the app.

With the higher fidelity, it was more apparent for our users which pieces are clickable and usable versus the lower fidelity where it wasnt as clear. Some takeaways we had included

• this is very intuitive and easy
• I like being able to choose my payment method
• The subway schedule is something that I’ve been waiting the MTA to build!

The prototype was made on Flinto.

PERSONAL

This project was especially challenging for me because I was working with two people I hadn’t interacted a whole lot with, but after getting to know them, the process immediately became more refined and strengthened. I learned to value research more and not to just jump into wireframing immediately. I took my time and walked through the whole research process and validated our design decisions before we even began to work. This allowed for the collaborative process that we had during design studio and then the collaboration between working on low and hifi mockups.

It was also interesting to build a product that you would like, but have to constantly remind yourself that you are not the user. It’s always a struggle to try and not inject your views and pains into the project, but to always remember that there is research to backup why you’re creating this feature or why you’re addressing this issue. I think overall this just strengthened the notion that research is the backbone for design.