Previewlink

Structurelink

To make the checkout experience fast and intuitive, we divided it in four steps:

1. Order review

   

   This first step typically includes a navigation, stepper, tables and buttons.

2. Billing form

   

   In the billing step you'll use navigation, stepper and text input.

3. Payment

   

   Payment screen allows the customer to choose his preferred method of payment. It's a form containing mostly inputs.

4. Confirmation

   

   Last step confirms that the order was placed. It closes the checkout process. An illustration comfort the customer that payment was processed as expected.

Layoutlink

Checkout layout is based on a 12 columns grid. You can start using a similar layout if you need to create more steps or customize your checkout experience.