To establish a baseline we need to first look at data. Is this even a feature that will be used and is beneficial to our customers?
Apple Pay only works for iOS/OSX users who also use Safari browser (mobile, tablet or desktop). After a quick review on our data gathered from Google Analytics 360, we can tell that the highest device/browser usage is coming from Apple users (mobile, tablet and desktop).
Apple Pay integration
Know your customer
Problem / Solution
The challenge is to try and to include the Apple Pay feature (CTA following Apple human guidelines) into the payment page seamlessly. In doing so we need to consider:
- Different user’s roles (Registered and Guest user (non-registered) on HN database) journeys.
- Ui consistency between different technologies (Apple Vs Android).
- Hierarchy with other Express Payments (Paypal) and Credit/Debit card payments.
- User’s who have set Apple Pay (card included into Apple Wallet) and users who have not included a card into the wallet but, are eligible.
- Different user’s roles (Registered and Guest user (non-registered) on HN database) journeys.
- Ui consistency between different technologies (Apple Vs Android).
- Hierarchy with other Express Payments (Paypal) and Credit/Debit card payments.
- User’s who have set Apple Pay (card included into Apple Wallet) and users who have not included a card into the wallet but, are eligible.
New Design
On the following slide we can see the final design breaking down by:
- End to end journeys, PDP (Product details page) as a starting point and Confirmation Page as the last step for the user before leaving HN site.
- Mobile and Desktop resolutions based on our most common user (414px width for mobile and 1312px for desktop due to is our $medium breakpoint).
- Two different journeys, buying via Apple Pay from:
- Shopping Bag (Where the user has not entered delivery options and it will be requested by Apple).
- Checkout/Payment Page (Where the user has completed all delivery details and Apple will request just the payment).
- Two different Apple users:
- The ones who already have been set a credit/debit card into Apple Wallet.
- The ones who don’t have any card into Apple Wallet but, still eligible for Apple Pay (Showing ‘Set Apple Pay’ CTA).
- Two different Harvey Nichols users:
- The ones who already have HN account and have a saved credit/debit card.
- The ones who don’t have HN account or they have but, they don’t have any saved card.
- End to end journeys, PDP (Product details page) as a starting point and Confirmation Page as the last step for the user before leaving HN site.
- Mobile and Desktop resolutions based on our most common user (414px width for mobile and 1312px for desktop due to is our $medium breakpoint).
- Two different journeys, buying via Apple Pay from:
- Shopping Bag (Where the user has not entered delivery options and it will be requested by Apple).
- Checkout/Payment Page (Where the user has completed all delivery details and Apple will request just the payment).
- Two different Apple users:
- The ones who already have been set a credit/debit card into Apple Wallet.
- The ones who don’t have any card into Apple Wallet but, still eligible for Apple Pay (Showing ‘Set Apple Pay’ CTA).
- Two different Harvey Nichols users:
- The ones who already have HN account and have a saved credit/debit card.
- The ones who don’t have HN account or they have but, they don’t have any saved card.
My involvement
Working with the front and back end development teams, we drew up a process flow and understood the technology and different hand-offs between different systems.
In addition to working with the developers, I looked at how our competitors had implemented the solution and used Apple’s guidelines.
Before development started, I worked with the Product Owners and various stakeholders around the business and demonstrated our plans using mocks and prototypes. I am very comfortable presenting and taking feedback from the stakeholders.
Finally, I was also part of the testing team working again with the developers and Quality Assurance team to ensure we had delivered a robust solution.
In addition to working with the developers, I looked at how our competitors had implemented the solution and used Apple’s guidelines.
Before development started, I worked with the Product Owners and various stakeholders around the business and demonstrated our plans using mocks and prototypes. I am very comfortable presenting and taking feedback from the stakeholders.
Finally, I was also part of the testing team working again with the developers and Quality Assurance team to ensure we had delivered a robust solution.
Conclusion
Whilst we could not accredit a conversion uplift, they day we launched Apple as an alternative payment option in the basket it we saw instant engagement. 60% of qualifying customers that had Apple pay available to them started using the feature.
The reason we could not attribute conversion uplift is because we are taking advantage of a feature that is convenient for our customers. We could argue that the sale would have gone ahead regardless of Apple Pay being available.
Future plans include Apple Pay being available on Product Pages and the ability for our customers to instantly checkout single products. When these features are live that is when we can confidently say that Apple Pay has generated a conversion uplift of X%. In this scenario we can clearly demonstrate the uplift as customers do not currently have this option on the HN website today.
Unfortunately we have had to prioritise other work ahead of this but it early engagement is an exciting result already.
Underneath, I've included a payments page study.
The reason we could not attribute conversion uplift is because we are taking advantage of a feature that is convenient for our customers. We could argue that the sale would have gone ahead regardless of Apple Pay being available.
Future plans include Apple Pay being available on Product Pages and the ability for our customers to instantly checkout single products. When these features are live that is when we can confidently say that Apple Pay has generated a conversion uplift of X%. In this scenario we can clearly demonstrate the uplift as customers do not currently have this option on the HN website today.
Unfortunately we have had to prioritise other work ahead of this but it early engagement is an exciting result already.
Underneath, I've included a payments page study.
