Linee guida provvisorie per l'esperienza utente per sistemi di fatturazione in-app alternativi

Panoramica

Per mantenere un'esperienza utente coerente e aiutare gli utenti a fare una scelta consapevole, devi mostrare una schermata informativa e una schermata di scelta della fatturazione separata se offri un sistema di fatturazione in-app alternativo a quello di Google Play. La schermata informativa deve essere mostrata a ogni utente solo la prima volta che avvia un acquisto, mentre la schermata di scelta della fatturazione deve essere mostrata prima di ogni acquisto. I messaggi rivolti agli utenti e le specifiche dell'interfaccia utente per entrambe le schermate devono essere implementati in base alle seguenti linee guida.

Informazioni per gli utenti

La schermata informativa aiuta gli utenti a comprendere il contesto della modifica e fornisce maggiori informazioni per aiutarli a fare una scelta consapevole.

Quando visualizzare

La schermata informativa deve essere mostrata agli utenti all'inizio del loro primo acquisto dopo l'aggiunta di un sistema di fatturazione in-app alternativo. Questo messaggio non deve essere visualizzato negli acquisti successivi dello stesso utente. Mostra la schermata informativa subito dopo che un utente ha intrapreso un'azione esplicita per avviare un acquisto.

Quando mostrare il prezzo

Il prezzo di acquisto deve essere visibile e chiaro per gli utenti prima che vengano mostrati la schermata delle informazioni o la schermata di scelta della fatturazione.

Come visualizzare

La schermata delle informazioni dovrebbe essere visualizzata in un foglio modale nella parte inferiore. Un riquadro inferiore modale è simile a una finestra di dialogo modale che si anima dal basso dello schermo e rimane bloccata in basso. Si trova sopra tutti gli elementi dell'interfaccia utente sullo schermo sottostante. La schermata sottostante è oscurata da una tendina scura per indicare che non risponderà all'interazione dell'utente.

Per ulteriori informazioni su progettazione e implementazione dei fogli modali inferiori, consulta Google Material Design.

Azioni utente

Il riquadro inferiore deve essere attivato quando un utente tocca un pulsante o un altro elemento dell'interfaccia utente nell'app che avvia un acquisto. Dalla schermata delle informazioni, l'utente può eseguire tre azioni possibili:

Continua

Se tocchi il pulsante "Continua", la schermata informativa viene chiusa e si apre la schermata di scelta della fatturazione.

Scopri di più

Se tocchi il pulsante "Scopri di più", si apre un articolo del Centro assistenza Google in un browser web.

Ignora

Se gli utenti vogliono chiudere il riquadro inferiore e tornare alla schermata sottostante, possono chiuderlo:

• Toccando al di fuori del riquadro inferiore
• Toccando il pulsante "Indietro" del sistema Android

La schermata informativa non deve essere visualizzata di nuovo dopo essere stata chiusa o dopo che l'utente ha toccato "Continua".

Esempio: il prezzo di acquisto viene visualizzato chiaramente prima che l'utente avvii l'acquisto. Se tocchi il pulsante "Partecipa ora", viene visualizzata la schermata delle informazioni.

Specifiche di progettazione

La schermata informativa è suddivisa in tre componenti: titolo, messaggio e pulsanti. Tutti e tre i componenti sono obbligatori e devono contenere il testo e gli elementi dell'interfaccia utente esatti definiti in queste linee guida. Non includere testo o immagini aggiuntivi in questa schermata, ma puoi includere testo e immagini aggiuntivi in altre schermate.

1. Titolo
2. Messaggio
3. Pulsanti
4. Riquadro inferiore
5. Background scrim

Titolo

Messaggio

Pulsante 1

Pulsante 2

Riquadro inferiore

Orizzontale

Nella visualizzazione orizzontale, il riquadro inferiore è più largo rispetto alla visualizzazione verticale, ma per il resto segue le stesse specifiche di progettazione e funzionalità.

Schermata di scelta della fatturazione

La schermata di scelta della fatturazione offre agli utenti due opzioni di checkout per completare l'acquisto. Per aiutare gli utenti a prendere una decisione informata, ogni opzione di servizio di fatturazione mostra anche le forme di pagamento disponibili. Una volta che gli utenti hanno fatto la loro scelta, continueranno a completare l'acquisto tramite quel servizio di fatturazione.

Quando visualizzare

Se l'utente ha già visualizzato la schermata informativa, la schermata di scelta della fatturazione dovrebbe essere visualizzata immediatamente dopo che l'utente ha intrapreso un'azione esplicita per avviare un acquisto.

Come visualizzare

La schermata di scelta della fatturazione deve essere visualizzata in un riquadro inferiore modale e seguire le stesse specifiche della schermata informativa.

Rappresentazione visiva equa

I pulsanti per il servizio di fatturazione in-app aggiuntivo e per il servizio di fatturazione di Google Play devono essere rappresentati in modo equo e paritario. Ciò include, a titolo esemplificativo, dimensioni dei pulsanti, dimensioni/stile del testo, target dei tocchi e dimensioni delle icone. Non aggiungere testo, immagini o modifiche di stile aggiuntive non definite in queste linee guida.

Esempio: toccando il pulsante "Iscriviti ora" viene visualizzata la schermata di scelta della fatturazione.

Specifiche di progettazione

La schermata di scelta della fatturazione è composta da quattro componenti distinti: titolo, descrizione, pulsante dello sviluppatore e pulsante Google Play. Tutti i componenti devono essere utilizzati e devono contenere il testo e gli elementi dell'interfaccia utente esatti definiti in queste linee guida. Ti chiediamo di non includere testo o immagini aggiuntivi in questa schermata, ma puoi includere testo e immagini aggiuntivi in altre schermate di tua proprietà.

Le risorse visive per Google Play e le icone di pagamento sono disponibili tramite i link forniti di seguito.

Esempio: nella visualizzazione verticale, il foglio inferiore deve occupare il 100% della larghezza totale dello schermo.

1. Titolo
2. Descrizione
3. Pulsante Sviluppatore
4. Pulsante Google Play
5. Riquadro inferiore
6. Background scrim

Titolo

Descrizione

Pulsante Sviluppatore

1. Icona dell'app
2. Nome app
3. Icone dei metodi di pagamento

Icone dei metodi di pagamento

1. Numero massimo di icone dei metodi di pagamento
2. Nomi dei metodi di pagamento anziché icone

Ridimensiona in base alla larghezza dello schermo

3. Larghezza di 360 dp
4. Larghezza di 480 dp

Contenitore pulsanti

Icona dell'app

Titolo

Metodi di pagamento

Pulsante Google Play

1. Icona
2. Titolo
3. Metodi di pagamento accettati
4. Indicatore aggiuntivo

Contenitore pulsanti

Icona dell'app

Titolo

Metodi di pagamento

Orizzontale

Esempio: nella visualizzazione orizzontale, il riquadro inferiore è più largo rispetto alla visualizzazione verticale, ma per il resto segue le stesse specifiche di progettazione e funzionalità.