Jason Goldstein
UX/UI Designer

PayPal

Comparative Analysis | Stakeholder Interviews | Low Fidelity Wireframes | Wireframes

Challenge

Stakeholders at Verizon Wireless felt that making PayPal a part of the site's experience would increase sales.

In order to achieve this, my task was to integrate PayPal into Verizon Wireless as both a checkout method and payment method for existing desktop and mobile checkout flow.

PayPal

Logos are to display comparative analysis. They were not created by me.

Comparative Analysis

I examined several websites to see how they used PayPal.  I examined both desktop and mobile versions. I added items to my account and did everything short of actually completing an order.

The research concluded that PayPal treated payment and shipping addresses separately.  This needed to be addressed in our payment and checkout flows.

Stakeholder Interviews

I had informal meetings with stakeholders to gain insight into requirements.

Conclusions:

  • The order of the checkout flow could not be changed.

  • I had to account for customers who wanted to use PayPal's full checkout experience as well as customers who simply wanted to use PayPal as a payment method. 

Wireframes

I created low fidelity wireframes using screenshots of the existing Verizon and PayPal screens and making changes where necessary.  This was done in Axure.

PayPal

Low-fidelity wireframes were created using screenshots.

Mobile Wireframes

PayPal Buttons

Takes customer to PayPal as a checkout screen.



PayPal

Low-fidelity wireframes were created using screenshots.

PayPal Overlay 1 

Active once the customer has filled out an email address and password.


PayPal

Low-fidelity wireframes were created using screenshots.

PayPal Overlay 2

Active once the customer has filled out an email address and password.


PayPal

Low-fidelity wireframes were created using screenshots.

PayPal Billing Address and Shipping Address are Different

Personal Information

Pre-populated with PayPal shipping address.


PayPal

Low-fidelity wireframes were created using screenshots.

PayPal Billing Address and Shipping Address are Different

Shipping Information

Pulls service address from step 1.



PayPal

Low-fidelity wireframes were created using screenshots.

PayPal Billing Address and Shipping Address are Different

Payment Method

Shows PayPal as a payment method with email address from PayPal account

PayPal Billing Address is Different from Shipping Address

Defaults to PayPal Billing Address

PayPal

Low-fidelity wireframes were created using screenshots.

Paypal Billing Address and Shipping Address are Different

Review Step

Shows PayPal as a payment method with email address from PayPal account.

Prototype

I created a clickable prototype in Sketch which I exported to AdobeXD to share here.


Result

The visual team created the final mockups and the IT team added the functionality to the site.  As of the time the project was launched, it was projected to add thousands of sales to the site.