UX del botón Acceder con Google

Renderización de botones

Un botón personalizado muestra la información del perfil de la primera sesión de Google que aprueba tu sitio web. Una sesión de Google aprobada tiene una cuenta correspondiente en tu sitio web que accedió con Acceder con Google anteriormente.

Si se muestra un botón personalizado, el usuario sabe lo siguiente:

• Hay al menos una sesión de Google activa.
• Hay una cuenta correspondiente en tu sitio web.

Un botón personalizado les brinda a los usuarios una indicación rápida del estado de la sesión, tanto en Google como en tu sitio web, antes de que hagan clic en él. Esto es especialmente útil para los usuarios finales que visitan tu sitio web solo ocasionalmente. Es posible que olviden si se creó una cuenta o no, y de qué manera. Un botón personalizado le recuerda que ya usó Acceder con Google. Por lo tanto, ayuda a evitar la creación innecesaria de cuentas duplicadas en tu sitio web.

Para indicar el estado de la sesión, el botón personalizado se muestra de las siguientes maneras:

• Una sesión: Solo hay una sesión del lado de Google. Esa sesión aprueba al cliente y hay una cuenta correspondiente en tu sitio web.

  

• Varias sesiones: Hay varias sesiones del lado de Google. Esas sesiones aprueban al cliente. La aprobación se indica con la flecha de lista junto a la cuenta que se muestra. Al menos una sesión tiene una cuenta correspondiente en tu sitio web.

  

• Sin sesión: No hay ninguna sesión del lado de Google o ninguna de las sesiones aún aprobó al cliente.

  

El botón personalizado se muestra automáticamente cuando el estado de la sesión es adecuado, a menos que la configuración del botón no lo permita. El botón personalizado no se muestra en los siguientes casos:

• El atributo data-type es icon.
• El atributo data-size se establece en medium o small.
• El atributo data-width está configurado en un número inferior a 200 px.

El nombre o la dirección de correo electrónico se muestran con puntos suspensivos cuando son demasiado largos para mostrarse dentro del botón.

Recorridos clave de los usuarios

Los recorridos de los usuarios varían en función de los siguientes estados.

• Estado de la sesión en los sitios web de Google Los siguientes términos se usan para indicar los diferentes estados de la sesión de Google cuando comienza el recorrido del usuario.

  • Has-Google-session: Hay al menos una sesión activa en los sitios web de Google.
  • Sin sesión de Google: No hay una sesión activa en los sitios web de Google.

• Indica si la Cuenta de Google seleccionada aprobó tu sitio web cuando comienza el recorrido del usuario. Los siguientes términos se usan para indicar diferentes estados de aprobación.

  • Usuario nuevo: La cuenta seleccionada no aprobó tu sitio web.
  • Usuario recurrente: La cuenta seleccionada aprobó tu sitio web anteriormente.

Recorrido del usuario nuevo que tiene una sesión de Google

1. El botón Acceder con Google

   

2. La página del selector de cuentas

   

3. La nueva página de consentimiento del usuario

   

4. Después de que el usuario confirme, se compartirá un token de ID con tu sitio web.

Los usuarios pueden agregar una nueva sesión de Google haciendo clic en el botón Usar otra cuenta. Consulta los recorridos del usuario Sin sesión de Google a continuación.

Recorrido del usuario recurrente de la sesión de Google

1. El botón Acceder con Google

   

2. La página del selector de cuentas

   

3. Después de que el usuario elige una cuenta que ya usó, se comparte un token de ID con tu sitio web.

Los usuarios pueden agregar una nueva sesión de Google si hacen clic en el botón Usar otra cuenta. Consulta los recorridos del usuario "Sin sesión de Google" a continuación.

Recorrido del usuario nuevo sin sesión de Google

1. El botón Acceder con Google

   

2. La primera página para agregar una nueva sesión de Google.

   

3. La segunda página para agregar una nueva sesión de Google.

   

4. La nueva página de consentimiento del usuario

   

5. Después de que el usuario confirme, se compartirá un token de ID con tu sitio web.

Recorrido del usuario recurrente sin sesión de Google

1. El botón Acceder con Google

   

2. La primera página para agregar una nueva sesión de Google.

   

3. La segunda página para agregar una nueva sesión de Google.

   

4. Después de que el usuario hace clic en el botón Siguiente, se comparte un token de ID con tu sitio web.