इस प्रोजेक्ट के बारे में

Better Design एक ओपन-सोर्स डिज़ाइन MCP सर्वर और shadcn/ui रजिस्ट्री है जिसका उद्देश्य AI कोडिंग एजेंटों को संरचित डिज़ाइन संदर्भ प्रदान करना है। इसे MCP-संगत एजेंटों और एडिटर्स के साथ काम करने के लिए डिज़ाइन किया गया है, जिसमें Claude Code, Cursor, VS Code/GitHub Copilot, Claude Desktop और claude.ai शामिल हैं। यह प्रोजेक्ट एक डिज़ाइन-सिस्टम रजिस्ट्री, UI सिद्धांतों, आइकन मार्गदर्शन, एक्सेसिबिलिटी चेक और विजुअल-डिज़ाइन समीक्षा नियमों को संयोजित करता है। इस सिस्टम में दो परतें हैं। Design Intelligence परत UI कार्य के दौरान हमेशा सक्रिय रहती है: जब कोई एजेंट इंटरफ़ेस बनाता है, तो वह प्रासंगिक उत्पाद-डिज़ाइन सिद्धांतों और समीक्षा नियमों को लोड कर सकता है। Scaffold परत ऑन-डिमांड होती है और नए UI कार्य को डिज़ाइन सिस्टम से मिलाती है; एक उपयोगकर्ता "use better-design" कह सकता है और MCP एक उपयुक्त सिस्टम का समाधान करता है। README में MCP टूल्स सूचीबद्ध हैं: resolve-design-system, get-design-system-docs, get-ui-principle, get-review-rules, resolve-icon-library, और search-icons। ये सिमेंटिक डिज़ाइन-सिस्टम मिलान, टोकन और कंपोनेंट कोड लोड करना, पदानुक्रम (hierarchy), स्पेसिंग, टाइपोग्राफी, डेप्थ, मोशन और फॉर्म्स पर केंद्रित मार्गदर्शन, WCAG और विजुअल-डिज़ाइन चेकलिस्ट, आइकन-फैमिली मिलान और Iconify के माध्यम से आइकन खोज को कवर करते हैं। रजिस्ट्री में shadcn/ui के लिए 31 ओपन-सोर्स डिज़ाइन सिस्टम शामिल हैं। नामित थीम में Linear, Linear Quality, Supabase, Vercel, Airbnb, Notion, Stripe, Apple, Figma, Light Marketplace, Precision Light, Minimal Light, Dark Orange, Vibrant Dark, Neutral Monochrome, Cinematic Dark, Editorial Dark, Corporate Fintech, Beam Custom, Beam Lib, Glassmorphic Dark, Inset Dark, Lumen Dark, Metal FX Gold, Metal FX Silver, Metal FX Chromatic, Midnight Glass, Monochrome Industrial, Pillow Light, Tactile Minimal और TV Style शामिल हैं। प्रत्येक डिज़ाइन सिस्टम में एक globals.css टोकन परत और कंपोनेंट ओवरराइड्स होते हैं। कंपोनेंट्स को रजिस्ट्री URL का उपयोग करके shadcn CLI के माध्यम से shadcn/ui प्रोजेक्ट में इंस्टॉल किया जा सकता है, उदाहरण के लिए Linear बटन। सेटअप स्थानीय (local) या रिमोट हो सकता है। README में npx skills add marvkr/better-design --skill better-design के साथ एजेंट स्किल इंस्टॉल करने और npx better-design चलाने का दस्तावेजीकरण है; इंस्टॉलर कोडिंग टूल्स का पता लगाता है और मौजूदा कॉन्फ़िगरेशन को बदले बिना MCP को कनेक्ट करता है। better-design.com/api/mcp पर एक होस्टेड रिमोट MCP एंडपॉइंट भी दस्तावेजीकृत है, जो Authorization हेडर में साइट सेटिंग्स से API कुंजी का उपयोग करता है। README बताता है कि स्थानीय सेटअप पथ के लिए किसी खाते की आवश्यकता नहीं है और रिमोट MCP के लिए Claude Desktop कॉन्फ़िगरेशन उदाहरण प्रदान करता है। रिपॉजिटरी संरचना में प्रति-थीम shadcn/ui ओवरराइड्स के लिए कंपोनेंट्स, रजिस्ट्री JSON प्रविष्टियाँ, बिल्ड और सीड स्क्रिप्ट, इंस्टॉल करने योग्य स्किल्स और अन्य एजेंट स्किल्स शामिल हैं। योगदान मार्गदर्शन कहता है कि नए डिज़ाइन सिस्टम के लिए कंपोनेंट TSX ओवरराइड्स, संबंधित रजिस्ट्री प्रविष्टियों और एक सीड रन की आवश्यकता होती है। शैडो लेयर्स, फोकस स्टेट्स, बॉर्डर मोटाई, होवर ट्रांज़िशन और संदर्भ-विशिष्ट रेडियस विविधताओं जैसे डिज़ाइन बारीकियों की उम्मीद कंपोनेंट कोड में की जाती है, न कि केवल CSS वेरिएबल्स में। यह प्रोजेक्ट MIT लाइसेंस के तहत है।