top of page

Web Payments
Using the Payment Request API makes online purchases easier without having to fill in personal and payment details repeatedly every time a user enters a checkout flow. By storing user details in Firefox the user no longer needs to re-enter their details the next time a merchant requests payment. The Payment Request UI also provides a consistent experience across merchant sites.
From a UX perspective we want to give the user a clear, friction-free experience that allows them to check out quickly and as securely as possible. The UX team worked very closely with both the product manager and user research to ensure we were designing that experience.

Checkout Summary Screen

Add shipping address

Error Screen

Information Architecture



Wireframes
In collaboration with user research, we ran several studies to validate and test our designs. Below is an example of a prototype we used to test how a user responds to running into errors in the checkout flow. We named this prototype "The Unhappy Flow".




"The Unhappy Flow" Prototype created for user testing
bottom of page