GET STARTED
About
Designers
Developers
IDEATE & PLAN
Overview
DESIGN & DEVELOP
What's new
Content status
Foundations
UI elements
Components
Patterns
Theming
USE CASES
Overview
ARR calculator
Payments dashboard
Retail app
Corporate account services
Checkout
Checkout is the classic pattern when dealing with online clients orders. This generic version offers Finastra branding and a four steps process. It ensures a good customer experience from order to confirmation.
Previewlink

Structurelink
To make the checkout experience fast and intuitive, we divided it in four steps:
Order review
This first step typically includes a navigation, stepper, tables and buttons.
Billing form
In the billing step you'll use navigation, stepper and text input.
Payment
Payment screen allows the customer to choose his preferred method of payment. It's a form containing mostly inputs.
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.
