UI/UX Case Study | User Transfer Information

Turnstile: Improving the subway transfer information

Turnstile helps local New Yorkers with subway train route information and schedules. It allows users to input any stop and find the best route using the NYC subway system.

Project Overview

This project focuses on improving the user experience by allowing users to easily access transfer information between different subway lines. The solution was to enable users to tap on the station row to view transfer information and the detailed arrival times.

Researching, Ideating, Designing

September - December 2024

Adobe Illustrator, Figma

Role

Timeframe

Tools

Project Problem

For many New Yorkers, transferring between subway lines is a daily necessity, however accessing clear transfer information can be difficult in such fast-paced environments. Understanding where to switch lines, which platform to use, and when trains are arriving is essential to keep the commute efficient. This project focused on improving how transfer information is presented within the app.

User Research

I analyzed existing transit apps to understand how riders currently access transfer information and where improvements can be made. I studied apps including Apple Maps, Citymapper, and Transit, observing their interface patterns, navigation, and information hierarchy.

I recognized that many apps required users to leave the main station view in order to access arrival times or transfer details, sometimes interrupting the flow of information needed. Through this research, I identified an opportunity to prioritize allowing the users to stay on the same screen while expanding details as needed.

Key insights from research:

Search bar should remain on the home screen without opening a separate page
Transfer information must prioritize direction
Arrival times should display next two trains per line
Drop-down layouts must clearly separate multiple platforms and directions

Project Solution

The solution centered on enabling users to tap directly into station rows to reveal transfer details and arrival times through a drop-down interaction. This system was then expanded to support the complex stations with multiple platforms. Using hierarchy and creating visual separation, it helped distinguish train directions and platforms.

A drop-down feature was implemented, appearing when a user tapped on a subway station. This drop-down shows the available lines for transfer at that station, along with the next arrival times. This information includes both northbound and southbound trains, making it easy for users to track their routes.

Using the same drop-down feature, mock-ups were created for stations with multiple platforms. There was a focus on clear hierarchy decisions, separating train directions and separating multiple platforms.

Design Process

On this screen, users can see their current station (ex. Briarwood)
and can access transfer information for different subway lines (E trains and F trains) by clicking one of the station rows. This will open up a drop-down which shows which other subway lines are available for transfer at that current station, including the next arrival times for those lines.

Created version with time stamps
hierarchy regarding the first train’s arrival.

This screen consists of an example of a subway station with multiple platforms.
I worked on hierarchy and text treatment.

This screen consists of the example of a subway station with multiple platforms with some iterations.
The Times sq stop will be extended, everything underneath will be moved below the drop-down and i had to fix the spacing between the different trains.

The red line on the left will be longer and not cut out since it is following the drop-down.

This screen is the final screen based off the iterations made, utilizing the app’s initial pixel use and iphone 14 screen size.

Outcome

Designing for speed and clarity is essential in a city like New York, where commuters rely on transit systems. It is important to think of the users to improve how our transit systems work. Apps like Turnstile have done a lot to make it easy for anyone to get from one place to another. This project reinforced how thoughtful interface decisions can impact the ability to move efficiently.

Throughout this process, I learned the importance of testing ideas, adapting to challenges and hurdles, and expecting constant iterations.