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

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

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

- शीर्षक
- मैसेज
- बटन
- बॉटम शीट
- बैकग्राउंड स्क्रिम
शीर्षक
| टेक्स्ट | आपके लिए उपलब्ध, चेकआउट के विकल्पों में किए गए बदलाव |
| फ़ॉन्ट | Roboto (सभी फ़ॉन्ट पर लागू करें) |
| फ़ॉन्ट का साइज़ | 18sp |
| फ़ॉन्ट का रंग | #202124 |
मैसेज
| टेक्स्ट 1 | दक्षिण कोरिया में हाल ही में हुए कानूनी बदलावों की वजह से, अब आपको चेकआउट के दौरान बिलिंग के और भी विकल्प मिलेंगे. आपके चुने गए विकल्प के आधार पर यह तय होगा कि:
|
| फ़ॉन्ट का साइज़ | 14sp |
| लाइन की ऊंचाई | 20 |
| फ़ॉन्ट का रंग | #5F6368 |
| टेक्स्ट 2 | Google, सिर्फ़ Google Play से की जाने वाली खरीदारी को ही सुरक्षित करता है. Google Play की सुविधाएं सिर्फ़ तब उपलब्ध होती हैं, जब आपने चेकआउट के समय Google Play का विकल्प चुना हो. इन सुविधाओं में Play के उपहार कार्ड, Play पॉइंट, खरीदारी के कंट्रोल, और सदस्यता को मैनेज करना शामिल है. |
| फ़ॉन्ट का साइज़ | 12sp |
| लाइन की ऊंचाई | 16 |
| फ़ॉन्ट का रंग | #5F6368 |
पहला बटन
| टेक्स्ट | ज़्यादा जानें |
| टेक्स्ट संरेखण | केंद्रित |
| फ़ॉन्ट का साइज़ | 14sp |
| फ़ॉन्ट की मोटाई | मध्यम |
| फ़ॉन्ट का रंग | #01875F |
| पृष्ठभूमि रंग | #FFFFFF |
| डाइमेंशन | ऊंचाई:36, चौड़ाई: कंटेनर के हिसाब से स्केल करें |
| कोने का रेडियस | 4dp |
| आउटलाइन | 1dp, #DADCE0 |
| लिंक | Google Play के सहायता लेख के लिंक |
दूसरा बटन
| टेक्स्ट | जारी रखें |
| टेक्स्ट संरेखण | केंद्रित |
| फ़ॉन्ट का साइज़ | 14sp |
| फ़ॉन्ट की मोटाई | मध्यम |
| फ़ॉन्ट का रंग | #FFFFFF |
| पृष्ठभूमि रंग | #01875F |
| डाइमेंशन | ऊंचाई:36, चौड़ाई: कंटेनर के हिसाब से स्केल करें |
| कोने का रेडियस | 4dp |
| लिंक | बिलिंग सिस्टम चुनने का विकल्प देने वाली स्क्रीन के लिंक |
बॉटम शीट
| डाइमेंशन | ऊंचाई: बदली जा सकती है, चौड़ाई: 100% |
| कोने का रेडियस | 8dp, 8dp, 0, 0 |
| बैकग्राउंड | #FFFFFF |
| इनर पैडिंग | बाएं:24dp, दाएं:24dp, ऊपर:32dp, नीचे: 24dp |
| ऊंचाई | 8dp |
लैंडस्केप
लैंडस्केप व्यू में, बॉटम शीट पोर्ट्रेट व्यू की तुलना में ज़्यादा चौड़ी होती है. हालांकि, यह डिज़ाइन से जुड़ी अन्य खास बातों और फ़ंक्शन के हिसाब से एक जैसी होती है.

| बॉटम शीट | चौड़ाई: ज़्यादा से ज़्यादा 500 डीपी, अंदरूनी पैडिंग: 24 डीपी |
| शीर्षक | पोर्ट्रेट व्यू की तरह ही |
| मैसेज | पोर्ट्रेट व्यू की तरह ही |
| बटन | ऊंचाई:36, चौड़ाई: कंटेनर के हिसाब से स्केल करें |
बिलिंग का विकल्प चुनने वाली स्क्रीन
बिलिंग सिस्टम चुनने वाली स्क्रीन पर, उपयोगकर्ताओं को खरीदारी पूरी करने के लिए चेकआउट के दो विकल्प मिलते हैं. उपयोगकर्ताओं को सोच-समझकर फ़ैसला लेने में मदद करने के लिए, हर बिलिंग सेवा के विकल्प में पेमेंट के उपलब्ध तरीके भी दिखाए जाते हैं. उपयोगकर्ताओं के पेमेंट का तरीका चुनने के बाद, वे उसी बिलिंग सेवा के ज़रिए खरीदारी पूरी कर पाएंगे.
कब दिखे
अगर उपयोगकर्ता ने जानकारी वाली स्क्रीन पहले ही देख ली है, तो खरीदारी शुरू करने के लिए उपयोगकर्ता के साफ़ तौर पर कार्रवाई करने के तुरंत बाद, बिलिंग का तरीका चुनने वाली स्क्रीन दिखनी चाहिए.
डिसप्ले करने का तरीका
बिलिंग के विकल्प वाली स्क्रीन, मोडल बॉटम शीट में दिखनी चाहिए. साथ ही, यह जानकारी वाली स्क्रीन की तरह ही होनी चाहिए.
विज़ुअल कॉन्टेंट को बराबर जगह देना
ऐप्लिकेशन में मौजूद अन्य बिलिंग सेवा और Google Play की बिलिंग सेवा के बटन, निष्पक्ष और एक जैसे तरीके से दिखाए जाने चाहिए. इसमें बटन का साइज़, टेक्स्ट का साइज़/स्टाइल, टैप टारगेट, और आइकॉन का साइज़ शामिल है. हालांकि, इनमें और भी चीज़ें शामिल हो सकती हैं. कृपया इन दिशा-निर्देशों में बताए गए बदलावों के अलावा, कोई और बदलाव न करें. जैसे, कोई अतिरिक्त टेक्स्ट या इमेज न जोड़ें.
उदाहरण: “अभी शामिल हों” बटन पर टैप करने से, बिलिंग का विकल्प चुनने वाली स्क्रीन खुल जाती है.

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

- शीर्षक
- ब्यौरा
- डेवलपर बटन
- Google Play बटन
- बॉटम शीट
- बैकग्राउंड स्क्रिम
शीर्षक
| टेक्स्ट | चुनें कि चेक आउट करने के लिए, आपको किस तरीके का इस्तेमाल करना है |
| फ़ॉन्ट | Roboto (सभी फ़ॉन्ट पर लागू करें) |
| फ़ॉन्ट का साइज़ | 18sp |
| फ़ॉन्ट का रंग | #202124 |
ब्यौरा
| टेक्स्ट | चुनें कि कौन आपके पेमेंट को सुरक्षित तरीके से प्रोसेस करने और खरीदारी से जुड़ी ग्राहक सेवा उपलब्ध कराने के लिए ज़िम्मेदार होगा. पेमेंट के उपलब्ध तरीके और खरीदारी पर मिलने वाले फ़ायदे अलग-अलग हो सकते हैं. |
| फ़ॉन्ट का साइज़ | 14sp |
| फ़ॉन्ट का रंग | #5F6368 |
| टेक्स्ट लिंक | ज़्यादा जानें |
| लिंक का डेस्टिनेशन | लिंक |
| फ़ॉन्ट का साइज़ | 14sp |
| सजावट | अंडरलाइन करें |
| फ़ॉन्ट का रंग | #5F6368 |
डेवलपर बटन

- ऐप्लिकेशन आइकॉन
- ऐप्लिकेशन का नाम
- पेमेंट के तरीके के आइकॉन

- पेमेंट के तरीके के आइकॉन की ज़्यादा से ज़्यादा संख्या
- आइकॉन के बजाय पेमेंट के तरीके के नाम
- 360 डीपी चौड़ाई
- 480 डीपी चौड़ाई
पेमेंट के तरीके के आइकॉन
स्क्रीन की चौड़ाई के हिसाब से स्केल करें
बटन कंटेनर
| आउटलाइन | 1pt, #DADCE0 |
| कोने का रेडियस | 4dp |
| इनर पैडिंग | 16dp, 16dp, 16dp, 16dp, |
ऐप्लिकेशन आइकॉन
| डाइमेंशन | ऊंचाई: 24 डीपी, चौड़ाई: बदली जा सकती है |
शीर्षक
| टेक्स्ट | {App Name} |
| फ़ॉन्ट का साइज़ | 14sp |
| फ़ॉन्ट का रंग | #202124 |
पेमेंट के तरीके
| डाइमेंशन | 32dp X 20dp |
| कोने का रेडियस | 2 |
| संख्या | ज़्यादा से ज़्यादा पांच, अगर पांच से ज़्यादा उपलब्ध हैं, तो अतिरिक्त इंडिकेटर दिखाएं |
| अतिरिक्त इंडिकेटर | + ज़्यादा (छोटी स्क्रीन पर यह टेक्स्ट अगली लाइन में चला जाता है) |
| फ़ॉन्ट का साइज़ | 12sp |
| फ़ॉन्ट का रंग | #5F6368 |
Google Play बटन

- आइकन
- शीर्षक
- इन तरीकों से भुगतान किया जा सकता है
- अतिरिक्त इंडिकेटर
बटन कंटेनर
| आउटलाइन | 1pt, #DADCE0 |
| कोने का रेडियस | 4dp |
| इनर पैडिंग | 16dp, 16dp, 16dp, 16dp, |
ऐप्लिकेशन आइकॉन
| इमेज ऐसेट | Google Play prism |
| डाइमेंशन | 24dp X 24dp |
शीर्षक
| टेक्स्ट | Google Play |
| फ़ॉन्ट का साइज़ | 14sp |
| फ़ॉन्ट का रंग | #202124 |
पेमेंट के तरीके
| इमेज ऐसेट | लिंक |
| अतिरिक्त इंडिकेटर | और अन्य |
| फ़ॉन्ट का साइज़ | 12sp |
| फ़ॉन्ट का रंग | #5F6368 |
लैंडस्केप
उदाहरण: लैंडस्केप व्यू में, बॉटम शीट पोर्ट्रेट व्यू की तुलना में ज़्यादा चौड़ी होती है. हालांकि, यह डिज़ाइन से जुड़ी खास बातों और सुविधाओं के हिसाब से ही काम करती है.

| बॉटम शीट | चौड़ाई: ज़्यादा से ज़्यादा 500 डीपी, अंदरूनी पैडिंग: 24 डीपी |
| शीर्षक | पोर्ट्रेट व्यू की तरह ही |
| मैसेज | पोर्ट्रेट व्यू की तरह ही |
| बटन | पोर्ट्रेट व्यू की तरह ही |