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

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

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 ऐड-ऑन: "टीम की सूची"

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