UX ของปุ่มลงชื่อเข้าใช้ด้วย Google

การแสดงผลปุ่ม

ปุ่มที่ปรับเปลี่ยนในแบบของคุณจะแสดงข้อมูลโปรไฟล์สำหรับเซสชัน Google แรกๆ ที่อนุมัติเว็บไซต์ เซสชัน Google ที่ได้รับอนุมัติจะมีบัญชีที่เกี่ยวข้องในเว็บไซต์ซึ่งเคยลงชื่อเข้าใช้โดยใช้ฟีเจอร์ลงชื่อเข้าใช้ด้วย Google มาก่อน

หากปุ่มที่ปรับเปลี่ยนในแบบของคุณแสดงอยู่ ผู้ใช้จะทราบข้อมูลดังต่อไปนี้

• มีเซสชัน Google ที่ใช้งานอยู่อย่างน้อย 1 รายการ
• มีบัญชีที่เกี่ยวข้องในเว็บไซต์ของคุณ

ปุ่มที่ปรับให้เหมาะกับผู้ใช้จะแสดงสถานะเซสชันโดยย่อแก่ผู้ใช้ ทั้งฝั่ง Google และในเว็บไซต์ของคุณ ก่อนที่ผู้ใช้จะคลิกปุ่ม ซึ่งจะเป็นประโยชน์อย่างยิ่งสําหรับผู้ใช้ปลายทางที่เข้าชมเว็บไซต์ของคุณเป็นครั้งคราวเท่านั้น ผู้ใช้อาจลืมไปแล้วว่ามีการสร้างบัญชีหรือไม่ และสร้างด้วยวิธีใด ปุ่มที่ปรับเปลี่ยนในแบบของคุณจะเตือนให้ผู้ใช้ทราบว่าเคยใช้ฟีเจอร์ลงชื่อเข้าใช้ด้วย Google มาก่อน จึงช่วยป้องกันการสร้างบัญชีซ้ำที่ไม่จำเป็นในเว็บไซต์

ในการระบุสถานะเซสชัน ปุ่มที่ปรับเปลี่ยนในแบบของคุณจะแสดงตามวิธีต่อไปนี้

• 1 เซสชัน: มีเซสชันเพียง 1 เซสชันทางฝั่งของ Google เซสชันนั้นจะอนุมัติลูกค้า และมีบัญชีที่เกี่ยวข้องในเว็บไซต์ของคุณ

  

• เซสชันหลายรายการ: มีเซสชันหลายรายการในฝั่งของ Google เซสชันเหล่านั้นจะอนุมัติไคลเอ็นต์ คุณจะทราบการอนุมัติได้จากลูกศรรายการข้างบัญชีที่แสดง เซสชันอย่างน้อย 1 รายการมีบัญชีที่เกี่ยวข้องในเว็บไซต์

  

• ไม่มีเซสชัน: ไม่มีเซสชันในฝั่งของ Google หรือไม่มีเซสชันใดอนุมัติไคลเอ็นต์เลย

  

ปุ่มในแบบของคุณจะแสดงโดยอัตโนมัติเมื่อสถานะเซสชัน เหมาะสม เว้นแต่การตั้งค่าปุ่มของคุณไม่อนุญาตให้มีการแสดงปุ่มที่ปรับเปลี่ยนในแบบของคุณ ปุ่มที่ปรับตามโปรไฟล์ผู้ใช้จะไม่แสดงในกรณีต่อไปนี้

• แอตทริบิวต์ data-type คือ icon
• แอตทริบิวต์ data-size ตั้งค่าเป็น medium หรือ small
• แอตทริบิวต์ data-width ได้รับการตั้งค่าเป็นตัวเลขที่น้อยกว่า 200 พิกเซล

ระบบจะตัดชื่อหรืออีเมลให้สั้นลงเมื่อยาวเกินกว่าที่จะแสดงในปุ่มได้

เส้นทางของผู้ใช้ที่สําคัญ

เส้นทางของผู้ใช้จะแตกต่างกันไปตามสถานะต่อไปนี้

• สถานะเซสชันในเว็บไซต์ของ Google คำต่อไปนี้ใช้เพื่อระบุสถานะเซสชันต่างๆ ของ Google เมื่อเส้นทางของผู้ใช้เริ่มต้น

  • มีเซสชันของ Google: มีเซสชันที่ใช้งานอยู่อย่างน้อย 1 เซสชันในเว็บไซต์ Google
  • ไม่มีเซสชันของ Google: ไม่มีเซสชันที่ใช้งานอยู่ในเว็บไซต์ของ Google

• บัญชี Google ที่เลือกอนุมัติเว็บไซต์ของคุณหรือไม่เมื่อผู้ใช้เริ่มเส้นทาง คำต่อไปนี้ใช้เพื่อระบุสถานะการอนุมัติที่แตกต่างกัน

  • ผู้ใช้ใหม่: บัญชีที่เลือกยังไม่ได้อนุมัติเว็บไซต์ของคุณ
  • ผู้ใช้ที่กลับมา: บัญชีที่เลือกได้อนุมัติเว็บไซต์ของคุณแล้วก่อนหน้านี้

Has-Google-session new user journey

1. ปุ่มลงชื่อเข้าใช้ด้วย Google

   

2. หน้าตัวเลือกบัญชี

   

3. หน้าความยินยอมของผู้ใช้แบบใหม่

   

4. หลังจากผู้ใช้ยืนยัน ระบบจะแชร์โทเค็นรหัสกับเว็บไซต์

ผู้ใช้สามารถเพิ่มเซสชัน Google ใหม่ได้โดยคลิกปุ่มใช้บัญชีอื่น ดูเส้นทางของผู้ใช้ที่ไม่มีเซสชันใน Google ด้านล่าง

เส้นทางของผู้ใช้ที่กลับมาซึ่งมีเซสชัน Google

1. ปุ่มลงชื่อเข้าใช้ด้วย Google

   

2. หน้าตัวเลือกบัญชี

   

3. หลังจากที่ผู้ใช้เลือกบัญชีที่กลับมาแล้ว ระบบจะแชร์โทเค็นรหัสกับเว็บไซต์

ผู้ใช้สามารถเพิ่มเซสชัน Google ใหม่ได้โดยคลิกปุ่มใช้บัญชีอื่น โปรดดูเส้นทางของผู้ใช้ "ไม่มีเซสชัน Google" ด้านล่าง

เส้นทางของผู้ใช้ใหม่ที่ไม่มีเซสชัน Google

1. ปุ่มลงชื่อเข้าใช้ด้วย Google

   

2. หน้าแรกสําหรับเพิ่มเซสชัน Google ใหม่

   

3. หน้าเว็บที่ 2 เพื่อเพิ่มเซสชัน Google ใหม่

   

4. หน้าความยินยอมของผู้ใช้ใหม่

   

5. หลังจากผู้ใช้ยืนยันแล้ว ระบบจะแชร์โทเค็นระบุตัวตนกับเว็บไซต์ของคุณ

เส้นทางของผู้ใช้ที่กลับมาซึ่งไม่มีเซสชัน Google

1. ปุ่มลงชื่อเข้าใช้ด้วย Google

   

2. หน้าแรกสําหรับเพิ่มเซสชัน Google ใหม่

   

3. หน้าเว็บที่ 2 เพื่อเพิ่มเซสชัน Google ใหม่

   

4. หลังจากผู้ใช้คลิกปุ่มถัดไป ระบบจะแชร์โทเค็นระบุตัวตนกับเว็บไซต์ของคุณ