New customer purchases one-off product using Credit Card

This guide details the journey for a new customer purchasing a one-off OTT Day Pass using Credit Card. You'll find both the customer-facing flow and system-level sequence, complete with API endpoint paths and CRM/contract event mappings. Use it to align the UX journey with backend specifications — and contact us if you’d like enhanced Postman or Swagger definitions for integration testing.

Customer perspective

%%{init: {
"theme": "neutral",
"look": "classic"
}}%%
flowchart TD
    A([Start]) --> B{Does username exist}
    B -- Yes --> C[Route to existing login]
    B -- No --> D[Register as new customer]

    D --> E[View product catalogue<br/>filtered by country and itemType]
    E --> F[Provide payment details]
    F --> G[Add items to cart]
    G --> H[Checkout]
    H --> I([End])

System perspective

%%{init: {
"theme": "neutral",
"look": "classic"
}}%%
sequenceDiagram
    participant C as Customer
    participant W as Web
    participant CRS as CustomerRegistrationService
    participant Cat as CatalogueService
    participant Pay as PaymentService
    participant PSP as PaymentServiceProvider
    participant Cart as CartService

    C->>W: Start
    W->>CRS: queryIfUserNameExists
    alt Username exists
        W-->>C: Route to existing login
    else Username not found
        W->>CRS: registerCustomer
        CRS-->>W: success

        W->>Cat: getCatalogue
        Cat-->>W: catalogue items (filtered by country and itemType)

        W->>Pay: createPaymentMethod
    Pay-->>W: redirect required

    W->>PSP: Redirect customer to PSP
    C->>PSP: Enter card details & complete 3DS auth
    PSP-->>W: payment auth result
    W->>Pay: confirmPaymentMethod
    Pay-->>W: paymentMethodId

        W->>Cart: addItemsToCart
        Cart-->>W: items added

        W->>Cart: checkoutCart
        Cart-->>W: checkout complete
    end

    W-->>C: End