UX pulsante Accedi con Google

Rendering del pulsante

Un pulsante personalizzato mostra le informazioni del profilo per la prima sessione Google che approva il tuo sito web. A una sessione Google approvata è associato un account sul tuo sito web che ha già eseguito l'accesso utilizzando Accedi con Google.

Se viene visualizzato un pulsante personalizzato, l'utente conosce quanto segue:

  • È presente almeno una sessione Google attiva.
  • È presente un account corrispondente sul tuo sito web.

Un pulsante personalizzato offre agli utenti una rapida indicazione dello stato della sessione, sia sul lato Google sia sul tuo sito web, prima che facciano clic sul pulsante. Ciò è particolarmente utile per gli utenti finali che visitano il tuo sito web solo occasionalmente. Potrebbero dimenticare se un account è stato creato o meno e in che modo. Un pulsante personalizzato ricorda loro che Accedi con Google è già stato utilizzato in precedenza. Pertanto, consente di evitare la creazione di account duplicati non necessari sul tuo sito web.

Per indicare lo stato della sessione, il pulsante personalizzato viene visualizzato nei seguenti modi:

  • Una sessione:è presente una sola sessione per Google. La sessione approva il cliente e sul tuo sito web è presente un account corrispondente.

    Un pulsante personalizzato che mostra il nome di un singolo Account Google.

  • Più sessioni: ci sono più sessioni lato Google. Queste sessioni approvano il cliente. L'approvazione è indicata dalla freccia dell'elenco accanto all'account visualizzato. Almeno una sessione ha un account corrispondente sul tuo sito web.

    Un pulsante personalizzato con una freccia per l'elenco.

  • Nessuna sessione: non esiste alcuna sessione da parte di Google o nessuna delle sessioni ha ancora approvato il client.

    Un pulsante "Accedi con Google" senza informazioni personalizzate.

Il pulsante personalizzato viene visualizzato automaticamente se lo stato della sessione è appropriato, a meno che le impostazioni del pulsante non ne consentano la visualizzazione. Il pulsante personalizzato non viene visualizzato se:

  • L'attributo data-type è icon.
  • L'attributo data-size è impostato su medium o small.
  • L'attributo data-width è impostato su un numero inferiore a 200 px.

Il nome o l'indirizzo email hanno dei puntini di sospensione quando sono troppo lunghi per essere visualizzati all'interno del pulsante.

Un pulsante personalizzato con nome e indirizzo email e puntini di sospensione.

Percorsi dell'utente chiave

I percorsi degli utenti variano in base ai seguenti stati.

  • Stato della sessione sui siti web Google. I seguenti termini vengono utilizzati per indicare un diverso stato della sessione Google all'inizio del percorso dell'utente.

    • Sessione Has-Google: è presente almeno una sessione attiva sui siti web di Google.
    • Sessione senza Google: nessuna sessione attiva sui siti web di Google.
  • Indica se l'Account Google selezionato ha approvato il tuo sito web all'inizio del percorso dell'utente. I seguenti termini vengono utilizzati per indicare i diversi stati di approvazione.

    • Nuovo utente: l'account selezionato non ha approvato il tuo sito web.
    • Utente di ritorno: l'account selezionato ha già approvato il tuo sito web in passato.

Percorso di un nuovo utente con sessione Google

  1. Il pulsante Accedi con Google.

    Un pulsante "Accedi con Google" senza informazioni personalizzate.

  2. La pagina del selettore account.

    Ha la pagina Selettore account iniziale.

  3. La pagina relativa al consenso del nuovo utente.

    Consenso per il pulsante Accedi con Google e accesso.

  4. Dopo la conferma da parte dell'utente, viene condiviso un token ID con il tuo sito web.

Gli utenti possono aggiungere una nuova sessione Google facendo clic sul pulsante Utilizza un altro account. Consulta i percorsi degli utenti Nessuna sessione Google di seguito.

Percorso dell'utente di ritorno con sessione Google

  1. Il pulsante Accedi con Google.

    Un pulsante personalizzato che mostra il nome di un singolo Account Google.

  2. La pagina del selettore account.

    Selettore Account Google

  3. Dopo che l'utente sceglie un account di ritorno, un token ID viene condiviso con il tuo sito web.

Gli utenti possono aggiungere una nuova sessione Google facendo clic sul pulsante Utilizza un altro account. Consulta i percorsi degli utenti "Nessuna sessione Google" di seguito.

Percorso di un nuovo utente senza sessione Google

  1. Il pulsante Accedi con Google.

    Un pulsante "Accedi con Google" senza informazioni personalizzate.

  2. La prima pagina in cui aggiungere una nuova sessione Google.

    Email account Google

  3. La seconda pagina in cui aggiungere una nuova sessione Google.

    Accesso all'Account Google

  4. La pagina relativa al consenso del nuovo utente.

    Consenso per il pulsante Accedi con Google e accesso.

  5. Dopo la conferma da parte dell'utente, viene condiviso un token ID con il tuo sito web.

Percorso dell'utente di ritorno senza sessione Google

  1. Il pulsante Accedi con Google.

    Un pulsante "Accedi con Google" senza informazioni personalizzate.

  2. La prima pagina in cui aggiungere una nuova sessione Google.

    Email account Google

  3. La seconda pagina in cui aggiungere una nuova sessione Google.

    Accesso all'Account Google

  4. Dopo che l'utente fa clic sul pulsante Avanti, viene condiviso un token ID con il tuo sito web.