Skip to content
Making a card payment

Making a card payment

The sequential flow from choosing a payment method to a confirmed charge and stated next steps.

Monetization & Billing · 6 checks · 3 resources

Before you ship

6
  1. 01Offer payment methods — present the available methods and let the user select card entry
  2. 02Request card details — show all relevant text fields, sized relative to the details entered; allow saved methods to be added or removed on repeat visits
  3. 03Submit payment with card details entered — validate before submission for mistyped numbers and expired cards, and address each error state
  4. 04Show payment processing — a loading state, because a payment may take seconds or minutes and the user is watching their money
  5. 05Confirmation payment processed successfully — clearly indicate the payment was processed and the funds received
  6. 06Outline next steps — state what the payment triggered e.g. a shipment, or a link to start using the subscription

Resources that help you build this

3