Fitbit Pay

Bringing contactless payments to life on Fitbit's first smartwatch.

In creating our first smartwatch, Fitbit’s vision was to craft the perfect companion not just for a run, bike ride or workout, but also for day-to-day life. We knew early on that Ionic would quickly become the most personal device our users own, on their wrist day and night, and thus had enormous potential to make life more convenient. Fitbit Pay fulfills this potential by allowing wearers to make purchases quickly at millions of stores that accept contactless payments, without carrying a wallet or fumbling through cards. I joined Fitbit in November 2016 to take Fitbit Pay from a concept to reality, and served as the Lead Product Designer for this new service, through rollout on the Ionic and Versa watches in 2017 and 2018.

Guiding Principles

We defined goals that were backed by the key findings of early attitudinal UX research.
Fitbit Pay should...

1. Reduce Friction

Be the simplest and lowest friction way to pay at the register of all the devices, cards or currency a person might carry.
‍
Research finding: More than 25% of the users interviewed who had previously tried an existing NFC/mobile payment solution had a experienced at least one malfunction at checkout which discouraged continued use.

2. Free Users

Empower users to travel light and leave their wallet behind while exercising.

Research finding: About half of the users interviewed who exercise outdoors on a regular basis indicated "too many things to carry" as a top 5 pain point in their exercise routines.

3. Inspire Confidence

Make all of Fitbit's users – both young digital natives and older digital immigrants – feel comfortable using this new financial technology by emphasizing security throughout the UX.This principle was particularly important for users in North America, where NFC/contactless payments are still less familiar to consumers compared to APAC and Europe.
‍
Research finding: About 20% of users interviewed who did not use a mobile payment solution on a regular basis indicated "security concerns" as the #1 reason they did not use these technologies.

Architecting the Solution

On Watch

We envisioned a payment experience that fit seamlessly into Fitbit OS, our new smartwatch platform, accessible from every app and screen. We dedicated a long press of the left button within any app to open the Wallet Tray and ready the device to make a payment. This was the first of three safeguards we put in place to prevent unauthorized payments with Fitbit Pay, and it satisfied card industry requirements for authenticating transactions (known as CD-CVM).

The second safeguard involves intelligently prompting users for their PIN code. This prompt occurs if the user has taken the watch off since the last time the PIN was entered, or if more than 24 hours have passed since the last PIN entry. The diagram below shows the entire payment flow on the watch:

In Mobile App

The Fitbit mobile app (Android, iOS and Windows) is used to set up the Fitbit Pay service, add cards to the Wallet and select which card should be synced to the watch. As of the initial launch, users are only able to select one card to sync to the watch due to engineering constraints. However, they can swap it out with other cards they've entered into the mobile app at any time.

The mobile app is also home to the third safeguard, a suspend mechanism which allows users to freeze their Fitbit Pay account instantly if they lose their watch.

Early Designs & Usability Studies

Working with my Product Manager counterpart, I focused on creating a simple and clean interface on mobile to add and manage cards. We then engaged our UX Research team to validate usability of both interactive prototypes and early functional builds on Android and iOS. We also worked with Firmware engineers to create a functional build on early Ionic hardware so we could have study participants test the real transaction experience at a staged storefront in our lab.

Key Learnings & Improvements

After our first round of usability tests, we took steps to address the key issues and performed additional rounds of tests with new participants.

1. Teach the Basics

"I'm not sure I would know what to do if I were at the store trying to use [Fitbit Pay]." – Usability Testing Participant

Our initial flow did little to tell users how to actually use Fitbit Pay other than one hint that it's accessed by holding the left button down. Many users we tested had never used a contactless payment service, and didn't feel confident they would use it correctly at the point of sale. To solve this, we prototyped several types of educational messages to teach users what to look for in stores and how to make a payment using Fitbit Pay with the credit card terminal.

2. Even a simple address form is an opportunity for magic.

"Why do I need to confirm my address a second time?" – Usability Testing Participant

The first version we tested required users to enter their full billing address manually and then confirm the correct address from a validated database. This process was tedious, and selecting the validated address confused some users since it usually was very similar to the their original input.

We brainstormed ways to streamline the address form and make it less painful. We created a smart autocomplete field that suggested addresses in the local area after users typed the first few letters of their address. Upon selecting a suggestion, all fields except the apartment/suite number would be filled in; we then we shift focus to that field to remind users to provide the extra info if needed.

Shipping 1.0 with Ionic

After months of iteration, beta testing, and tough prioritization to keep the MVP as simple as possible, Fitbit Pay was finally ready for the light of day! It went live with the launch of the Ionic watch in October 2017, initially for users in the US and Australia. Check out the 1.0 experience below.

Fitbit Pay in our iOS app

Unlocking & Making a Payment on Ionic

Fitbit Pay Today

After launching with the Ionic watch in late 2017, we added more features including multiple cards on the watch, additional banks, transit passes, and brought Fitbit Pay to market in 42 countries globally.

I also helped evolve the UX for Fitbit Pay on the Versa watch (see Versa case study).

Shown at left: Fitbit Pay on the Versa 2 (top) and original Ionic watch