Facebook Pay - UX Case Study

Project overview

Facebook is one of the biggest social network actors with almost 2,8 billions MAU*. In the marketing world they became with time one of the most profitable platforms to promote products and services. They enable businesses to target potential customers efficiently. For Facebook it's a huge source of revenues. But when it comes to the general user, no payments are done directly on the platform. In 2017 with the introduction of Facebook marketplace they created Facebook Pay. Facebook pay would allow general users to pay on facebook directly: on the marketplace and transferring money to friends and family through the messaging app.
In France, at the moment, Facebook pay is only in place for pools created by users for charities. Payment between users on Messenger is not yet available, unlike in the USA where the feature is in place but hard to find and not very popular at the moment. Since the functionalities architecture is similar on both versions, we are going to see how we can implement Facebook pay on the French version of messenger and make it acceptable for the French market.

Business goals

With the dematerialization of payments systems and the development of payment between friends and family through apps, Facebook sees an opportunity to increase its revenues by implementing a new payment system directly on its messaging products.

Secondary research

Design Audit

People who use messenger would use it every day and basically do the exact same actions all at the time. So the normal user flow would be:

     •  Open the app
     •  Find the friend you want to talk to or you want to answer to
     •  Tap you text, add a smiley, a photo or a gif
     •  And maybe end up using the vocal or video chat on the top right corner
     •  Close the app for now

In this flow, users won’t come across the Pay functionality casually. As Humans, we have habits and rarely go out of it. When using an app we tend to always do the same things without thinking. When functionalities are hidden, users won’t naturally think of it when they need it. For example, it’s in the same place as localization sharing. As a user, if I have to share my localization, my first thought would be to go on a map app and share it that way. I won’t think of Facebook. Since it’s in the same menu as Facebook Pay, if a user needs to pay someone in the US, they will think of using Venmo or Paypal but not necessarily Facebook Pay. This means, users have to know it exists and only then they will eventually find it and use it. It’s placed with other rarely used functionalities (localization and “salon”, in the USA version there is gif as well but since I can’t test it I will assume that you can access it through the smiley like on the French version and people won’t really use it there, at least I never used those functionalities and never had a friend using it with me). If Facebook wants users to think or start having the habit of using Facebook Pay. They need to implement a hint system or a communication telling users about Facebook Pay and how it works. Or the other solution is to move it somewhere else to make it more visible at all times. On an app whose payment is not its primary function, it would increase the chances people would think of it when they need to transfer money to someone.
Once you find it, the flow is pretty neat: enter the amount, check your payment source, the security pin and then you pay or request a payment.

Assumptions:
     •  The discoverability of the functionality is extremely low
     •  People might be scared to use it, due to facebook security (stolen account, duplicated account that request money, security hacks)
     •  Since most users will likely use their Paypal account they might prefer using the Paypal app directly.

Competitive Analysis

For the competitive analysis I selected 2 of the most used apps in France for payment between friends and a smaller one. The target is to test how the user flow goes, what problems users could encounter and how they manage the payment process.

Lydia

It’s a French startup who started as a paying app between friends and is growing into a real banking system. In France it’s one of the biggest competitors of PayPal.

On the app store its rating is: 4,6 • 9,7K Ratings. It’s the #4 app in Finance section.
On Google Play Store its rating is: 3,9 • 14,6K Ratings.

When you download the app and create an account, there are a lot of security checks, they ask for a lot of papers to verify your identity. It gives a feeling of safety and seriousness. To make a transaction the flow is pretty easy, it’s right on the main page. You can give access to your phone book and select the right person. On the amount page you can enter the sum, you have a reminder of who will receive the payment, select a card or pay with your Lydia sold and also add a message. Everything is on the same page. I added a payment card easily, via my bank app. And then validate the transaction. Now on the main page I also have the history of my transactions.
Conclusion:
     •  It’s easy to use and feels super safe.
     •  The contact page feels a little bit busy and the top buttons are a little confusing.
     •  Payment itself is super easy if you have your debit card at hand the first time.

Lyf Pay

Lyf is also a French Startup which is much less known than Lydia. It’s a payment app with which you can pay in shops and pay your friends.

On the app store its rating is: 4,6 • 22,6 k Ratings. It’s the #4 app in Finance section.
On Google Play Store its rating is : 4,4 • 9,5K Ratings.

For me it was the nicest to download and start to pay with. The flow is super easy. Within minutes you can pay someone. There is less security check than on Lydia at least it felt like it. Yet you feel pretty great using the app. The design is simple and super friendly. I really enjoy using it, at no moment I was wondering what I should do or what this button does. The user flow to pay a friend is hassle free and super quick: the way the buttons are designed, the copywriting, everything is where it should be, with no extra information that can distract you or make you confused.
At the end of the process there is a summary of the transaction, then a poppin of success where we can still access the recipe. On the recipe, users can still cancel the payment while it’s still in process. Once you are back on the main page, the transaction history is present in the left corner menu.
Conclusion:
     •  Transactions are super easy to make, the flow is extremely natural.
     •  The interface is super clean and very easy to understand.
     •  Not that many people use it.
     •  They don’t ask for your password every time the app has been closed.

PayPal

PayPal is the worldwide renown payment app. You can give money to anyone in the world. It’s mainly used for online payment but also gives the possibility to give or request money from your friend and family.

On the app store its rating is: 4,8 • 340 k Ratings. It’s the #1 app in Finance section.
On Google Play Store its rating is : 4,2 • 1,9M Ratings.

Like Lydia, when creating an account they ask for a lot of info and do a test transfer when adding a bank account. I don’t know if you can make a transaction right away because I don’t remember when I created my account if I could or not. To give money to someone is easy and requires only a few steps. You can do it by tapping the first card or using the bottom menu. Then it’s just selecting a contact, entering the amount and a message, then there is a summary with a confirmation button and it’s done, you just have a final screen with the confirmation. After that you can find your history by scrolling slightly on the main page.
Conclusion:
     •  Security wise, you have to enter your password or fingerprint every time you use the app.
     •  The payment flow is reduced to its simplest.
     •  The main page can feel busy.

Summary

While user flow is very similar in number of steps and its content, the way it’s displayed varies which makes it more or less enjoyable. The busiest interfaces are confusing: Paypal’s main page and Lydia’s receiver page. Security wise PayPal and Lydia make you feel very safe by different security checks, password or pin checked every time. Even if Lyf was the most pleasant to use, it feels safe but somehow you feel like if someone else used your phone or stole your phone they could easily use it.

Survey learnings

To verify my assumptions, to see if people are using payment apps but might be scared to use Facebook Pay, I created a survey that I submitted to my Facebook French speaking friends and entrepreneurship groups.
The reason behind these choices are very similar: their friends are using it, easy to use and the security.

“Paypal car utilisé sur de nombreux sites et pas besoin de saisir ma cb à chaque fois. Lydia car utilisé par mon entourage.”
“Pratique rapide et sécurisé”
“Par rapport à ce que les gens utilisent autour de moi, et aussi par rapport aux paiements en ligne”
“Tous mes amis l’ont”
“Sécurisée / transaction visible immédiatement”
When asked why they feel safe using these apps they talk about the reputation, that they never heard of security problems or hacking scandals and that they never had problems.

“La bonne réputation des entreprises”
“Lydia et PayPal, pour le côté qu’eux, existent depuis longtemps et n’ont pas été mêlés à des scandales. Ils me paraissent sûrs par l’image qu’ils renvoient et l’interface sécurisés qu’ils proposent”
“Garanties de sécurité bancaires essentiellement”
“Identification multiple à chaque connexion, vérification du compte demandée régulièrement”
“Pas eu de scandale ou fuite de données à ma connaissance et mondialement t utilisé”
“Je n'ai pas entendu parler de scandale sur ces app”
“Peur des piratages”
Conclusion:
PayPal is the most used with 70% of the responder using it behind, we find Apple Pay 40% and Lydia 37%. They mostly feel safe using those apps and it’s one of the main reasons they are using it. The other reasons are because their friends are using it and because it’s easy to use. Now when asked if they would pay on facebook, even if all of them are facebook users since they answered from it directly, they wouldn’t do it. Which is a huge difference with the previous question. Facebook and its numerous scandals don’t have the trust of their users when it comes to their payment information. One of the problems we will have to address is, how to make it look secure.

Define

According to all my research I have defined a point of view, a problem statement and a how might we.

POV

Facebook messenger users who need to pay back a close person, hassle free and in a secure way.

Problem Statement

“I’m chatting everyday with my friend on messenger, today we had lunch together at a restaurant. She paid the entire bill and I’m paying my part on Lydia because it’s free, she is using it as well and I trust its security. I don’t even know you can pay someone on messenger. I never came across that option and even then, I feel uncomfortable paying that way.”

How Might We

How Might We make people secure enough to use Facebook Pay?
How Might We make the functionality easy to find?
How Might We encourage Facebook users to try Facebook Pay for the first time?

User Story

“As a Facebook user, I would like to be able to reimburse my friends while planning our outings. Example: We are trying to get tickets for the trendiest gig. We are on messenger updating each other while in the waiting list of the ticket website, my friend manage to get the tickets and I want to repay for mine.”

Braindump
During our Brain Dump session, the most present themes were:

     •  Discoverability and easy to use: making functionality easier to find, more visible and easy to use.
     •  Rewards and incentive: a way to attract users would be to give them money or some sort of rewards if they make a transaction using messenger.
     •  Notifications and user guide: having inside messenger some kind of onboarding  explaining how it works and showing how safe it is to use.

Ideate

Placement options
I started my ideation process by finding where Facebook Pay could be implemented in Messenger.

If I was following what’s in place in the USA at the moment, the feature would be on the 3 last screens, inside the 4 dots menu on the bottom left. As we said, when we started it is hidden and people won’t necessarily think of it if it’s not visible in their usual flow.

My first option is to add a tab on the main screen of the app. It’s well separated, making it a different service. Then with this option we are going maybe a little too far than what we define in the user story, since it’s not directly accessible on the chat. Plus it would be a user flow very similar to the other payment apps and maybe it might be a good thing to differentiate this app from the others, to offer a different experience.

In the second option, I added it to the telephone and visio features. Those are important features yet slightly less used than photos and smiley. It’s visible and accessible yet people won’t tap on it by mistake since it’s not right under the thumb.

The third option, I placed the icon on the bottom menu with images and vocal messages. Just like the second one it’s easily accessible and directly in the messaging flow but I often tap by mistake the vocal message because it’s right next to the messaging window. So my assumption is that if it’s too easy to tap by mistake people might feel that it’s not secure enough and won’t be keen to use it. In the end they might even complain if they feel pushed to use the feature.

The last option is an AI that analyses messages and every time specific sentences and words are sent, the app suggests a payment. I think that for now people are not ready to have these suggestions. I would feel very intrusive and make them stop using the app. In the future it might be possible but not for now.

User Flow & Wireframes
For the user path, I decided to keep the pin code and place it at the start of the process. It’s a first security check that can make people feel like you can’t transfer money by mistake and if someone is using their phone (children, partner, parent or friend) they won’t be able to make a payment. I went for a very simplified version, without a message added to the transfer, it’s just the amount and security check. Since we are directly inside the chat, the payment will already be in the situation. After entering the amount, the person requests or sends the money. The next step is the usual step that we encounter almost every time we do payment on the internet, it’s the security check through the bank or payment system. Then, the process is over, it appears inside the messaging flow.

For now, I only worked on the sender side of the app to see how we can make people feel secure and want to pay directly on Messenger.

Prototype

You may also like

Back to Top