Redesigning the onboarding experience of Citi Bike

2 months
Design launched across 330+ kiosk stations
in August 2014

Business goal:
Increase ridership amongst first-time users
and tourists

Success metric:
Lift in 24-hour passes and 7-day passes
or known as casual memberships

After doing some preliminary research for Citi Bike in school, they approached me to do some UX contract work. Citi Bike is New York City's bike share program. I brought on a partner, a Citi Bike annual member to better understand their ecosystem.

Annual membership was rising much faster than casual membership (24-hour passes and 7-day passes) and Citi Bike stakeholders did not know exactly why that was. 

In the class, Design in Public Spaces, we had already done extensive primary research. We observed and spoke with people using Citi Bike for the first time. Besides gathering findings from the research, we also mapped out the entire flow from when a user thinks about purchasing a pass to returning the bike at a given station. We delivered our research findings, flow chart, wireframes, storyboard incapsulate in a video (below) to demonstrate to Citi Bike where we saw their opportunity areas.

Therefore, my colleague and I had first hand knowledge of the onboarding Citi Bike experience and the UX contract work was already baked with primary user research.

We identified two key pain points—payment process and bike removal.

Insight #1: Single-day and one-week passes can only be purchased at a physical Citi Bike kiosk, which tends to attracts long lines.

Insight #2: Once a user gets over the hurdle of purchasing a pass, the instructions on how to obtain a bike is confusing.

Takeaways from shadowing first-time users:
  • Frustrated by directions and felt unsure of what to do
  • Overwhelmed by the length of the overall process
  • Hesitant to try, due to $100 hold on credit card
  • Screens seemed unresponsive
  • Pressured to understand the system right away
  • Confused on how to obtain a bike at the dock
  • Time limit and countdown to obtain a bike is stressful


We knew a quick win, the MVP of improving the onboarding of first-time users was redesigning the kiosk sticker. 
We pinpointed that the kiosk sticker is the first point of interaction with new users and if they did not understand
the instructions and payment model, that is the clear point of drop off.

The design process:
Strategy & data: We were able to parse Citi Bike's public system data, so we knew casual ridership was highest on weekends and where the most popular starting stations were located in order to speak to our target audience.

Insight #3:  In the original kiosk sticker, the pricing model was a major point of confusion, especially those unfamiliar with bike share programs. This put a heavy barrier to entry for new users.

Insight #4: In the original kiosk sticker, the design assumes that users are fluent in English and have the time to read through all the instructions. However, we knew from shadowing users that people glance from afar at the kiosk station and some users would bypassed the kiosk sticker entirely and tried to figure it out on their own.

The challenge:
Therefore, we knew that our redesign needed to solve for these three questions:

  1. What do you get with a one-time pass? 7 day pass?
  2. How long can I ride for?
  3. And how do I get my bike out?

Brainstorm session: 
We sketched, whiteboarded, and did a card sort of our design solutions (above), concentrating on explaining the different paying model to users and simplifying the instructions on how to undock a bike. 

Usability testing:
Once we flushed out 3 design directions, we stuck our paper prototypes at high traffic kiosk stations. We were able to utilize Citi Bike's outreach ambassadors team, where they send out Citi Bike representatives to different kiosk locations every weekend to educate people on how to use a Citi Bike—on our behalf, they tested different versions of our pricing model. 

Research goals:
We specifically wanted to test the instructional language and if color had any impact on the understanding of the pricing model.

Further iteration: 
From there we finalized our design. We decided we wanted to use a more universal language to explain how the Citi Bike system works—taking an IKEA approach with instructional illustrations to replace much of the text.

Finalizing the design & launch:
Citi Bike and the NYC's DOT (New York City Department of Transportation) were heavily involved as stakeholders in our design process. We spearheaded the redesign and they provided helpful feedback and resources that we needed. Our redesign launched in August 2014 across 330+ Citi Bike kiosk stations.

Citi Bike's data 2014 Q3

Because Citi Bike publicly publishes their ridership data, we were able to track if there was an increase in first-time users
after the launch. We found a month after launch, ridership amongst one-time users increased by 14% (compared to the previous month).

In July, the month prior to the design launch, there were 42,300 one day memberships and 3,530 seven day memberships. During the month of install, there were 48,086 one day memberships and 3,658 seven day memberships in August 2014.

Before (left) and after (right): Final design of Citi Bike kiosk sticker

We presented at BetaNYC's Citi Bike showcase held at NYU Wagner School, the Rudin Center for Transportation.
It can be seen here. You can also find our presentation here

Invited by the U.S. Department of State, we gave a presentation at the Innovation in Design: Creative Economy
Briefing Series to an audience of foreign press. You can find our presentation here.

Next City / The School of Visual Arts / Citi Bike

Madison Square Park

Madison Square Park