Rive MCP: Claude Code, Cursor और कोडेक्स को Rive से कैसे कनेक्ट करें
Rive MCP सर्वर कैसे काम करता है, Claude Code और Cursor को Rive संपादक से कैसे कनेक्ट करें, AI क्या कर सकता है और क्या नहीं, और यह Rive के अंतर्निहित एजेंट और Rive CLI के साथ तुलना कैसे करता है।
कोर टेकअवे
Rive MCP सर्वर Mac और Windows के लिए Rive डेस्कटॉप एडिटर में बनाया गया है। जबकि Rive खुला है, यह http://127.0.0.1:9791/mcp पर चलता है, और Claude Code और Cursor जैसे AI कोडिंग टूल आर्टबोर्ड, आकार, एनिमेशन, स्टेट मशीन बनाने, खुली फ़ाइल में मॉडल और स्क्रिप्ट देखने के लिए इससे जुड़ सकते हैं। Claude Code में, इसे एक कमांड से कनेक्ट करें: claude mcp add --transport http rive http://127.0.0.1:9791/mcp।
इस गाइड के बारे में
ExodeUI Rive या एंथ्रोपिक से संबद्ध नहीं है। यह गाइड अक्टूबर 2026 तक Rive के स्वयं के दस्तावेज़ पर आधारित है। Rive की AI सुविधाएँ तेजी से बदलती हैं, इसलिए यदि कोई चरण आपके द्वारा देखे गए से मेल नहीं खाता है, तो आधिकारिक MCP पृष्ठ देखें। हम ExodeUI बनाते हैं, जिसका अपना MCP सर्वर है, और हम अंत में दोनों की तुलना करते हैं।
Rive MCP सर्वर क्या कर सकता है
Rive का कहना है कि पहले टूल का उद्देश्य दोहराए जाने वाले कार्य हैं, जैसे सैकड़ों राज्यों और परतों के साथ दृश्य मॉडल या राज्य मशीनें बनाना। Rive के दस्तावेज़ों के अनुसार, एक कनेक्टेड AI टूल यह कर सकता है:
- फ़ाइलें बनाएं और प्रबंधित करें: आर्टबोर्ड जोड़ें, नाम बदलें, आकार बदलें, व्यवस्थित करें और फ़ोकस करें
- दृश्य का निरीक्षण करें और संपादित करें: पदानुक्रम को क्वेरी करें, वस्तुओं का चयन करें, गुणों को अपडेट करें, डुप्लिकेट करें, पुनः व्यवस्थित करें, तत्वों को हटाएं या हटाएं
- डिज़ाइन बनाएँ: आकार, पथ, लेआउट, घटक उदाहरण और सूचियाँ
- एनीमेशन और इंटरैक्शन बनाएं: रैखिक एनिमेशन, राज्य मशीनें, राज्य, संक्रमण, स्थितियां, कीफ़्रेम और इंटरपोलेशन
- डेटा बाइंडिंग के साथ कार्य करें: मॉडल, गुण, उदाहरण और बाइंडिंग देखें
- लुओ स्क्रिप्ट और डब्लूजीएसएल शेडर्स संपादित करें: कोड अपडेट करें, डायग्नोस्टिक्स चलाएं, पुन: संकलित करें, परीक्षण करें और कंसोल आउटपुट पढ़ें
Claude Code के साथ Rive MCP कैसे सेट करें
MCP केवल डेस्कटॉप संपादक के साथ काम करता है, ब्राउज़र संस्करण के साथ नहीं। पहले Rive खोलें, फिर अपना AI टूल कनेक्ट करें।
1. Rive डेस्कटॉप ऐप खोलें
MacOS या Windows के लिए rive.app/downloads से नवीनतम Rive डेस्कटॉप एडिटर इंस्टॉल करें और वह फ़ाइल खोलें जिस पर आप काम करना चाहते हैं।
2. MCP सर्वर जोड़ें
टर्मिनल में, चलाएँ: claude mcp add --transport http rive http://127.0.0.1:9791/mcp
3. Claude Code प्रारंभ करें
क्लाउड चलाओ. Rive खुलने के बाद इसे प्रारंभ करें, ताकि यह Rive टूल ढूंढ सके।
4. फीचर्स में प्रॉम्प्ट करें, कोड नहीं
वर्णन करें कि आप क्या देखना चाहते हैं और क्या नहीं बदलना चाहिए, उदाहरण के लिए "बटन में एक होवर स्थिति जोड़ें जो इसे स्प्रिंग के साथ 1.05 तक स्केल करता है, और दबाए गए स्थिति को वैसे ही रखें"।
Cursor और कोडेक्स के साथ Rive MCP कैसे सेट करें
Cursor में, सेटिंग्स खोलें, टूल्स और MCPs पर जाएं, कस्टम MCP जोड़ें चुनें, और URL http://127.0.0.1:9791/mcp के साथ rive नाम का सर्वर जोड़ें, फिर कनेक्शन चालू करें। Rive दस्तावेज़ Claude Code और Cursor। क्योंकि सर्वर एक स्थानीय HTTP MCP सर्वर है, अन्य क्लाइंट जो HTTP MCP सर्वर का समर्थन करते हैं, जैसे कोडेक्स, उसी URL से जुड़ सकते हैं।
Rive MCP बनाम Rive का अंतर्निहित AI एजेंट
Rive में संपादक के अंदर एक AI एजेंट भी है। दोनों आपकी फ़ाइल को संपादित कर सकते हैं. अंतर यह है कि भुगतान कौन करता है और एजेंट और क्या देख सकता है।
- बिल्ट-इन एजेंट Rive की योजनाओं पर चलता है: फ्री और कैडेट पर सीमित, उन्नत मॉडल, टॉप-अप क्रेडिट और वोयाजर पर आपकी अपनी एपीआई कुंजी के साथ।
- MCP के साथ, आप उस AI सदस्यता का उपयोग करते हैं जिसके लिए आप पहले से भुगतान करते हैं, जैसे Claude या Cursor
- एक बाहरी एजेंट आपके ऐप कोड, नोट्स और दस्तावेज़ों को भी पढ़ सकता है, इसलिए यह Rive फ़ाइल को संपादित कर सकता है और उसी सत्र में इसे आपके ऐप में वायर कर सकता है
- अंतर्निहित एजेंट को किसी सेटअप की आवश्यकता नहीं है और यह ब्राउज़र संपादक में काम करता है
Rive MCP बनाम Rive CLI
Rive का नया CLI एक अलग मार्ग है। खुले संपादक को चलाने के बजाय, आपका कोडिंग एजेंट दृश्य को Rive मार्कअप लैंग्वेज (आरएमएल) में टेक्स्ट के रूप में लिखता है, और सीएलआई आपके ऐप के लिए .riv फ़ाइलें या संपादक में खुलने वाली .rev फ़ाइलें बनाता है। यह एक स्थानीय पूर्वावलोकन दिखाता है, फ्रेम प्रस्तुत कर सकता है और बिना विंडो के परीक्षण चला सकता है, और प्रोजेक्ट को टेक्स्ट के फ़ोल्डर के रूप में रखता है, ताकि यह संस्करण नियंत्रण में रह सके। संपादक में किसी डिज़ाइनर के साथ काम करने के लिए MCP का उपयोग करें; जब कोई एजेंट कोड से Rive ग्राफिक्स बनाता या संपादित करता है तो सीएलआई का उपयोग करें।
आरंभ करने से पहले जानने योग्य सीमाएं
Rive का MCP एकीकरण युवा है, और इसकी कुछ व्यावहारिक सीमाएँ हैं।
- केवल डेस्कटॉप संपादक, macOS और Windows पर, और Rive आपकी फ़ाइल के साथ खुला होना चाहिए
- एआई खुली हुई फाइल पर काम करता है, इसलिए इस पर भरोसा करने से पहले स्क्रीन पर परिणाम की जांच कर लें
- Rive स्प्लैश स्क्रीन के बिना .riv फ़ाइलों को प्रकाशित करने के लिए अभी भी एक भुगतान योजना की आवश्यकता है, कैडेट की ओर से $9 प्रति सीट प्रति माह वार्षिक बिल भेजा जाएगा।
- जो संकेत आपके इच्छित परिणाम का वर्णन करते हैं, वे कोड का वर्णन करने वाले संकेतों से बेहतर काम करते हैं
एक विकल्प: ExodeUI का MCP सर्वर
ExodeUI इंटरैक्टिव यूआई और एनीमेशन के लिए एक ब्राउज़र और डेस्कटॉप टूल है। इसमें एक MCP सर्वर भी है, इसलिए Claude Code, Cursor और अन्य AI कोडिंग टूल सादे भाषा के संकेतों से एनिमेशन बना और संपादित कर सकते हैं। परिणाम एक खुली हुई .exode JSON फ़ाइल है जिसमें स्टेट मशीन, स्प्रिंग फिजिक्स, इनपुट और ईवेंट आपके कोड को नियंत्रित करते हैं, जो React, Vue, Svelte, Angular, Solid, React Native, SwiftUI और Flutter के रनटाइम द्वारा चलाया जाता है। यह चरित्र एनीमेशन से अधिक इंटरैक्टिव उत्पाद यूआई के लिए उपयुक्त है। यदि आप पहले से ही Rive में काम करते हैं, तो इसका MCP सर्वर आसान विकल्प है।
उत्पादन कार्यान्वयन स्निपेट
# Rive desktop editor must be open first
claude mcp add --transport http rive http://127.0.0.1:9791/mcp
# then start Claude Code
claudeयाद रखने योग्य कुंजी Principle
- Rive MCP सर्वर http://127.0.0.1:9791/mcp पर Rive डेस्कटॉप संपादक के अंदर चलता है
- Claude Code एक कमांड से जुड़ता है; Cursor टूल्स और MCPs के माध्यम से जुड़ता है
- यह खुली फ़ाइल में आकृतियाँ, एनिमेशन, स्टेट मशीन, दृश्य मॉडल और लुओ स्क्रिप्ट बना सकता है
- Rive CLI उन एजेंटों के लिए एक अलग, टेक्स्ट-आधारित मार्ग है जो कोड से Rive फ़ाइलें बनाते हैं