Onboarding screen for “Pay with Hailo”

Designing Hailo

Patrick N. Lewis
Jun 28, 2016 · 3 min read

Every two seconds, Hailo’s app enables a passenger to get a taxi or licensed car to transport them around England, Ireland, Spain, and Japan. In early 2014, Hailo’s New York City team recruited me to design the Pay with Hailo feature. As part of the “New Networks” team, I was excited to be working on a product that pushed the boundaries of current technology while also making a meaningful impact to Hailo’s business.

I’m really proud of Pay with Hailo as it took a full-team effort across business, engineering, and design to create something so much better than what passengers were subject to using.

What is Pay with Hailo?

The New Networks team at Hailo was responsible for researching potential new features and turning those findings into products. With competition like Uber and Lyft, it was crucial that we moved quickly and still executed at a high level.

While most users request their ride ahead of time with the app, many still hail cabs from the street. Hailo passengers should be able to pay for those rides using the app.

Current in-car payment options included giving cash to the driver, swiping a debit or credit card, and paying with your phone through services like RideLinQ. The third option seemed like a step in the right direction but relied on the user manually entering a long code to pair their phone with the cab. We knew there was a better way and set out to explore new opportunities.

NFC, Bluetooth, and Beacons

The first challenge we set out to tackle was pairing a passenger to a specific cab and driver. Needing a way to sync the two despite numerous cabs and other passengers on the road led to us researching near-field communication (NFC), bluetooth, and iBeacon technology.

iBeacons deliver “real world context” for mobile experiences. By using these beacons inside of cabs, we were able to identify when a Hailo user entered the cab, which cab they entered, and when their trip started. This allowed us to send a notification to user 30 seconds into their trip.

Almost as easy as a swipe and tap.

Pay with Hailo’s user experience was crafted around being quick and establishing confidence. While these two intentions might seem obvious, they tend to conflict with each other. For instance, Uber optimized their experience for speed but failed to establish that a transaction was occurring. This led to users feeling betrayed and lots of negative press.

To accomplish speed and trust, we took users straight from the notification to the driver confirm screen. Here, users see information like the cab number and driver’s photo as well as the Pay with Hailo button. If a user has entered their destination, and estimated amount is displayed.

(L) Driver confirmation screen after a user swipes the notification and opens the app. (R) In-route trip screen with tip options and driver status.

Once a user has confirmed their driver and selected to pay with Hailo, we wanted to ensure they knew it worked. I designed a small persistent banner at the top of the “Ride in Progress” screen to help build confidence.

“We’re seeing a steady week-over-week growth since we launched and we’re happy with the uptake so far; we see a lot of opportunity to grow this further.” — Naoise Irwin, VP of Strategic Initiatives

Thanks to Lexie for introducing me to the team at Hailo and to my team Naoise, Valentin, Adam, and Simona.

Patrick N Lewis

Portfolio of product designer, Patrick Lewis

Patrick N. Lewis

Written by

Design Lead @TheKnot. Formerly @BuzzFeed and @Button. Fan of Michigan football and Rubirosa pizza.

Patrick N Lewis

Portfolio of product designer, Patrick Lewis

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade