PayPal Checkout Experience (2011)
In Context Check out
"I do not like to leave my merchant site to make payments. I want to see my payment methods and cart in the same place."
This was a very strategic project for PayPal in 2011. The old experience was not proving the trust and ease of use our users and merchants were looking for. To make a payment user had to leave the merchant site, log in to PayPal, select payment methods on the PayPal site, and then go back to the merchant site. During the transition from merchant site to PayPal site, we identified a huge drop-off. Furthermore, we had co-branding for customers, and this added salt to the injury as this opened doors for merchants to do whatever they want and the checkout page sometimes looked like a spam site. So, trust and branding become a big issue.
So, when I was tasked to work on this project as a lead designer. We started with foundational research to understand the critical challenges with checkout. After several rounds of research with customers on the existing checkout experience, we identified the following key findings.
User sees PayPal as their wallet, and they want to have their wallet with them while making the payment.
They trust PayPal, and they want the PayPal brand to control the entire payment experience.
They do not want to leave their merchant site while selecting or even adding a new payment method.
Merchant wanted to get shipping Information from PayPal but give complete control to users to change it.
PayPal payment was done on a different page outside of the Merchant checkout..
PayPal became a small widget in the merchant checkout experince.
After several rounds of design, testing, and iterations, we developed a simple design and still accommodate all the local and international requirements. To minimize the noise in the checkout page, we removed content not necessary for payment method selection. This was not easy, but we worked hard to convince stakeholders of this approach. The engineering team also came up with a new way of authenticating users using a mini-browser. That eliminated the problem of users logging in to the PayPal site to authenticate. Finally, we designed an easy payment method management design to add or remove payment methods without the user having to leave the merchant site.
These mocks show all the different states of the widget, based on different scenarios. We also took translation and local government regulatory requirements into account to make it truly available for all countries and languages.