mattchudesign
Adyen SDK: Checkout

SDK payment checkout: UI/UX

Adyen SDK: Checkout

Adyen SDK: Checkout

Problem:
How might we show our merchants that using Adyen's SDK will improve revenue? What are the best solutions to enable one-click checkout and make the payment process seamless for end-users, in this case, customers?

Solution:
By improving the checkout flow, the payment process can be simplified through the use of tokenization and card-on-file. In this case, the solution I have provided is to enable easy setup for adding new payment methods for new and existing customers.

Wireframes and happy flows

Wireframes and happy flows

From adding a product to cart to checkout, adding a new credit card is simple and the interactions are streamlined.

UI Design

UI Design

With the base elements from the Apple iOS, certain elements were enhanced to keep the design native to its core as well as adding new features for merchants to customize their look and feel.

1.png
2.png
3.png
4.png
 With the UI design, we needed to test the UX as well. With that being said, the interaction was tested through the use of prototyping in InVision.   V  iew prototype

With the UI design, we needed to test the UX as well. With that being said, the interaction was tested through the use of prototyping in InVision.

View prototype