FINAL PROJECT
UX DESIGN COURSE - NJ TRANSIT APP

 

Transportation apps have dramatically changed the way people get from A to B.
I always use my phone to assist me on my trips, as a commuter or even as a tourist.

Ironically, NJ Transit’s app, which I used the most, only complicates my life as a commuter. So I decided to take the app apart, implement the principles of user experience learned in class, and redesign it for my final project.

PROBLEM STATMENT

Transportation apps have dramatically changed the way people get from point A to B and Everyone knows when you’re taking public transportation it can be very stressful and frustrating depending on the time of the day and weather conditions.
 

There are few apps out there but none of them are 100% accurate and tasks like planning trips, checking time schedule and purchase tickets are poorly implemented or spread across multiple platforms which wastes so much time and energy.

“Commuters need a tool to help them plan and organize their trips.”

Problem-statment.png

PROJECT DESCRIPTION

Design a transit app that helps commuters choose the best route based on accurate data; avoiding delays, crowds, and other common disruptions and taking time—and stress—out of daily commutes.

MAIN FEATURES

SPEND LESS TIME WAITING

Check live tracking bus and train arrivals, so you know if you have time to get a coffee.

BEST ROUTE OPTIONS

The app will help users determine the best route with live status, delay alerts and real-time updates.

EASY PAYMENT METHOD

You can buy bus ticket and refill metro card on the same platform using your credit card or apple pay.

Interview-01.png

USER INTERVIEWS

I interviewed people from ages 24 to 32 who use apps such as NJ Transit, Google Maps, City Mapper, NY MTA to commute from NJ to NY.

KEY QUESTIONS
Here are some of the relevant questions asked during the interview which helped me have a better understating of the user needs and pain points.
 

- When you are on your trip, are there any challenges you face accessing public transportation?

- What are your
goals and needs using the app?

- What do you
dislike about the app? Why?

- What kind of
improvements could be made to make the app easier or better for you?

PAIN POINTS
Here are the user pain points that I thought were more important to focus on
- Inaccurate data
- Not enough route options
- Poor design and usability
- Payment method

INSIGHTS
Users expect that bus schedule, time and alerts will be accurate so they can plan better their commute during any time and weather conditions. In addition, they also expect to have a friendly transit app platform which allows them to complete basic daily tasks easily.

Insight.png

USER PERSONAS
Based on the user's feedback I could create the following personas.

INFORMATION ARCHITECTURE

USER FLOWS
The user's goal is to find out 3 easy steps when they want to dislocate from A to B.

TASK ONE
Creating an account

TASK TWO
Planing a trip

TASK THREE
Buying tickets

WIREFRAMES + TESTING PHASE
Once I have the information architecture and user flows defined, I look at some Transit Apps out there in order to get some more inspiration. As a result, I write down some particular features which I think are important to meet the user's needs and improve the app's functionality.

PROTOTYPE DESIGN

MAIN SCREEN + FINDING A ROUTE

01. A dedicated search bar which affords searching routes by location/destination.

02. A large map that spans the entire page showing the bus stops close by.

04. Bus tracking system which allows user to track bus location accordingly to their preferences.

05. Detailed information about favorite route peeking from the bottom.

BUYING TICKETS 

Here are some of the issues which get users disappointed while buying a new ticket. 
01. Popping up a screen asking login and password.

02. Selecting Interstate Zone in order to proceed ticket purchase.

03. Adding the credit card code for every purchase.

 

Little details which makes the process more difficult for daily uses.

Having these problems in mind, I redesigned those steps making them as easy and clear as possible for users concluding ticket purchase. 

 

Here are some changes which I made for new screens.

 

01. The App calculates automatically your interstate zone according location and destination chosen.

02. Once your add your credit card information, you will be able to save it for next purchases.

03. Adding promotional tickets packages for daily commuters. 

ACTIVATING TICKETS  

For "My tickets' section", I realized how confused is to identify each route ticket on the list. Sometimes you can active the wrong ticket route when you're late or in a rush.

 

I thought it would make more sense in terms of identification to include colors to transit routes. When the user goes through the tickets section, he/she can have an accurate perception of each route as well as how many tickets they have left.

The Screens would look something like this:

TICKETS ACTIVATED  

When the user taps on the ticket to active one of his/her trips, the bus ticket will expand to a new screen which will have to be checked by the bus driver.

 

For the bus ticket screen, I focused more on the design using the same color concept created for transit line routes.

 

As a result, we have a better design making it easier for users and bus drivers to identify each bus route ticket.

LEARNING OUTCOMES

Working on this project, I learned how important is to make and conduct user interviews in order to have a better understanding of the user pain points and your experiences. Also, how important is to have multiple feedbacks in the testing phase to give more clarity once I was trying to improve the functionalities of the product.
 

I would invest more time going deeper on wireframes and testing phase until getting different types of scenarios validated and then move forward to final designs.