वही प्रॉम्प्ट, वही डायग्राम

प्रतीक राय ने tldraw-canvas-kit रिलीज़ किया है, जो 19 "Agent Skills" का एक संग्रह है। यह Claude Code या Cursor जैसे स्थानीय AI असिस्टेंट को ऑफलाइन tldraw डेस्कटॉप ऐप चलाने और हर बार बिल्कुल एक जैसे इंजीनियरिंग डायग्राम बनाने की सुविधा देता है। यह किट बिना किसी क्लाउड कनेक्शन या टेलीमेट्री के काम करती है, जिसका अर्थ है कि टीमें अपने विजुअल एसेट्स को पूरी तरह से ऑन-प्रिमाइसेस रख सकती हैं।

एक स्थानीय, नियतात्मक (deterministic) डायग्राम टूल क्यों महत्वपूर्ण है

इंजीनियरिंग टीमें स्लाइड डेक, डॉक्यूमेंटेशन साइटों और डिज़ाइन टूल्स के बीच फ्लोचार्ट, क्लास डायग्राम और आर्किटेक्चर मैप्स को इधर-उधर करने में घंटों बिताती हैं। कॉपी-पेस्ट का हर चरण सूक्ष्म बदलाव लाता है—लाइन स्टाइल बदल जाते हैं, IDs फिर से जेनरेट हो जाते हैं, और लेआउट बिगड़ जाता है। जब किसी LLM द्वारा डायग्राम को फिर से जेनरेट किया जाता है, तो परिणाम अक्सर अलग होता है, भले ही टेक्स्टुअल प्रॉम्प्ट वही रहे। उन संगठनों के लिए जिन्हें ऑडिट-रेडी डॉक्यूमेंटेशन या पुनरुत्पादनीय (reproducible) डिज़ाइन आर्टिफैक्ट्स की आवश्यकता होती है, यह परिवर्तनशीलता एक जोखिम है।

प्रतीक ने दो मुख्य समस्याओं को हल करने के लिए tldraw-canvas-kit बनाया है: (1) एक ऐसा टूल जो पूरी तरह से उपयोगकर्ता के मशीन पर चलता है, और (2) यह गारंटी कि एक ही प्रॉम्प्ट से एक ही डायग्राम बनेगा। एक स्थानीय HTTP API प्रदान करके जिसे AI एजेंट कॉल कर सकता है, यह किट नेटवर्क लेटेंसी, डेटा-एक्सफ़िल्ट्रेशन (data-exfiltration) जोखिम और SaaS सब्सक्रिप्शन की आवश्यकता को समाप्त कर देती है।

यह किट कैसे काम करती है

  • Offline core – tldraw डेस्कटॉप ऐप एक स्थानीय सर्वर चलाता है जो JSON-encoded कमांड स्वीकार करता है। कोई बाहरी कॉल नहीं की जाती है, और कोई भी उपयोग डेटा मशीन से बाहर नहीं जाता है।
  • Agent Skills – प्रत्येक स्किल एक निश्चित संरचना विनिर्देश (structure specification) को एनकोड करती है: लेआउट मैथ, स्टेंसिल विकल्प और स्थिर IDs। जब कोई एजेंट किसी स्किल को कॉल करता है, तो उसे ड्राइंग निर्देशों का एक नियतात्मक (deterministic) सेट प्राप्त होता है।
  • Idempotent updates – यदि कोई स्किल किसी मौजूदा डायग्राम पर चलती है, तो यह आकृतियों (shapes) को उसी स्थान पर अपडेट करती है, अप्रचलित तत्वों को हटाती है और किनारों (edges) को फिर से एंकर करती है। परिणाम एक ऐसा कैनवास होता है जिसे डुप्लिकेट ऑब्जेक्ट्स जमा किए बिना रिफ्रेश किया जा सकता है।
  • File format – डायग्राम को साधारण .tldraw फाइलों के रूप में संग्रहीत किया जाता है। चूंकि लेआउट लॉजिक फाइल के अंदर ही होता है, इसलिए एक डेक साझा करने में स्वचालित रूप से वे नेविगेशन नियम शामिल होते हैं जो व्यू को फिर से बनाने के लिए आवश्यक होते हैं।

यह किट तेरह डायग्राम श्रेणियों का समर्थन करती है, जिसमें सीक्वेंस और फ्लोचार्ट से लेकर ER डायग्राम, स्टेट मशीन, स्विमलेन, यूज़-केस, कंपोनेंट, पैकेज, डिप्लॉयमेंट, आर्किटेक्चर, माइंड मैप और कोड-बेस मैप शामिल हैं। उपयोगकर्ता बस वांछित डायग्राम का वर्णन करते हैं; स्किल अंतर्निहित संरचना को संभाल लेती है।

विकास के दौरान सीखे गए सबक

  1. एरो स्टाइलिंग डिफ़ॉल्ट रूप से हाथ से बने (hand-drawn) लुक में होती है – भले ही एक साफ लाइन का अनुरोध किया जाए, API शुरू में एक स्केच-शैली का एरो बनाता है। स्टाइल बदलने के लिए स्किल को एक फॉलो-अप कमांड जारी करनी पड़ती है।
  2. एरो चुपचाप आकृतियों को काट सकते हैं – यदि कोई कनेक्टर किसी नोड से होकर गुजरता है, तो API कोई एरर नहीं देता है। ऐसे टकरावों को पकड़ने के लिए जेनरेट किए गए स्क्रीनशॉट का विजुअल निरीक्षण आवश्यक है।
  3. छोटे एरो पर एज-लेबल रैपिंग टूट जाती है – यदि कनेक्टर बहुत छोटा है, तो लेबल खराब तरीके से रैप हो सकते हैं, इसलिए स्किल को न्यूनतम लंबाई लागू करनी चाहिए या लेबल प्लेसमेंट को एडजस्ट करना चाहिए।

ये खामियां दर्शाती हैं कि स्किल्स को API के बारे में धारणाओं के बजाय उसके वास्तविक व्यवहार पर क्यों बनाया गया था।

किट को इंस्टॉल करना और उपयोग करना

npx skills add prateek11rai/tldraw-canvas-kit

यह कमांड macOS और Linux पर काम करती है। इंस्टॉलेशन के बाद, उसी वर्कस्टेशन पर एक AI एजेंट स्थानीय दस्तावेज़ों को क्वेरी कर सकता है, कोड जेनरेट कर सकता है और चल रहे tldraw सर्वर को ड्राइंग कमांड भेज सकता है। परिणाम एक पुनरुत्पादनीय डायग्राम होता है जिसे होस्ट को छोड़े बिना आगे संपादित किया जा सकता है या प्रेजेंटेशन में एक्सपोर्ट किया जा सकता है।

किसे लाभ होता है, और इसके ट्रेड-ऑफ क्या हैं

  • सुरक्षा-केंद्रित टीमें – सख्त डेटा-हैंडलिंग नीतियों वाली कंपनियां अपने सभी डिज़ाइन आर्टिफैक्ट्स को अपने फायरवॉल के पीछे रख सकती हैं।
  • डॉक्यूमेंटेशन इंजीनियर – जिन्हें वर्जन-कंट्रोल किए गए रिपॉजिटरी में डायग्राम एम्बेड करने की आवश्यकता होती है, उन्हें सत्य का एक नियतात्मक स्रोत (deterministic source of truth) मिलता है।
  • व्यक्तिगत योगदानकर्ता – प्रत्येक LLM रन के बाद मैन्युअल रूप से लेआउट को ठीक करने से थक चुके डेवलपर्स इस प्रक्रिया को ऑटोमेट कर सकते हैं।

मुख्य सीमा स्थानीय रूप से चल रहे tldraw इंस्टेंस पर निर्भरता है। जो संगठन पहले से ही क्लाउड-आधारित डायग्राम सेवाओं पर निर्भर हैं, उन्हें डेस्कटॉप ऐप को अपनाना होगा और वर्कफ़्लो को समायोजित करना होगा। इसके अतिरिक्त, वर्तमान स्किल सेट कस्टम स्टेंसिल लाइब्रेरी को कवर नहीं करता है; उपयोगकर्ताओं को पूर्व-निर्धारित आकृतियों (predefined shapes) के भीतर ही काम करना होगा।

आगे क्या

प्रतीक कम्युनिटी फीडबैक के आधार पर स्किल लाइब्रेरी का विस्तार करने और विंडोज (Windows) के लिए सपोर्ट जोड़ने की योजना बना रहे हैं, जिससे संभावित उपयोगकर्ता आधार का विस्तार होगा। उन्हें यह भी उम्मीद है कि थर्ड-पार्टी एजेंट इस किट को इंटीग्रेट करेंगे, जिससे स्पेशलाइज्ड डायग्राम जनरेटर्स का एक मार्केटप्लेस तैयार होगा जो सभी एक ही डिटरमिनिस्टिक कोर साझा करेंगे।

मुख्य बातें

tldraw-canvas-kit यह साबित करता है कि AI-संचालित डायग्राम निर्माण को केवल क्लाउड-आधारित और संभाव्य (probabilistic) प्रक्रिया होने की आवश्यकता नहीं है। ड्राइंग लॉजिक को एक लोकल API में केंद्रित करके और स्टेबल आइडेंटिफायर्स को लागू करके, यह इंजीनियरों को गोपनीयता या नियंत्रण से समझौता किए बिना दोहराने योग्य और ऑडिट-रेडी विजुअल्स बनाने की सुविधा देता है।