Case Study: UX DesignCreating a Seamless Payment Process over SMS
Problem.
We launched our chatbot on SMS as a low-barrier, high engagement channel. The only problem is SMS doesn’t have a seamless payment process. How can we allow our users to make payments seamlessly on SMS?
Background.
Our premium offering was targeting highly engaged super users who tend to be Gen Z men. Since these were young, we focused on a micropayment gaming payment model where users make frequent small payments. This requires an easy way for users to make repeat payments.
Long-term we planned to launch a test app with app-based payments and create a token system to optimize payment. But first we needed a basic way for users to pay so we could learn WHAT users will pay for, starting with premium story paths.
Goal.
To create a way for users to pay for premium story paths directly in the text message.
Process.
We knew we needed to collect payment information initially using a more traditional channel like entering a credit card or Apple/Google Pay, but once this information is saved and linked to their phone number we could just recharge it with user permission. Since the user is already interacting with us over text message, ideally they wouldn’t need to leave the text thread to authorize repeat payments.
Mapping the Big Picture
To start, I mapped out a process paying for premium scenes for users who haven’t paid before and for users who had:
I shared this mapping with the engineering team who confirmed this process would work technically. We also discussed ways to handle payment errors, which I added in the next version.
Story Flow
Next I designed the flow for the story payment messages as a template we could reuse for each story with templated copy, including fallback messages. Later we could optimize this by testing different copy iterations.
I added a path for users with a failed payment to receive the message with the payment link so they can update their information.
We decided to create an alternative free path and wanted to make sure users knew how to start this if they decided against paying, so I included a link allowing users to opt-out of the premium scene directly on the site. Users could also just text “no” to the bot to opt-out.
In case something went wrong in the payment process, I added a way for users to contact us by clicking a link to send us an email. They could also text HELP to the bot for assistance. This was critical in identifying early issues.
I drafted the initial site copy and I worked with one of our writers to punch up the language.
Payment Site
Next I began designing the payment website for users paying for the first time (repeat users will be able to pay without leaving text messaging).
Initial Payment Process
A user who hasn’t paid before clicks a link to add their payment information by credit card or Apple/Google Pay.
For repeat payments the process is simplified…
Repeat Payment Process
A user who paid previously is able to pay for or opt-out of a premium scene by saying YES or NO, without leaving the text messages.
Testing
After some internal testing, we tested the new payment process with 10 initial users. All were able to successfully pay though we did have to make a few technical changes so we could track payment information properly.
Result.
We launch with a group of beta users, many who paid. Some users were disappointed about having to pay for premium content and shared this directly with the bot, so I updated our bot to respond to these kinds of comments and answer questions about payments directly.
Initial and repeat payment numbers aligned with industry averages for in-app purchases. We successfully created a new way for users to pay over SMS - yay!
Next we could focus on ongoing tests to increase revenue.