[WIP] Simplifying payment screen to improve conversion by 16%.

Payment screen revamp

We wanted to increase the conversion rate from the payment screen to confirmation screen

Business problem

eDreams

Hypothesis

We believe that the design of the payment form for credit card isn't very prominent so users can easily miss it when trying to add their credit card details.

Solution proposal

To revamp credit card form in the payment screen, making it more interactive and visual appealing to users.

Payment screen previous UI

The following flow illustrates the path users had to go through in order to have their purchase confirmed.

PAX and Payment were the screens higher bounce rate. We chose to start with Payment screen as the tech effort implied to make the changes was lower.

User flow

I created a interactive prototype using Axure to test it with users. You can try it out.

Use the following data to have the form validated

Card number: 4401 4653 1123 4522
Expiry date: 08/22
CVV: 294

Wireframe Prototype

Scroll, click and try ⬆️