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

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

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

ऐसेट

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

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

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

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

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

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

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

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

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

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

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

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

Google Wallet में जोड़ें बटन, अल्बेनियन, ऐरेबिक, आर्मेनियन, अज़रबैजान, बोस्नियन, बुल्गारियन, कैटलान, चाइनीज़, (हॉन्ग कॉन्ग), चाइनीज़ (ट्रेडिशनल), क्रोएशियन, चेक, डेनिश, डच, इंग्लिश (भारत, सिंगापुर, दक्षिण अफ़्रीका, ऑस्ट्रेलिया, कनाडा, ग्रेट ब्रिटेन, अमेरिका, टर्किश, फ़िलिपीनो), स्पेनिश, फ़िलिपीनो, हंगेरियन

स्थानीय भाषा में नाम

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

देश नाम
बेलारूस Google Кошелек
ब्राज़ील कार्टेरा डो Google
चिली बिलटेरा डे Google
चेकिया पेनेज़ेंका Google
ग्रीस Google
हॉन्ग कॉन्ग Google 錢包
लिथुआनिया Google पिनिगीन
पोलैंड पोर्टफ़ेल Google
पुर्तगाल कार्टेरा डा Google
रोमानिया पोर्टोफ़ेल Google
स्लोवाकिया पेंचेंका Google
ताइवान Google 錢包
तुर्किये Google Cüzdan
संयुक्त अरब अमीरात Google
यूक्रेन Google {1/}
अमेरिका (स्पैनिश)
*अगर आपका यूज़र इंटरफ़ेस (यूआई) स्पैनिश में है, तो अमेरिका में इस नाम का इस्तेमाल करें 		बिलटेरा डे Google

साइज़

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

स्टाइल

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

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

खाली जगह

Google Wallet में जोड़ें बटन के दोनों तरफ़ हमेशा कम से कम 8 dp की जगह खाली रखें. यह पक्का करें कि खाली जगह को कभी भी ग्राफ़िक या टेक्स्ट से मिटाया न गया हो.

Google Wallet के बटन के दोनों तरफ़ 8 dp की जगह होनी चाहिए.

कम से कम ऊंचाई

सभी Google Wallet में जोड़ें बटन की ऊंचाई कम से कम 48 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 में जोड़ें बटन पर क्या असर पड़ता है.

हीरो इमेज

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 px.

आसपेक्ट रेशियो (लंबाई-चौड़ाई का अनुपात) की सीमा नहीं है. ज़्यादा से ज़्यादा 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 Maps में किसी वेबसाइट या जगह को यूआरआई असाइन करते समय, 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 में दिखने वाले Pass से आपके प्लैटफ़ॉर्म पर नेविगेट कर सकते हैं. इसे कैसे रेंडर किया जाता है, यह देखने के लिए पास वर्टिकल के डिज़ाइन सेक्शन पर जाएं.