'Google से साइन इन करें' बटन का यूज़र एक्सपीरियंस (UX)

बटन रेंडरिंग

आपकी पसंद के हिसाब से बनाया गया बटन, आपकी वेबसाइट को मंज़ूरी देने वाले पहले Google सेशन की प्रोफ़ाइल की जानकारी दिखाता है. मंज़ूरी पा चुके Google सेशन का मतलब है कि आपकी वेबसाइट पर उससे जुड़ा एक खाता है. इस खाते से पहले भी, 'Google से साइन इन करें' सुविधा का इस्तेमाल करके साइन इन किया गया है.

अगर उसके हिसाब से बनाया गया बटन दिखाया जाता है, तो उपयोगकर्ता को ये बातें पता होती हैं:

  • कम से कम एक Google सेशन चालू है.
  • आपकी वेबसाइट पर, उससे जुड़ा खाता मौजूद हो.

आपके हिसाब से बनाए गए बटन से, उपयोगकर्ताओं को Google और आपकी वेबसाइट, दोनों पर सेशन की स्थिति के बारे में तुरंत पता चल जाता है. यह सुविधा, खास तौर पर उन असली उपयोगकर्ताओं के लिए मददगार होती है जो आपकी वेबसाइट पर सिर्फ़ कभी-कभी आते हैं. ऐसा हो सकता है कि वे यह भूल जाएं कि खाता बनाया गया है या नहीं और किस तरह से बनाया गया है. उपयोगकर्ता के हिसाब से बने बटन से उन्हें यह याद दिलाया जाता है कि 'Google से साइन इन करें' सुविधा का इस्तेमाल पहले किया जा चुका है. इससे, आपकी वेबसाइट पर डुप्लीकेट खाते बनाने से रोकने में मदद मिलती है.

सेशन का स्टेटस दिखाने के लिए, आपके हिसाब से बटन इन तरीकों से दिखाया जाता है:

  • एक सेशन: Google की ओर से सिर्फ़ एक सेशन होता है. उस सेशन से क्लाइंट को अनुमति मिलती है और आपकी वेबसाइट पर उससे जुड़ा खाता मौजूद होता है.

    आपके हिसाब से बनाया गया बटन, जो किसी एक Google खाते का नाम दिखाता है.

  • एक से ज़्यादा सेशन: Google की ओर से एक से ज़्यादा सेशन हैं. उन सेशन से क्लाइंट को अनुमति मिलती है. अनुमति, दिख रहे खाते के बगल में लिस्ट ऐरो से दिखती है. आपकी वेबसाइट पर, कम से कम एक सेशन का कोई खाता हो.

    सूची के ऐरो के साथ, उपयोगकर्ता के हिसाब से बनाया गया बटन.

  • कोई सेशन नहीं: Google की ओर से कोई सेशन नहीं है या अभी तक किसी भी सेशन से क्लाइंट को मंज़ूरी नहीं मिली है.

    'Google से साइन इन करें' बटन, जो आपके हिसाब से नहीं बनाया गया है.

जब सेशन का स्टेटस सही होता है, तब पसंद के मुताबिक बटन अपने-आप दिखता है. ऐसा तब तक होता है, जब तक आपकी बटन सेटिंग में, पसंद के मुताबिक बटन दिखाने की अनुमति नहीं होती. आपके हिसाब से बनाया गया बटन तब नहीं दिखता, जब:

  • data-type एट्रिब्यूट की वैल्यू icon है.
  • data-size एट्रिब्यूट को medium या small पर सेट किया गया हो.
  • data-width एट्रिब्यूट को 200 पिक्सल से छोटी संख्या पर सेट किया गया है.

अगर नाम या ईमेल पता बहुत लंबा है, तो बटन में उसे दिखाने के लिए, उसमें बिंदु लगाए जाते हैं.

आपके हिसाब से बनाया गया बटन, जिसमें आपका नाम और ईमेल पता छोटा करके लिखा गया है.

उपयोगकर्ता की मुख्य गतिविधियां

उपयोगकर्ताओं के सफ़र, इन स्थितियों के आधार पर अलग-अलग होते हैं.

  • Google की वेबसाइटों पर सेशन की स्थिति. उपयोगकर्ता के सफ़र की शुरुआत होने पर, Google सेशन की अलग-अलग स्थिति दिखाने के लिए, इन शब्दों का इस्तेमाल किया जाता है.

    • Has-Google-session: Google की वेबसाइटों पर कम से कम एक चालू सेशन है.
    • No-Google-session: Google की वेबसाइटों पर कोई चालू सेशन नहीं है.
  • उपयोगकर्ता अनुभव शुरू होने पर, चुने गए Google खाते से आपकी वेबसाइट को मंज़ूरी मिली है या नहीं. अनुमति की अलग-अलग स्थितियों को दिखाने के लिए, इन शब्दों का इस्तेमाल किया जाता है.

    • नया उपयोगकर्ता: चुने गए खाते ने आपकी वेबसाइट को मंज़ूरी नहीं दी है.
    • लौटने वाला उपयोगकर्ता: चुने गए खाते ने आपकी वेबसाइट को पहले भी मंज़ूरी दी है.

Google सेशन के दौरान नए उपयोगकर्ता के अनुभव

  1. 'Google से साइन इन करें' बटन.

    'Google से साइन इन करें' बटन, जिसमें आपके हिसाब से जानकारी न हो.

  2. खाता चुनने वाला पेज.

    Has-Initial-Session Account Chooser Page.

  3. उपयोगकर्ता की सहमति वाला नया पेज.

    'Google से साइन इन करें' बटन पर सहमति दें और साइन इन करें.

  4. उपयोगकर्ता की पुष्टि करने के बाद, आपकी वेबसाइट के साथ एक आईडी टोकन शेयर किया जाता है.

उपयोगकर्ता, किसी दूसरे खाते का इस्तेमाल करें बटन पर क्लिक करके, नया Google सेशन जोड़ सकते हैं. इसके बारे में ज़्यादा जानने के लिए, नीचे कोई Google सेशन नहीं उपयोगकर्ता के सफ़र देखें.

Has-Google-session returning user journey

  1. 'Google से साइन इन करें' बटन.

    आपके हिसाब से बनाया गया बटन, जो किसी एक Google खाते का नाम दिखाता है.

  2. खाता चुनने वाला पेज.

    Google खाता चुनने वाला टूल

  3. जब उपयोगकर्ता कोई खाता चुन लेता है, तो आपकी वेबसाइट के साथ एक आईडी टोकन शेयर किया जाता है.

उपयोगकर्ता, किसी दूसरे खाते का इस्तेमाल करें बटन पर क्लिक करके, नया Google सेशन जोड़ सकते हैं. इसके बारे में ज़्यादा जानने के लिए, नीचे 'Google सेशन नहीं है' उपयोगकर्ता के सफ़र देखें.

बिना Google सेशन वाले नए उपयोगकर्ता का सफ़र

  1. 'Google से साइन इन करें' बटन.

    एक बटन, जिस पर आपकी पसंद के हिसाब से जानकारी के बिना, 'Google से साइन इन करें' लिखा है.

  2. नया Google सेशन जोड़ने के लिए पहला पेज.

    Google खाता ईमेल

  3. नया Google सेशन जोड़ने के लिए दूसरा पेज.

    Google खाते में साइन इन करना

  4. उपयोगकर्ता की सहमति वाला नया पेज.

    'Google से साइन इन करें' बटन पर सहमति दें और साइन इन करें.

  5. उपयोगकर्ता की पुष्टि करने के बाद, आपकी वेबसाइट के साथ एक आईडी टोकन शेयर किया जाता है.

Google सेशन के बिना लौटने वाले उपयोगकर्ता का सफ़र

  1. 'Google से साइन इन करें' बटन.

    एक बटन, जिस पर आपकी पसंद के हिसाब से जानकारी के बिना, 'Google से साइन इन करें' लिखा है.

  2. नया Google सेशन जोड़ने के लिए पहला पेज.

    Google खाता ईमेल

  3. नया Google सेशन जोड़ने के लिए दूसरा पेज.

    Google खाते में साइन इन करना

  4. उपयोगकर्ता के आगे बढ़ें बटन पर क्लिक करने के बाद, आपकी वेबसाइट के साथ एक आईडी टोकन शेयर किया जाता है.