इन-ऐप बिलिंग के अन्य सिस्टम इस्तेमाल करने के लिए, मौजूदा UX के दिशा-निर्देश

खास जानकारी

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

इस्तेमाल करने वालों के लिए जानकारी

'जानकारी' स्क्रीन से, लोगों को बदलाव के बारे में ज़्यादा जानकारी मिलती है. साथ ही, उन्हें सोच-समझकर फ़ैसला लेने में मदद मिलती है.

कब दिखाना है

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

कीमत कब दिखानी है

खरीदारी की कीमत, उपयोगकर्ताओं को साफ़ तौर पर दिखाई जानी चाहिए. ऐसा तब होना चाहिए, जब उन्हें जानकारी वाली स्क्रीन या बिलिंग का विकल्प चुनने वाली स्क्रीन दिखाई जाए.

डिसप्ले करने का तरीका

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

मोडल बॉटम शीट के डिज़ाइन और इन्हें लागू करने के बारे में ज़्यादा जानने के लिए, Google Material Design देखें.

उपयोगकर्ता की कार्रवाइयां

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

जारी रखें

“जारी रखें” बटन पर टैप करने से, जानकारी वाली स्क्रीन बंद हो जाती है और बिलिंग सिस्टम चुनने की स्क्रीन खुल जाती है.

ज़्यादा जानें

“ज़्यादा जानें” बटन पर टैप करने से, वेब ब्राउज़र में Google सहायता केंद्र का लेख खुलता है.

खारिज करें

अगर उपयोगकर्ताओं को बॉटम शीट बंद करके, पिछली स्क्रीन पर वापस जाना है, तो वे बॉटम शीट को बंद करने के लिए, इनमें से कोई तरीका अपना सकते हैं:

• बॉटम शीट कंटेनर के बाहर टैप करना
• Android सिस्टम के "वापस जाएं" बटन पर टैप करना

सूचना वाली स्क्रीन को खारिज करने के बाद या उपयोगकर्ता के “जारी रखें” पर टैप करने के बाद, उसे फिर से दिखाने की ज़रूरत नहीं होती.

उदाहरण: खरीदारी शुरू करने से पहले, खरीदार को खरीदारी के लिए चुकाई जाने वाली कीमत साफ़ तौर पर दिखाई गई है. “अभी शामिल हों” बटन पर टैप करने से, जानकारी वाली स्क्रीन खुल जाती है.

डिज़ाइन की खास जानकारी

सूचना वाली स्क्रीन को तीन कॉम्पोनेंट में बांटा गया है: टाइटल, मैसेज, और बटन. ये तीनों कॉम्पोनेंट ज़रूरी हैं. इनमें वही टेक्स्ट और यूज़र इंटरफ़ेस (यूआई) एलिमेंट होने चाहिए जो इन दिशा-निर्देशों में बताए गए हैं. इस स्क्रीन पर कोई अतिरिक्त टेक्स्ट या इमेज शामिल न करें. हालांकि, अन्य स्क्रीन पर अतिरिक्त टेक्स्ट और इमेज शामिल की जा सकती हैं.

1. शीर्षक
2. मैसेज
3. बटन
4. बॉटम शीट
5. बैकग्राउंड स्क्रिम

शीर्षक

मैसेज

पहला बटन

दूसरा बटन

बॉटम शीट

लैंडस्केप

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

बिलिंग सिस्टम चुनने की स्क्रीन

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

कब दिखाना है

अगर उपयोगकर्ता ने जानकारी वाली स्क्रीन पहले ही देख ली है, तो खरीदारी शुरू करने के लिए साफ़ तौर पर कार्रवाई करने के तुरंत बाद, बिलिंग का विकल्प चुनने वाली स्क्रीन दिखनी चाहिए.

डिसप्ले करने का तरीका

बिलिंग के विकल्प वाली स्क्रीन, बॉटम शीट वाले मोडल में दिखनी चाहिए. साथ ही, यह जानकारी वाली स्क्रीन की तरह ही होनी चाहिए.

विज़ुअल के तौर पर एक जैसा प्रतिनिधित्व

ऐप्लिकेशन में मौजूद अन्य बिलिंग सेवा और Google Play की बिलिंग सेवा के बटन, सही और एक जैसे तरीके से दिखाए जाने चाहिए. इसमें बटन के साइज़, टेक्स्ट का साइज़/स्टाइल, टैप टारगेट, और आइकॉन के साइज़ शामिल हैं. हालांकि, इनके अलावा और भी चीज़ें शामिल हो सकती हैं. कृपया इन दिशा-निर्देशों में बताए गए बदलावों के अलावा, कोई और बदलाव न करें. साथ ही, कोई अतिरिक्त टेक्स्ट या इमेज न जोड़ें.

उदाहरण: “अभी शामिल हों” बटन पर टैप करने से, बिलिंग के लिए विकल्प चुनने की स्क्रीन खुल जाती है.

डिज़ाइन की खास जानकारी

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

Google Play के लिए विज़ुअल ऐसेट और पेमेंट के आइकॉन, यहां दिए गए लिंक से ऐक्सेस किए जा सकते हैं.

उदाहरण: पोर्ट्रेट व्यू में, बॉटम शीट को स्क्रीन की पूरी चौड़ाई में दिखना चाहिए.

1. शीर्षक
2. ब्यौरा
3. डेवलपर बटन
4. Google Play बटन
5. बॉटम शीट
6. बैकग्राउंड स्क्रिम

शीर्षक

ब्यौरा

डेवलपर बटन

1. ऐप्लिकेशन आइकॉन
2. ऐप्लिकेशन का नाम
3. पेमेंट के तरीके के आइकॉन

पेमेंट के तरीके के आइकॉन

1. पेमेंट के तरीके के आइकॉन की ज़्यादा से ज़्यादा संख्या
2. आइकॉन के बजाय पेमेंट के तरीके के नाम

स्क्रीन की चौड़ाई के हिसाब से स्केल करें

3. 360 डीपी चौड़ाई
4. 480 डीपी चौड़ाई

बटन कंटेनर

ऐप्लिकेशन आइकॉन

शीर्षक

पेमेंट के तरीके

Google Play बटन

1. आइकॉन
2. शीर्षक
3. मंज़ूर की गई भुगतान विधियां
4. अन्य इंडिकेटर

बटन कंटेनर

ऐप्लिकेशन आइकॉन

शीर्षक

पेमेंट के तरीके

लैंडस्केप

उदाहरण: लैंडस्केप व्यू में, बॉटम शीट पोर्ट्रेट व्यू की तुलना में ज़्यादा चौड़ी होती है. हालांकि, यह डिज़ाइन से जुड़ी खास बातों और काम करने के तरीके के हिसाब से एक जैसी होती है.