दमदार और इंस्टॉल किए जा सकने वाले वेब ऐप्लिकेशन बनाने में डेवलपर की मदद करना

शुरुआती जानकारी

साल 2020 की शुरुआत में, मोबाइल और डेस्कटॉप पर Chrome टीम ने एक योजना तैयार की थी. इससे इंस्टॉल किए गए वेब ऐप्लिकेशन को खोजने लायक बनाने और उनमें लोगों की दिलचस्पी बढ़ने में मदद मिलेगी. हमारे काम से, पीडब्ल्यूए इंस्टॉल करने और यूज़र ऐक्टिविटी में 100% से ज़्यादा की बढ़ोतरी हुई. इसके लिए, हमने मौजूदा सुविधाओं पर रिसर्च की, A/B टेस्ट वाले एक्सपेरिमेंट चलाए, और उपयोगकर्ताओं के इंटरव्यू किए. इसका मकसद, लोगों की सोच और उम्मीदों के बारे में अहम जानकारी पाना था. इस लेख में बताया गया है कि हम कैसे पहुँचे.

इंस्टॉल करने के लिए यूनिफ़ाइड भाषा

पूरे वेब प्लैटफ़ॉर्म पर, पीडब्ल्यूए इंस्टॉल करने को ट्रिगर करने वाला कॉल-टू-ऐक्शन अलग-अलग था. Android पर Chrome के लिए, हमने होम स्क्रीन पर जोड़ें विकल्प चुन लिया था, लेकिन अपने डेस्कटॉप प्लैटफ़ॉर्म पर हमने इंस्टॉल करें पर ज़ोर दिया. इस अंतर की वजह टीम ने 2016 में एक स्टडी की थी. इसमें अलग-अलग स्ट्रिंग की तुलना की गई थी. टीम ने पाया कि होम स्क्रीन पर जोड़ें सुविधा कुछ हद तक मोबाइल पर बेहतर तरीके से काम करती है.

साल 2019 में, प्रॉडक्ट की अलग-अलग कैटगरी के बारे में किए गए एक और स्टडी में कोई अंतर नहीं मिला. इसलिए, पीडब्ल्यूए इंस्टॉल करने के अनुभव को बेहतर बनाने की कोशिश करने वाली टीम ने, Android पर लेबल को इंस्टॉल करें पर अपडेट करने का फ़ैसला लिया. 2021 में एक आगे की स्टडी में इंस्टॉल करें, डाउनलोड करें, और डाउनलोड करें भाषाओं की तुलना की गई. इससे हमें पता चला कि लोगों ने इंस्टॉल को समझ लिया था कि यह प्रक्रिया पूरी हो रही थी. उपयोगकर्ताओं को लगा कि Get लेबल वाले बटन पर टैप करने से, उपयोगकर्ता किसी वेबसाइट पर पहुंच जाएगा. साथ ही, डाउनलोड करें बटन पर क्लिक करने से, उन्हें लगा कि कोई फ़ाइल उनके डाउनलोड फ़ोल्डर में या ऐसी ही किसी जगह पर पहुंच जाएगी.

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

डेस्कटॉप पर इंस्टॉल करने का आइकॉन

हमारे डेस्कटॉप प्लैटफ़ॉर्म पर, हमारे पास ऐसा डिज़ाइन पैटर्न होता है कि जब भी कोई वेबसाइट पीडब्ल्यूए लोड करती है, तो Chrome खोज वाली पट्टी की दाईं ओर एक गोली दिखाएगा, जिसमें एक आइकॉन और इंस्टॉल करें लेबल होगा. इसके बाद, जब कोई उपयोगकर्ता किसी साइट पर जाएगा, तो उसे सिर्फ़ आइकॉन दिखेगा. इस पिल पर क्लिक करने से डेस्कटॉप PWA इंस्टॉल हो जाएगा.

ओरिजनल इंस्टॉल के साथ का आइकॉन.
मूल इंस्टॉल प्लस आइकॉन.

शुरुआत में यह आइकॉन प्लस का निशान था. ऐसा कुछ इसलिए हुआ, क्योंकि मोबाइल पर इस्तेमाल होने वाली होम स्क्रीन पर जोड़ें वाला रूप इस्तेमाल किया गया था. हालांकि, जैसा कि बताया गया है, हमने इंस्टॉल करें भाषा का इस्तेमाल किया था. डेवलपर समुदाय से हमें जो फ़ीडबैक मिला वह यह था कि यह आइकॉन भ्रम की स्थिति पैदा करने वाला था. इसके अलावा, अगर कोई उपयोगकर्ता टेक्स्ट को बड़ा करने के लिए ज़ूम फ़ंक्शन का इस्तेमाल करता है, तो ज़ूम के लिए इस्तेमाल होने वाला आइकॉन काफ़ी मिलता-जुलता दिखता है. इससे उपयोगकर्ता को भ्रम हो सकता है.

खोज बार (खोज क्वेरी डालने वाला बार) में, ज़ूम और इंस्टॉल आइकॉन मौजूद हैं.
खोज वाली पट्टी में ज़ूम और इंस्टॉल आइकॉन मौजूद हैं.

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

हमने यह भी पाया कि उपयोगकर्ताओं ने मुख्य रूप से उन तस्वीरों को जोड़ा है जिन्हें इंस्टॉल करने के साथ ही, ऐरो और डिवाइस भी मिलते हैं. इन नतीजों के आधार पर, हमने Chrome में एक A/B/C टेस्ट किया. इसमें मौजूदा डिज़ाइन की तुलना दो विकल्पों से की गई. हम एक तीर के निशान पर पहुंच गए, जो नीचे एक मॉनिटर पर पॉइंट कर रहा था. इस निशान ने अन्य दो गेम के मुकाबले काफ़ी बेहतर परफ़ॉर्म किया. हमने इस नए आइकॉन के साथ इंस्टॉल यूज़र इंटरफ़ेस (यूआई) को खारिज करने की प्रोसेस में भी कमी देखी.

मटीरियल डिज़ाइन आइकॉन सेट से आइकॉन के वैरिएंट इंस्टॉल करें.
इंस्टॉल किए जाने वाले आइकॉनोग्राफ़ी के ऐसे वैरिएंट जिन्हें मटीरियल डिज़ाइन आइकॉन सेट से डाउनलोड किया जा सकता है.

नतीजे के तौर पर आपको आज का डिज़ाइन दिखा है. इस वजह से, वेबसाइटों के लिए PWA को इंस्टॉल करने की दर दोगुनी से ज़्यादा हो गई है. हमने इस आइकॉन के साथ-साथ एक मोबाइल भी जोड़ा है, जो हमारे मटीरियल डिज़ाइन आइकॉन सेट से मिलता-जुलता है. इससे समुदाय को आइकॉनोग्राफ़ी का इस्तेमाल करने में आसानी हुई जो हमें सबसे दिलचस्प लगी.

बेशक, एक आइकॉन से दुनिया में बदलाव नहीं आएगा, जो हमें अपनी अगली सुविधा पर ले जाएगा.

इन-प्रॉडक्ट सहायता

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

इन-प्रॉडक्ट सहायता बबल.
प्रॉडक्ट में मौजूद सहायता टूलटिप बबल, जो उपयोगकर्ताओं को सुविधाओं के बारे में जानकारी देता है.

जब कोई उपयोगकर्ता नियमित रूप से किसी वेबसाइट पर जाता है, तो Chrome साइट जुड़ाव नाम की एक सेवा का इस्तेमाल करता है. इससे यह जानकारी मिलती है कि उपयोगकर्ता किसी साइट से कितना जुड़ा हुआ है. chrome://site-engagement/ पर जाकर, आपको उन साइटों के बारे में जानकारी मिल सकती है जिनसे आपकी दिलचस्पी लगातार बनी रहती है. इन स्कोर का इस्तेमाल करके हम यह पता लगा सकते हैं कि उपयोगकर्ता की दिलचस्पी किसी वेबसाइट में है या नहीं. अगर साइट एक PWA थी और उपयोगकर्ता की दिलचस्पी थी, तो हम उन्हें ऐप्लिकेशन में प्रॉडक्ट सहायता इंस्टॉल करने का यूज़र इंटरफ़ेस (यूआई) दिखाएंगे. इसका मतलब था कि हमने सिर्फ़ दिलचस्पी रखने वाले उपयोगकर्ताओं पर ध्यान दिया, न कि उन उपयोगकर्ताओं को परेशान करने के लिए जो एक बार साइट पर आ सकते हैं.

डेस्कटॉप पर इन-प्रॉडक्ट सहायता का इस्तेमाल करने से, पीडब्ल्यूए इंस्टॉल करने में 100% से ज़्यादा की बढ़ोतरी हुई. इससे यह पता चला कि दिलचस्पी रखने वाले उपयोगकर्ताओं पर फ़ोकस करने से, वेब ऐप्लिकेशन इंस्टॉल करना ज़्यादा आसान हो गया है.

बेहतर इंस्टॉल यूज़र इंटरफ़ेस (यूआई)

ज़्यादातर उपयोगकर्ताओं के लिए, इंस्टॉल करने का मॉडल स्टोर है. मध्य 2000 के दशक से हमने उपयोगकर्ताओं को शिक्षित किया है कि जब भी वे कोई ऐप्लिकेशन इंस्टॉल करेंगे, तो उन्हें ऐप्लिकेशन का ब्यौरा, स्क्रीनशॉट और अन्य मेटाडेटा दिखेगा. इससे उन्हें यह तय करने में मदद मिलेगी कि ऐप्लिकेशन उनकी ज़रूरत के मुताबिक है या नहीं.

PWA का इस्तेमाल करने पर, वेब ऐप्लिकेशन इंस्टॉल करने का फ़ैसला लेने के बाद उपयोगकर्ता को जो यूज़र इंटरफ़ेस (यूआई) दिखा वह ठीक नहीं था. इसलिए, टीम ने एक बेहतर इंस्टॉल अनुभव एक्सप्लोर करने का फ़ैसला किया. इससे हमारे उपयोगकर्ताओं को वेब ऐप्लिकेशन के बारे में जानकारी मिलेगी. साथ ही, टीम ने डेवलपर को ऐसे PWA का जश्न मनाने में मदद की जो नेटिव अनुभवों के बराबर थे.

बेहतर इंस्टॉल यूज़र इंटरफ़ेस (यूआई).
बेहतर इंस्टॉल यूज़र इंटरफ़ेस (यूआई), इसे छोटा किया गया और बड़ा किया गया है.

इस साल की शुरुआत में, हमने रिचर इंस्टॉल लॉन्च किया. यह Android पर Chrome पर एक एक्सटेंडेड इंस्टॉल यूज़र इंटरफ़ेस (यूआई) है. इसकी मदद से डेवलपर अपने मेनिफ़ेस्ट में स्क्रीनशॉट जोड़ सकते हैं. डेवलपर चाहें, तो ब्यौरा भी जोड़ सकते हैं. हालांकि, ऐसा करने का सुझाव दिया जाता है, लेकिन यह ज़रूरी नहीं है. इस नए यूज़र इंटरफ़ेस (यूआई) की वजह से, हमें कुछ पीडब्ल्यूए के लिए इंस्टॉल रेट को दोगुना करने का एहसास हुआ. इससे पता चला कि उपयोगकर्ताओं को ज़्यादा कॉन्टेक्स्ट और बेहतर अनुभव देने पर, वेब ऐप्लिकेशन इंस्टॉल करने में उपयोगकर्ताओं का भरोसा बढ़ता है.. फ़िलहाल, इस यूज़र इंटरफ़ेस (यूआई) के डेस्कटॉप वर्शन पर काम चल रहा है.

नतीजा

टीम ने पिछले दो साल से, Chrome की नई सुविधाओं को एक्सप्लोर और एक्सपेरिमेंट किया है. इन सुविधाओं ने पीडब्ल्यूए डेवलपर को चालू और बेहतर बनाया है. साथ ही, लोगों को वेब अनुभव के फ़ायदों के बारे में बताने में भी मदद की है. हम अब भी बहुत कुछ कर सकते हैं, लेकिन साथ मिलकर हम अपने उपयोगकर्ताओं के जीवन को बेहतर और बेहतर बना सकते हैं और ओपन वेब का समर्थन कर सकते हैं.