# L'esperienza di pagamento

{% hint style="info" %}
Il brand non riguarda soltanto il marchio o i colori, ma anche l'esperienza percepita nell'utilizzo di un servizio. Le regole descritte in questa pagina aiutano a progettare un'esperienza di pagamento tramite pagoPA semplice e immediata.
{% endhint %}

## Rendi visibile il flusso di pagamento

Fai in modo che gli utenti del tuo prodotto riescano a trovare facilmente il flusso di pagamento, sia nel menu sia tramite eventuali funzioni di ricerca.

{% hint style="warning" %}
Ricorda di menzionare sempre "pagoPA", anche se la tecnologia è basata su piattaforme offerte da altri soggetti.
{% endhint %}

<figure><img src="https://1603831084-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F8phwN5u2QXllSKsqBjQU%2Fuploads%2FyXoszJmIoVexhGd50mHj%2FRendi%20visibile%20il%20flusso.png?alt=media&#x26;token=380284ce-7073-46b9-b7fc-1344f5ea1576" alt="Esempi corretti e non di come rendere visibile il flusso di pagamento pagoPA"><figcaption></figcaption></figure>

## Favorisci l'uso del codice QR

Se il tuo prodotto lo consente, favorisci l'esperienza di pagamento basata su codice QR: i tuoi utenti non dovranno digitare a mano i dati presenti sull'avviso di pagamento.

<figure><img src="https://1603831084-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F8phwN5u2QXllSKsqBjQU%2Fuploads%2FOlWV9b4qVTde11rV3ybp%2Fqrcodeexample.png?alt=media&#x26;token=e156686d-811d-46d8-a2bf-db51e74aa50d" alt="Schermata di app in cui si sta inquadrando un codice QR"><figcaption><p>Esempio di app  che consente di scansionare diversi tipi di codici QR legati ai pagamenti, pagoPA incluso.</p></figcaption></figure>

## Fornisci istruzioni chiare

Se è necessario inserire a mano i dati, utilizza i nomi corretti, così da non confondere i tuoi utenti.

### Mostra dove trovare i dati

Puoi inserire un avviso di esempio così da aiutare gli utenti a trovare i dati richiesti:

{% file src="<https://1603831084-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F8phwN5u2QXllSKsqBjQU%2Fuploads%2Fn36om7XAYndKmZCiuhhm%2Fpayment-notice-pagopa.b5f9cd8e.png?alt=media&token=6e2e5e20-ab49-4389-8f47-69b903f129c1>" %}

### Utilizza la terminologia corretta

I campi obbligatori, riportati entrambi sull'avviso di pagamento, sono due:

1. **Numero Avviso**, composto sempre da 18 cifre
2. **Codice Fiscale Ente Creditore**, composto sempre da 11 cifre

{% tabs %}
{% tab title="✅ Fai così" %}

<figure><img src="https://1603831084-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F8phwN5u2QXllSKsqBjQU%2Fuploads%2FDAfpt1YyTJ1ojj4gOZfd%2FSchermata%202022-09-21%20alle%2010.10.18.png?alt=media&#x26;token=60a8b110-6bcd-4d7a-bf4f-34b516670cdf" alt="Esempio corretto di come utilizzare la terminologia in un flusso di pagamento"><figcaption></figcaption></figure>

* [x] Il campo Ente Creditore accetta più input (11 cifre, codice CBILL, nome dell'Ente)
* [x] Il campo Ente Creditore è chiamato correttamente
* [x] Il campo Codice Avviso è chiamato correttamente
* [x] Il link "Dove li trovo?" mostra dove trovare le informazioni sull'avviso
  {% endtab %}

{% tab title="❌ Non così" %}

<figure><img src="https://1603831084-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F8phwN5u2QXllSKsqBjQU%2Fuploads%2F9W3c0wapBykrb0NPiNKb%2FSchermata%202022-09-21%20alle%2009.58.29.png?alt=media&#x26;token=8b4f5f46-509a-4697-af14-3ca28bdf889b" alt="Esempio errato di come utilizzare la terminologia in un flusso di pagamento"><figcaption></figcaption></figure>

* Il campo "Nome Azienda" confonde l'utente
* Il campo "Nome Azienda" non consente l'inserimento del Codice Fiscale Ente Creditore (o del codice CBILL)
* Il campo "Codice identificativo del pagamento" confonde l'utente
  {% endtab %}
  {% endtabs %}

{% hint style="info" %}
**Hai integrato pagoPA tramite i servizi offerti da CBILL?**

Semplifica l'esperienza di pagamento creando due maschere distinte, una per l'inserimento dei dati CBILL presenti sui bollettini postali e una per il pagamento degli avvisi pagoPA. In questo modo potrai usare le terminologie corrette a seconda del contesto.
{% endhint %}
