Jason Goldstein
UX/UI Designer
Made with

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.

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

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

Comparative Analysis

I examined several websites to see how they used PayPal.  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 checkout 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.

Low-fidelity wireframes were created using screenshots.

Low-fidelity wireframes were created using screenshots.

Mobile Wireframes

PayPal Buttons

Takes customer to PayPal as a checkout screen.



Low-fidelity wireframes were created using screenshots.

Low-fidelity wireframes were created using screenshots.

PayPal Overlay 1 

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


Low-fidelity wireframes were created using screenshots.

Low-fidelity wireframes were created using screenshots.

PayPal Overlay 2

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


Low-fidelity wireframes were created using screenshots.

Low-fidelity wireframes were created using screenshots.

PayPal Billing Address and Shipping Address are Different

Personal Information

Pre-populated with PayPal shipping address


Low-fidelity wireframes were created using screenshots.

Low-fidelity wireframes were created using screenshots.

PayPal Billing Address and Shipping Address are Different

Shipping Information

Pulls service address from step 1.



Low-fidelity wireframes were created using screenshots.

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

Low-fidelity wireframes were created using screenshots.

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.