ब्रैंडिंग के दिशा-निर्देश

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

दस्तावेज़ के इस सेक्शन को इमेज और अन्य यूज़र इंटरफ़ेस एलिमेंट बनाने में आपकी मदद करने के लिए डिज़ाइन किया गया है, ताकि वे Google Wallet ऐप्लिकेशन में अच्छे से दिखें.

एसेट

Google Wallet में बटन जोड़ें

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

Google Wallet में जोड़ें बटन, Android के एक्सएमएल, SVG, और PNG फ़ॉर्मैट में उपलब्ध होते हैं.

एसेट डाउनलोड करें - Android एक्सएमएल एसेट डाउनलोड करना - SVG एसेट डाउनलोड करना - PNG

Google Wallet में देखें बटन

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

Google Wallet में देखें बटन, SVG और PNG फ़ॉर्मैट में उपलब्ध होते हैं.

एसेट डाउनलोड करें - SVG एसेट डाउनलोड करें - PNG

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

• पेज के अन्य मिलते-जुलते बटन या एलिमेंट के मुताबिक साइज़
• बटन के आकार और रंग में बदलाव नहीं किया जाना चाहिए
• खाली जगह

स्थानीय जगह के अनुसार बटन

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

स्थानीय भाषा में लिखा गया नाम

उपयोगकर्ता को बेहतर तरीके से समझाने के लिए, Google Wallet के प्रॉडक्ट के नाम को कुछ देशों के हिसाब से स्थानीय भाषा में लिखा गया है. अगर आप इन देशों के उपयोगकर्ताओं के लिए डेवलप कर रहे हैं, तो वेब, ईमेल, और प्रिंट के लिए, हमेशा स्थानीय भाषा में लिखे गए नाम का इस्तेमाल करें. “Google Wallet” का स्थानीय भाषा में अनुवाद न करें. अगर आपका बाज़ार नीचे दी गई सूची में शामिल नहीं है, तो अंग्रेज़ी में “Google Wallet” इस्तेमाल करें.

देश	नाम
बेलारूस	Google कोसीलेक
ब्राज़ील	Google का कार्टिरा
चिली	Billetera de Google
चेकिया	पेनेज़ेंका Google
ग्रीस	पेरू
हॉन्ग कॉन्ग	Google 錢包
लिथुआनिया	Google पिनिजिन
पोलैंड	पोर्टफ़ेल Google
पुर्तगाल	कार्टेरा डा Google
रोमानिया	पोर्टोफ़ेल Google
स्लोवाकिया	पेन्नाज़ेंका Google
ताइवान	Google 錢包
तुर्किये	Google कज़न
संयुक्त अरब अमीरात	محفظة Google
यूक्रेन	Google सैंडबॉक्स
अमेरिका (स्पैनिश) *अगर आपका यूज़र इंटरफ़ेस (यूआई) स्पैनिश में है, तो अमेरिका में इस नाम का इस्तेमाल करें	Billetera de Google

साइज़

अपने लेआउट में फ़िट करने के लिए, Google Wallet में जोड़ें बटन की ऊंचाई और चौड़ाई में बदलाव करें. अगर पेज पर अन्य बटन हैं, तो Google Wallet में जोड़ें बटन का साइज़, उसके बराबर या उससे बड़ा होना चाहिए. Google Wallet में जोड़ें बटन को दूसरे बटन से छोटा ना करें.

स्टाइल

Google Wallet में जोड़ें बटन दो वैरिएंट में उपलब्ध होते हैं: प्राइमरी और कंडेंस्ड. Google Wallet में जोड़ें बटन सिर्फ़ काले रंग में दिखता है. बटन के स्थानीय भाषा वाले वर्शन दिए गए हैं. स्थानीय भाषा में लिखे अपने टेक्स्ट के साथ बटन न बनाएं.

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

खाली जगह

Google Wallet में जोड़ें बटन के चारों ओर, 8 dp के आस-पास खाली जगह बनाए रखें. पक्का करें कि खाली जगह को कभी भी ग्राफ़िक या टेक्स्ट से तोड़ा न जाए.

कम से कम ऊंचाई

सभी Google Wallet में जोड़ें बटन की ऊंचाई कम से कम 48 dp होनी चाहिए.

क्या करें और क्या न करें

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

बटन रखने के सबसे सही तरीके

पुष्टि करने वाले ऐप्लिकेशन की स्क्रीन, वेब पेजों या ईमेल पर Google Wallet में जोड़ें बटन दिखाएं. अपने यूज़र इंटरफ़ेस (यूआई) के डिज़ाइन को गाइड करने के लिए, यहां दिए गए सबसे सही तरीके देखें.

लॉयल्टी, उपहार कार्ड, ऑफ़र

पुष्टि स्क्रीन पर Google Wallet में जोड़ें बटन दिखाएं. इस बटन को वेबसाइट या ऐप्लिकेशन पर भी दिखाया जा सकता है या इसे काम के ईमेल में शामिल किया जा सकता है.

   

लेख में Google वॉलेट प्रॉडक्ट नाम का उपयोग

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

"G" और "W" अक्षरों को बड़े अक्षरों में लिखें

Google Wallet को रेफ़र करने के लिए, हमेशा बड़े अक्षर "G" और बड़े अक्षरों का इस्तेमाल करें "W". "Google Wallet" का पूरा नाम इस्तेमाल न करें, जब तक कि वह आपके यूज़र इंटरफ़ेस (यूआई) के टाइपोग्राफ़िक स्टाइल से मेल न खाए.

Google Wallet का नाम छोटा न करें

हमेशा "Google" और "Wallet" शब्द लिखें.

अपने यूज़र इंटरफ़ेस (यूआई) की स्टाइल का मिलान करें

"Google Wallet" को उसी फ़ॉन्ट और टाइपोग्राफ़िक स्टाइल में सेट करें जिससे आपके यूज़र इंटरफ़ेस (यूआई) में, बाकी टेक्स्ट को सेट किया जाता है. Google के टाइपोग्राफ़िक स्टाइल की नकल न करें.

हमेशा "Google Wallet" के स्थानीय भाषा में दिए गए वर्शन का इस्तेमाल करें

दी गई स्थानीय कॉपी में हमेशा "Google Wallet" लिखें.

डिज़ाइन

Google Wallet में जोड़ें बटन की ऊंचाई और चौड़ाई में बदलाव करने के लिए, g:savetoandroidpay एचटीएमएल टैग के height और size फ़ील्ड का इस्तेमाल करें. मोबाइल पर इस्तेमाल करने के लिए, टेक्स्ट और बटन के साइज़ को नाटकीय तौर पर बढ़ाने या यूज़र इंटरफ़ेस (यूआई) से जुड़ी खास शर्तों को पूरा करने के लिए, textsize=large के बारे में जानकारी का इस्तेमाल करें.

बटनों का रंग सेट करने के लिए theme का उपयोग करें. नीचे दी गई टेबल से पता चलता है कि ये सेटिंग Google Wallet में जोड़ें बटन पर कैसे असर डालती हैं.

लोगो

Google Wallet आपके लोगो को गोल आकार में मास्क करता है.

लोगो की इमेज से जुड़े दिशा-निर्देश

लोगो इमेज के लिए यूज़र इंटरफ़ेस के सुझावों की सूची यहां दी गई है:

दिशा-निर्देश	ब्यौरा
पसंदीदा फ़ाइल प्रकार	PNG
फ़ाइल का कम से कम साइज़	660 पिक्सल 660 पिक्सल
इमेज का आसपेक्ट रेशियो (लंबाई-चौड़ाई का अनुपात)	1:1
आर्टवर्क का आसपेक्ट रेशियो	1:1
असल पिक्सल साइज़	डिवाइस के आकार पर स्केल करें
लोगो का गोल मास्क	लोगो को गोल डिज़ाइन में फ़िट करने के लिए मास्क किया जाता है. पक्का करें कि आपका लोगो सुरक्षित जगह पर फ़िट होता हो. अपने लोगो को पहले से मास्क न करें. लोगो को बैकग्राउंड में पूरे ब्लीड रंग वाले स्क्वेयर में छोड़ें. लोगो का मार्जिन 15% होना चाहिए, ताकि मास्क करते समय वह कट न जाए.

कार्ड के बैकग्राउंड का रंग

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

हीरो इमेज

class.heroImage फ़ील्ड, कार्ड के मुख्य हिस्से में पूरी चौड़ाई वाले बैनर के तौर पर दिखता है.

हीरो इमेज से जुड़े दिशा-निर्देश

हीरो इमेज के लिए यूज़र इंटरफ़ेस से जुड़े सुझावों की सूची यहां दी गई है:

दिशा-निर्देश	ब्यौरा
पसंदीदा फ़ाइल प्रकार	PNG
सुझाया गया साइज़	1032x336 पिक्सल चौड़ी, आयताकार इमेज का इस्तेमाल करें. सबसे अच्छे नतीजे पाने के लिए, ऐसी इमेज का इस्तेमाल करें जिसमें रंगीन बैकग्राउंड हो.
आसपेक्ट रेशियो (लंबाई-चौड़ाई का अनुपात)	3:1 या इससे ज़्यादा
डिसप्ले साइज़	कार्ड की पूरी चौड़ाई और अनुपात के हिसाब से ऊंचाई.

पूरी चौड़ाई वाली इमेज

किसी क्लास या ऑब्जेक्ट का *.imageModulesData.mainImage फ़ील्ड, पास के लिए पूरी चौड़ाई वाली इमेज के तौर पर दिखता है.

पूरी चौड़ाई वाली इमेज के लिए दिशा-निर्देश

नीचे पूरी चौड़ाई वाली इमेज के लिए यूज़र इंटरफ़ेस के सुझावों की सूची दी गई है:

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

बारकोड इमेज

कुछ वर्टिकल में, बारकोड के ऊपर और नीचे की इमेज शामिल होती हैं.

बारकोड के ऊपर इमेज

नीचे, बारकोड के ऊपर मौजूद इमेज के लिए यूज़र इंटरफ़ेस के सुझावों की सूची दी गई है:

दिशा-निर्देश	जानकारी
पसंदीदा फ़ाइल प्रकार	PNG
ज़्यादा से ज़्यादा ऊंचाई	20 dp (ज़्यादा से ज़्यादा आसपेक्ट रेशियो या चौड़ाई-ऊंचाई का अनुपात) दो इमेज मौजूद होने पर, 80 पिक्सल की लंबाई और 80-780 पिक्सल चौड़ी होने का सुझाव दिया जाता है. इससे वे साथ-साथ चलते हैं. अगर एक इमेज वर्ग है और दूसरी आयताकार है, तो इमेज 80x80 पिक्सल और 780x80 पिक्सल की होनी चाहिए.
आसपेक्ट रेशियो (लंबाई-चौड़ाई का अनुपात)	बिना किसी रुकावट के. एक इमेज की ज़्यादा से ज़्यादा 20 dp ऊंचाई और चौड़ाई के लिए, 20:1 आसपेक्ट रेशियो (लंबाई-चौड़ाई का अनुपात) का इस्तेमाल करें. अगर आपको बारकोड के ऊपर सिर्फ़ एक इमेज चाहिए, तो पूरी चौड़ाई के हिसाब से पैडिंग (जगह) को बाहर रखें. इमेज का आकार 1600x80 पिक्सल होना चाहिए.
ज़्यादा से ज़्यादा डिसप्ले साइज़ (एक इमेज)	20 dp ज़्यादा और 400 dp चौड़ा

बारकोड के नीचे इमेज

बारकोड के नीचे दी गई इमेज के लिए, यूज़र इंटरफ़ेस पर दिखने वाले सुझावों की सूची यहां दी गई है:

दिशा-निर्देश	जानकारी
पसंदीदा फ़ाइल प्रकार	PNG
ज़्यादा से ज़्यादा ऊंचाई	20 dp (ज़्यादा से ज़्यादा आसपेक्ट रेशियो या चौड़ाई-ऊंचाई का अनुपात) हमारा सुझाव है कि यह लंबाई 80 पिक्सल और 80-1600 पिक्सल चौड़ी हो. अगर स्क्वेयर हो, तो 80x80 px. अगर आयताकार है, तो 1600x80 पिक्सल.
ग़ैर-ज़रूरी आसपेक्ट रेशियो (लंबाई-चौड़ाई का अनुपात) ज़्यादा से ज़्यादा 20 dp ऊंचाई और चौड़ाई के लिए, 20:1 आसपेक्ट रेशियो (लंबाई-चौड़ाई का अनुपात) का इस्तेमाल करें.	अगर आपको पूरी चौड़ाई की इमेज (पैडिंग से बाहर रखें) चाहिए, तो इमेज 1600x80 पिक्सल की होनी चाहिए.
डिसप्ले ज़्यादा से ज़्यादा 20 dp और 400 dp चौड़ा हो.

मॉड्यूल

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

दिशा-निर्देश	ब्यौरा
imageModulesData	अपनी कक्षा में या बनाए गए ऑब्जेक्ट में, सिर्फ़ एक imageModulesData का इस्तेमाल करें.
infoModuleData	अपनी कक्षा में या बनाए गए ऑब्जेक्ट में ज़्यादा से ज़्यादा दो infoModuleData का इस्तेमाल करें. infoModuleData उपयोगकर्ता खाते की खास जानकारी तय कर सकता है, जैसे कि "सदस्य का नाम" और "सदस्यता #".
linksModuleData	अपनी कक्षा में या अपने बनाए हुए ऑब्जेक्ट में, ज़्यादा से ज़्यादा चार linksModuleData यूआरआई का इस्तेमाल करें. आपकी कक्षा में दो linksModuleData यूआरआई हो सकते हैं; एक आपकी वेबसाइट के यूआरआई और एक आपके सहायता केंद्र का फ़ोन नंबर. आपके ऑब्जेक्ट में मौजूद दो linksModuleData यूआरआई, उपयोगकर्ता के खाते से जुड़ा यूआरआई और आस-पास की जगहें तय कर सकते हैं.
textModulesData	बनाई गई क्लास और ऑब्जेक्ट के बीच ज़्यादा से ज़्यादा दो textModulesData फ़ील्ड का इस्तेमाल करें. आपकी क्लास में एक textModuleData यूआरआई हो सकता है जो प्रोग्राम की जानकारी तय करता है. वहीं, दूसरा textModulesData उस ऑब्जेक्ट में हो सकता है जो उपयोगकर्ता के खाते से जुड़ी जानकारी देता है.

infoModuleData

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

linksModuleData

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

दिशा-निर्देश	सेटिंग का उदाहरण	इमेज का उदाहरण
Google वेबसाइट में किसी वेबसाइट या जगह को यूआरआई असाइन करते समय http: प्रीफ़िक्स का इस्तेमाल करें. इस प्रीफ़िक्स से कोई व्यक्ति लिंक पर जाकर वेबसाइट पर नेविगेट कर सकता है या Google Maps पर जगह की जानकारी देख सकता है. इस प्रीफ़िक्स से आपके कार्ड में दी गई जानकारी के सामने, लिंक या मैप का आइकॉन भी दिखता है.	'uri': 'http://maps.google.com/?q=google'
	'uri': 'http://developer.google.com/wallet/'
फ़ोन नंबर तय करते समय, tel: प्रीफ़िक्स का इस्तेमाल करें. इस प्रीफ़िक्स की मदद से, ग्राहक लिंक पर डायल करके नंबर डायल कर सकता है. इस प्रीफ़िक्स में, कार्ड पर मौजूद टेक्स्ट की जानकारी के सामने एक टेलीफ़ोन का आइकॉन भी दिखता है.	'uri': 'tel:6505555555'
ईमेल पता तय करते समय, mailto: प्रीफ़िक्स का इस्तेमाल करें. इस प्रीफ़िक्स से उपभोक्ता, लिंक पर जाकर ईमेल पता भेज सकते हैं. इस प्रीफ़िक्स में, कार्ड पर मौजूद टेक्स्ट की जानकारी के सामने किसी ईमेल का आइकॉन भी बनाया जाता है.	'uri': 'mailto:jonsmith@email.com'

शीर्षक, लेबल, और नाम

टाइटल केस में शीर्षक, लेबल, और नाम लिखें, ताकि हर शब्द का पहला अक्षर कैपिटल लेटर से हो.

कॉन्टेंट की नीतियां

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

पार्टनर प्लैटफ़ॉर्म का डेटा प्लेसमेंट

यह पक्का करने के लिए कि उपयोगकर्ता सुविधा से जुड़े आपके ऐप्लिकेशन या वेबसाइट पर पास के बारे में जान पाएं, पक्का करें कि ऐप्लिकेशन की डीप लिंक या वेबसाइट को पास की क्लास या ऑब्जेक्ट linksModuleData.* प्रॉपर्टी में शामिल किया जाए. इससे उपयोगकर्ता, Google Wallet में दिखने वाले पास से आपके प्लैटफ़ॉर्म पर जा सकता है. यह कैसे दिखता है, यह देखने के लिए पास वर्टिकल के डिज़ाइन सेक्शन पर जाएं.