Google Workspace ऐड-ऑन के लिए यूज़र इंटरफ़ेस (यूआई) स्टाइल गाइड

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

अगर आपका ऐड-ऑन अलग-अलग वेब पेज खोलता है, जो ऐड-ऑन के काम करने का एक अहम हिस्सा हैं (जैसे, ऐड-ऑन का सेटिंग पेज), तो पक्का करें कि वे वेब पेज भी इन स्टाइल दिशा-निर्देशों का पालन करते हों.

टेक्स्ट और इमेज

इस सेक्शन में, अपने ऐड-ऑन में टेक्स्ट और इमेज का सही तरीके से इस्तेमाल करने का तरीका बताया गया है.

ऐड-ऑन का नाम

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

  • टाइटल केस का इस्तेमाल करें.
  • विराम चिह्नों का इस्तेमाल न करें. खास तौर पर, ब्रैकेट का इस्तेमाल न करें. ऐसा तब ही करें, जब आपके ब्रैंड के नाम में शामिल सभी अक्षर बड़े हों.
  • इसे छोटा रखें—15 या इससे कम वर्ण सबसे सही हैं. Google Workspace Marketplace की लिस्टिंग और अन्य जगहों पर, लंबे नाम अपने-आप छोटा हो सकते हैं.
  • अपने ऐड-ऑन के नाम में "Google", "Gmail" या Google के अन्य प्रॉडक्ट के नाम शामिल न करें.
  • ऐड-ऑन के नाम में "ऐड-ऑन" शब्द शामिल न करें.
  • वर्शन की जानकारी न दें.

लिखने का तरीका

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

यूज़र इंटरफ़ेस (यूआई) पर दिखने वाला टेक्स्ट लिखते समय:

  • वाक्य के केस का इस्तेमाल करें. खास तौर पर, बटन, लेबल, और कार्ड ऐक्शन के लिए.
  • छोटे और आसान टेक्स्ट का इस्तेमाल करें. इसमें किसी खास भाषा या संक्षिप्त शब्दों का इस्तेमाल न करें.

यूनिवर्सल और कार्ड ऐक्शन

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

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

गड़बड़ी के मैसेज

जब कोई गड़बड़ी होती है, तो साफ़ भाषा का इस्तेमाल करना ज़रूरी होता है. उपयोगकर्ता के नज़रिए से समस्या के बारे में बताएं और उसे ठीक करने का सुझाव दें.

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

सहायता कॉन्टेंट

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

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

इमेज

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

कंट्रोल

इस सेक्शन में, इंटरैक्टिव विजेट के लिए, उपयोगकर्ता अनुभव से जुड़े दिशा-निर्देश दिए गए हैं.

बटन

अन्य विजेट के बजाय, अपने यूज़र इंटरफ़ेस की मुख्य कार्रवाइयों को कंट्रोल करने के लिए बटन का इस्तेमाल करें.

  • ज़्यादातर टेक्स्ट बटन लेबल, किसी क्रिया से शुरू होने चाहिए.
  • ज़्यादातर मामलों में, बटन की पंक्तियों में तीन या उससे कम बटन होने चाहिए.

DecoratedText

DecoratedText विजेट की मदद से, आइकॉन, बटन या स्विच के साथ टेक्स्ट कॉन्टेंट दिखाया जा सकता है.

  • टेक्स्ट कॉन्टेंट के लिए, अंग्रेज़ी के वाक्यों में पहला वर्ण बड़ा (अपर केस में) रखें.
  • अगर DecoratedText विजेट का टेक्स्ट, उपलब्ध जगह में फ़िट नहीं होता है, तो उसे छोटा कर दिया जाता है. इसलिए, टेक्स्ट कॉन्टेंट को जितना हो सके उतना छोटा रखें.

चुनने के लिए इनपुट

अपने ऐड-ऑन में, कई तरह के चुने गए इनपुट विजेट का इस्तेमाल किया जा सकता है: ड्रॉप-डाउन चुनने के लिए बॉक्स, चेकबॉक्स, और रेडियो बटन.

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

टेक्स्ट इनपुट

टेक्स्ट इनपुट की मदद से, उपयोगकर्ता स्ट्रिंग डेटा डाल सकते हैं.

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

ब्रैंडिंग

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

आपके ऐड-ऑन में

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

  • आपके ऐड-ऑन के सभी हिस्सों को ब्रैंडिंग के दिशा-निर्देशों के मुताबिक होना चाहिए.
  • “Google”, "Gmail" या Google के अन्य प्रॉडक्ट के नाम शामिल न करें.
  • Google के प्रॉडक्ट के आइकॉन शामिल न करें, भले ही उनमें बदलाव किया गया हो.
  • ब्रैंडिंग टेक्स्ट में "ऐड-ऑन" शब्द शामिल न करें.
  • ब्रैंडिंग टेक्स्ट में कुछ ही शब्द होने चाहिए.

Google Workspace Marketplace में

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

आपके स्टोर पेज और इन ऐसेट के सभी हिस्सों को ब्रैंडिंग के दिशा-निर्देशों के मुताबिक होना चाहिए.