कार्ड पर आधारित इंटरफ़ेस

ऐड-ऑन कार्ड का उदाहरण

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

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

कार्ड, कॉन्टेक्स्ट के हिसाब से नहीं या कॉन्टेक्स्ट के हिसाब से हो सकते हैं. कॉन्टेक्स्ट के हिसाब से कार्ड, उपयोगकर्ता को तब दिखाए जाते हैं, जब होस्ट ऐप्लिकेशन किसी खास कॉन्टेक्स्ट में होता है. उदाहरण के लिए, Gmail मैसेज या Calendar इवेंट खोलते समय. कॉन्टेक्स्ट के हिसाब से नहीं दिखाए जाने वाले कार्ड (जैसे कि होम पेज) को उपयोगकर्ता को होस्ट के किसी खास कॉन्टेक्स्ट से बाहर दिखाया जाता है. उदाहरण के लिए, जब उपयोगकर्ता Gmail इनबॉक्स, Drive का मुख्य फ़ोल्डर या Calendar देख रहा हो.

Apps Script में बनाए गए Google Workspace ऐड-ऑन, कार्ड से यूज़र इंटरफ़ेस बनाने के लिए, कार्ड सेवा का इस्तेमाल करते हैं. अन्य भाषाओं में बनाए गए ऐड-ऑन को, इंटरफ़ेस के लिए सही फ़ॉर्मैट वाला JSON फ़ाइल फ़ॉर्मैट देना होगा, ताकि इंटरफ़ेस को कार्ड के तौर पर रेंडर किया जा सके.

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

कार्ड पर आधारित इंटरफ़ेस के ये फ़ायदे हैं:

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

  • कार्ड पर आधारित इंटरफ़ेस, डेस्कटॉप और मोबाइल डिवाइसों, दोनों पर काम करते हैं. हालांकि, आपको इंटरफ़ेस को सिर्फ़ एक बार तय करना होगा.

कार्ड पर आधारित इंटरफ़ेस बनाना

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

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

  • Google Workspace ऐड-ऑन "Cats" के लिए क्विकस्टार्ट गाइड

    इस ऐड-ऑन के सैंपल में, Google Workspace ऐड-ऑन का आसान यूज़र इंटरफ़ेस (यूआई) दिखाया गया है. इसमें कई पेज और होम पेज हैं.

  • Google Workspace ऐड-ऑन: "Translate"

    इस ऐड-ऑन के सैंपल में, Google Workspace ऐड-ऑन दिखाया गया है. इसकी मदद से उपयोगकर्ता, Docs, Sheets, और Slides में मौजूद टेक्स्ट का अनुवाद कर सकते हैं.

  • Google Workspace ऐड-ऑन: "Teams List"

    इस ऐड-ऑन के सैंपल में, Google Workspace के ऐड-ऑन का ज़्यादा जटिल सैंपल दिखाया गया है. इसमें Gmail मैसेज पाने वालों, Drive फ़ाइल के एडिटर या Calendar इवेंट में शामिल होने वाले लोगों की जानकारी दिखाई गई है. इस ऐड-ऑन का इस्तेमाल सिर्फ़ किसी डोमेन में किया जा सकता है. ऐसा इसलिए, क्योंकि यह Directory API का इस्तेमाल करके, उपयोगकर्ता की जानकारी को वापस पाता है.