Overture
आधिकारिकAI कोडिंग एजेंटों के लिए विज़ुअल प्लान अनुमोदन। अपने एजेंट की योजना को एक इंटरैक्टिव ग्राफ के रूप में देखें, संदर्भ संलग्न करें, दृष्टिकोण चुनें, फिर कोई कोड लिखने से पहले अनुमोदित करें।
दस्तावेज़
कोड से पहले योजना देखें। उसे स्वीकृत करें। फिर उसे क्रियान्वित होते देखें।
समस्या • समाधान • इंस्टॉल करें • विशेषताएँ • मार्केटप्लेस • कॉन्फ़िग • चर्चाएँ
https://github.com/user-attachments/assets/eeb9c4cb-c80d-42da-bf63-c0c4ecb1e5d6
🔥 समस्या
आज हर AI कोडिंग एजेंट — Cursor, Claude Code, Cline, Copilot — एक ही तरह से काम करता है:
अभी क्या होता है
|
टेक्स्ट योजनाएँ मदद नहीं करतींकुछ एजेंट चैट में टेक्स्ट के रूप में योजनाएँ दिखाते हैं। लेकिन टेक्स्ट यह दिखाने में विफल रहता है:
|
✨ समाधान
Overture आपके AI एजेंट के नियोजन चरण को बीच में रोकता है और इसे एक इंटरैक्टिव विज़ुअल फ़्लोचार्ट के रूप में प्रस्तुत करता है — किसी भी कोड के लिखे जाने से पहले।
एजेंट तब तक कोड की एक भी लाइन नहीं लिखता जब तक आप योजना को स्वीकृत नहीं कर देते।
|
विज़ुअल योजनाएँ पैन, ज़ूम और क्लिक-थ्रू नेविगेशन के साथ इंटरैक्टिव फ़्लोचार्ट |
संदर्भ संलग्न करें प्रति चरण फ़ाइलें, API कुंजियाँ, निर्देश |
दृष्टिकोण चुनें विभिन्न पथों के फ़ायदे/नुकसान की तुलना करें |
रीयल-टाइम निष्पादन नोड्स को प्रगति के साथ चमकते हुए देखें |
MCP मार्केटप्लेस प्रति नोड टूल ब्राउज़ करें और संलग्न करें |
🚀 इंस्टॉलेशन
Overture एक MCP सर्वर है जो किसी भी MCP-संगत AI कोडिंग एजेंट के साथ काम करता है। इंस्टॉल करने के लिए एक कमांड।
Claude Code
claude mcp add overture-mcp -- npx overture-mcp
Cursor
~/.cursor/mcp.json में जोड़ें:
{
"mcpServers": {
"overture": {
"command": "npx",
"args": ["overture-mcp"]
}
}
}
अधिक एजेंट (Cline, Copilot, Sixth AI)
Cline (VS Code एक्सटेंशन)
VS Code सेटिंग्स खोलें → "Cline MCP" खोजें → जोड़ें:
{
"mcpServers": {
"overture": {
"command": "npx",
"args": ["overture-mcp"]
}
}
}
GitHub Copilot
अपने प्रोजेक्ट रूट में .vscode/mcp.json बनाएँ:
{
"servers": {
"overture": {
"command": "npx",
"args": ["overture-mcp"]
}
}
}
नोट: GitHub Copilot MCP के लिए VS Code 1.99+ आवश्यक है और यह
mcpServersके बजायserversका उपयोग करता है।
Sixth AI (VS Code एक्सटेंशन)
अपनी Sixth AI MCP सेटिंग्स फ़ाइल में जोड़ें:
| प्लेटफ़ॉर्म | पथ |
|---|---|
| macOS | ~/Library/Application Support/Code/User/globalStorage/sixth.sixth-ai/settings/sixth-mcp-settings.json |
| Windows | %APPDATA%\Code\User\globalStorage\sixth.sixth-ai\settings\sixth-mcp-settings.json |
| Linux | ~/.config/Code/User/globalStorage/sixth.sixth-ai/settings/sixth-mcp-settings.json |
{
"mcpServers": {
"overture": {
"command": "npx",
"args": ["overture-mcp"],
"disabled": false
}
}
}
वैश्विक इंस्टॉलेशन (वैकल्पिक)
npm install -g overture-mcp
सत्यापित करें कि यह काम करता है
अपने एजेंट को कोई भी कार्य दें। Overture स्वचालित रूप से http://localhost:3031 पर आपकी योजना के साथ खुलता है, जो स्वीकृति के लिए तैयार है।
🎯 यह कैसे काम करता है
प्रवाह:
| चरण | क्या होता है |
|---|---|
| 1. प्रॉम्प्ट | आप अपने एजेंट को एक कार्य देते हैं: "प्रमाणीकरण के साथ एक REST API बनाएँ" |
| 2. योजना | एजेंट चरणों, शाखाओं और आवश्यकताओं के साथ एक विस्तृत योजना तैयार करता है |
| 3. विज़ुअलाइज़ करें | Overture योजना को एक इंटरैक्टिव ग्राफ़ के रूप में प्रस्तुत करता है |
| 4. समृद्ध करें | आप नोड्स पर क्लिक करते हैं, फ़ाइलें संलग्न करते हैं, शाखाएँ चुनते हैं, API कुंजियाँ भरते हैं |
| 5. स्वीकृत करें | आप "स्वीकृत करें और निष्पादित करें" पर क्लिक करें (या Enter दबाएँ) |
| 6. निष्पादित करें | रीयल-टाइम में देखें कि नोड्स स्पंदित होते हैं, पूर्ण होते हैं, या विफल होते हैं |
| 7. नियंत्रण | रोकें (Spacebar), फिर से शुरू करें, नोड्स को पुनः चलाएँ, या बीच में ही योजना को संशोधित करें |
🛠 विशेषताएँ
इंटरैक्टिव योजना कैनवास
| विशेषता | विवरण |
|---|---|
| React Flow कैनवास | सहज एनिमेशन के साथ पूर्ण पैन, ज़ूम, ड्रैग |
| स्ट्रीमिंग पार्सर | एजेंट द्वारा उत्पन्न किए जाने पर योजना नोड्स रीयल-टाइम में दिखाई देते हैं |
| Dagre ऑटो-लेआउट | नोड्स की बुद्धिमान स्वचालित स्थिति |
| विज़ुअल स्थिति | लंबित (ग्रे) → सक्रिय (स्पंदित पीला) → पूर्ण (हरा) / विफल (लाल) |
| अगला नोड संकेतक | नीली पल्स दिखाती है कि अगला कौन सा नोड निष्पादित होगा |
| जटिलता बैज | एक नज़र में निम्न (हरा), मध्यम (पीला), उच्च (लाल) |
| चमक प्रभाव | छाया चमक सक्रिय और आगामी नोड्स को उजागर करती है |
| सम्मिलित करने योग्य किनारे | योजना के बीच में नए नोड्स डालने के लिए किनारों पर होवर करें |
नोड विवरण पैनल
इसके पूर्ण विवरण प्रकट करने के लिए किसी भी नोड पर क्लिक करें:
| जानकारी | आप क्या देखते हैं |
|---|---|
| शीर्षक और विवरण | यह चरण क्या करता है इसका पूर्ण संदर्भ |
| जटिलता स्तर | दृश्य संकेतक के साथ निम्न / मध्यम / उच्च |
| अपेक्षित आउटपुट | चरण को क्या उत्पन्न करना चाहिए |
| जोखिम और किनारे के मामले | ध्यान देने योग्य संभावित मुद्दे |
| फ़ायदे और नुकसान | शाखा विकल्पों के लिए, व्यापार-नापसंद की तुलना करें |
गतिशील फ़ील्ड (उपयोगकर्ता इनपुट)
नोड्स निष्पादन से पहले आपसे इनपुट का अनुरोध कर सकते हैं:
| फ़ील्ड प्रकार | उपयोग का मामला |
|---|---|
| स्ट्रिंग | प्रोजेक्ट नाम, URL, कस्टम मान |
| संख्या | पोर्ट नंबर, सीमाएँ, गणनाएँ |
| बूलियन | विकल्पों के लिए हाँ/नहीं टॉगल |
| चयन | पूर्वनिर्धारित विकल्पों के साथ ड्रॉपडाउन |
| सीक्रेट | API कुंजियाँ, टोकन (नकाबपोश इनपुट) |
| फ़ाइल | संदर्भ संलग्न करने के लिए फ़ाइल पथ |
प्रत्येक फ़ील्ड में शामिल हैं:
- आवश्यक/वैकल्पिक संकेतक
- डिफ़ॉल्ट मान
- सहायता टेक्स्ट और विवरण
- सेटअप निर्देश ("API कुंजी कैसे प्राप्त करें")
फ़ाइल अटैचमेंट
विशिष्ट नोड्स में संदर्भ फ़ाइलें संलग्न करें:
- स्वचालित प्रकार का पता लगाना — छवि, कोड, दस्तावेज़, या अन्य
- प्रति फ़ाइल प्रकार दृश्य चिह्न
- विवरण — यह फ़ाइल क्यों मायने रखती है इसके बारे में नोट्स जोड़ें
- हटाएँ — अवांछित अटैचमेंट हटाएँ
मेटा निर्देश
किसी भी नोड में कस्टम LLM निर्देश जोड़ें:
"यहाँ त्रुटि प्रबंधन पर विशेष ध्यान दें" "src/auth.ts से मौजूदा प्रमाणीकरण पैटर्न का उपयोग करें" "किनारे के मामलों के लिए परीक्षण जोड़ना सुनिश्चित करें"
निर्देश उस नोड के निष्पादित होने से ठीक पहले एजेंट को भेजे जाते हैं।
शाखा का पता लगाना और चयन
जब एजेंट कई दृष्टिकोण प्रस्तावित करता है:
| विशेषता | विवरण |
|---|---|
| स्वतः-पहचान | ग्राफ़ संरचना से शाखाओं का पता लगाया जाता है (कोई विशेष मार्कअप नहीं) |
| शाखा बिंदु | कई आउटगोइंग किनारों वाले नोड्स निर्णय बिंदु बन जाते हैं |
| चयन मोडल | फ़ायदे/नुकसान के साथ अगल-बगल तुलना |
| जटिलता तुलना | प्रत्येक विकल्प के लिए कठिनाई स्तर देखें |
| दृश्य संकेतक | चयनित शाखा कैनवास पर हाइलाइट की गई |
| अचयनित छोड़ें | केवल आपका चुना हुआ पथ निष्पादित होता है |
आवश्यकताएँ चेकलिस्ट
इससे पहले कि आप स्वीकृत कर सकें, Overture दिखाता है कि क्या आवश्यक है:
- खाली आवश्यक फ़ील्ड — प्रति नोड गिना गया
- शाखा चयन — कौन से निर्णय लंबित हैं
- प्रगति संकेतक — दृश्य पूर्णता ट्रैकिंग
- विस्तार योग्य आइटम — विवरण देखने के लिए क्लिक करें
- रंग कोडिंग — हरा (पूर्ण) / नारंगी (लंबित)
स्वीकृत करें बटन तब तक अक्षम रहता है जब तक सभी आवश्यकताएँ पूरी नहीं हो जातीं।
निष्पादन नियंत्रण
| नियंत्रण | कैसे |
|---|---|
| स्वीकृत करें | बटन क्लिक करें या Enter दबाएँ |
| रोकें | निष्पादन के बीच में Spacebar दबाएँ |
| फिर से शुरू करें | Spacebar फिर से दबाएँ |
| नोड पुनः चलाएँ | विफल नोड पर क्लिक करें → "पुनः चलाएँ" |
| यहाँ से पुनः चलाएँ | किसी भी नोड से अंत तक पुनः निष्पादित करें |
स्वीकृति बटन स्मार्ट है:
- 🟢 "स्वीकृत करें और निष्पादित करें" — योजना तैयार, आवश्यकताएँ पूरी
- 🟠 "आवश्यकताएँ पूरी करें" — शर्तें अधूरी
- 🔵 "निष्पादित हो रहा है..." — स्पिनर के साथ चल रहा है
- 🟢 "पूर्ण" — सब हो गया
- 🔴 "विफल" — त्रुटि हुई
संरचित आउटपुट
प्रत्येक नोड के निष्पादित होने के बाद, समृद्ध संरचित आउटपुट देखें:
| श्रेणी | यह क्या दिखाता है |
|---|---|
| अवलोकन | जो पूरा किया गया उसका सारांश |
| बदली गई फ़ाइलें | पथ, जोड़ी/हटाई गई पंक्तियाँ, अंतर |
| बनाई गई फ़ाइलें | पंक्ति गणना के साथ नई फ़ाइलें |
| हटाई गई फ़ाइलें | हटाई गई फ़ाइलें |
| इंस्टॉल किए गए पैकेज | संस्करणों के साथ npm पैकेज |
| MCP सर्वर सेटअप | इंस्टॉलेशन स्थिति (इंस्टॉल/कॉन्फ़िगर/विफल) |
| वेब खोजें | की गई क्वेरीज़, उपयोग किए गए परिणाम |
| टूल कॉल | कौन से टूल का उपयोग किया गया और कितनी बार |
| पूर्वावलोकन URL | तैनात साइटों या पूर्वावलोकन के लिंक |
| नोट्स | जानकारी, चेतावनियाँ, त्रुटियाँ |
प्रत्येक श्रेणी विस्तार योग्य है — दृश्य अधिभार के बिना गहराई से जाएँ।
आउटपुट मोडल
पूर्ण आउटपुट देखने के लिए किसी भी पूर्ण नोड पर क्लिक करें:
- लंबे आउटपुट के लिए स्क्रॉल करने योग्य
- सिंटैक्स हाइलाइटेड कोड स्निपेट
- Escape से बंद करें या बाहर क्लिक करें
🏪 MCP मार्केटप्लेस
Overture UI से सीधे MCP सर्वर ब्राउज़ करें और संलग्न करें।
| विशेषता | विवरण |
|---|---|
| अंतर्निहित मार्केटप्लेस | MCP सर्वर खोजें और खोजें |
| सर्वर विवरण | विवरण, लेखक, GitHub लिंक, सितारे |
| श्रेणी ब्राउज़िंग | उपयोग के मामले के अनुसार फ़िल्टर करें |
| प्रति-नोड अटैचमेंट | विशिष्ट चरणों में विशिष्ट टूल संलग्न करें |
| सेटअप निर्देश | देखें कि प्रत्येक सर्वर को कैसे कॉन्फ़िगर करें |
| अनुशंसित सर्वर | सामान्य कार्यों के लिए क्यूरेटेड सूची |
जब आप किसी नोड में MCP सर्वर संलग्न करते हैं, तो एजेंट को केवल उस चरण के लिए उन टूल्स तक पहुँच प्राप्त होती है।
📂 बहु-परियोजना समर्थन
एक साथ कई परियोजनाओं पर काम करें:
| विशेषता | विवरण |
|---|---|
| टैब नेविगेशन | परियोजनाओं के बीच तुरंत स्विच करें |
| स्वतः पंजीकरण | पहले एजेंट संपर्क पर परियोजनाएँ पंजीकृत होती हैं |
| पृथक स्थिति | प्रत्येक परियोजना की अलग योजनाएँ, नोड्स, कॉन्फ़िग्स |
| अपठित बैज | जानें कि अन्य परियोजनाओं में अपडेट कब हैं |
| परियोजना संदर्भ | परियोजना का नाम, पथ और एजेंट प्रकार देखें |
एकल परियोजना? स्वच्छ UI के लिए टैब बार स्वचालित रूप से छिप जाता है।
📜 योजना इतिहास और स्थायित्व
अपना काम कभी न खोएं:
| विशेषता | विवरण |
|---|---|
| स्वतः-सहेजें | योजनाएँ हर 3 सेकंड में सहेजी जाती हैं |
| स्थानीय भंडारण | ~/.overture/history.json में संग्रहीत |
| इतिहास ब्राउज़र | सभी पिछली योजनाओं के साथ स्लाइड-इन पैनल |
| स्थिति चिह्न | पूर्ण, विफल, निष्पादित, रुका हुआ |
| प्रगति पट्टियाँ | दृश्य पूर्णता प्रतिशत |
| एक-क्लिक पुनः आरंभ | किसी भी पिछली योजना को लोड करें और जारी रखें |
| पूर्ण संदर्भ | सभी फ़ील्ड मान, शाखा चयन, अटैचमेंट संरक्षित |
पुनः आरंभ जानकारी
पुनः आरंभ करते समय, आपको पूर्ण संदर्भ मिलता है:
- वर्तमान नोड — जहाँ निष्पादन रुका था
- पूर्ण नोड्स — उनके आउटपुट के साथ
- लंबित नोड्स — करने के लिए क्या बचा है
- विफल नोड्स — त्रुटि संदेशों के साथ
- सभी कॉन्फ़िगरेशन — फ़ील्ड मान, शाखाएँ, अटैचमेंट
- टाइमस्टैम्प — कब बनाया गया, कब रोका गया
✏️ गतिशील योजना संशोधन
निष्पादन के दौरान भी योजनाओं को संशोधित करें:
| संचालन | विवरण |
|---|---|
| नोड्स डालें | निष्पादन के बीच में नए चरण जोड़ें |
| नोड्स हटाएँ | चरण हटाएँ (किनारे स्वतः पुनः जुड़ते हैं) |
| सामग्री बदलें | नोड शीर्षक/विवरण को यथास्थान अपडेट करें |
| बैच संचालन | एक अनुरोध में कई बदलाव |
योजना अंतर दृश्य
जब कोई योजना बदलती है, तो ठीक-ठीक देखें कि क्या अलग है:
- जोड़े गए नोड्स — हरे रंग में हाइलाइट किए गए
- हटाए गए नोड्स — लाल रंग में हाइलाइट किए गए
- संशोधित नोड्स — पहले/बाद की तुलना के साथ पीला
- किनारे में बदलाव — जोड़े/हटाए गए कनेक्शन
🔌 MCP टूल (एजेंट डेवलपर्स के लिए)
Overture एजेंटों के साथ बातचीत करने के लिए 11 MCP टूल प्रदान करता है:
| टूल | उद्देश्य |
|---|---|
submit_plan | XML के रूप में पूर्ण योजना सबमिट करें |
get_approval | उपयोगकर्ता की स्वीकृति की प्रतीक्षा करें (स्वीकृत होने तक ब्लॉक करता है) |
update_node_status | निष्पादन के दौरान नोड स्थिति + आउटपुट अपडेट करें |
plan_completed | योजना को सफलतापूर्वक पूर्ण के रूप में चिह्नित करें |
plan_failed | त्रुटि संदेश के साथ योजना को विफल के रूप में चिह्नित करें |
check_rerun | जाँचें कि क्या उपयोगकर्ता ने नोड पुनः चलाने का अनुरोध किया |
check_pause | जाँचें कि क्या उपयोगकर्ता ने निष्पादन रोका |
get_resume_info | रुकी हुई योजना को फिर से शुरू करने के लिए पूर्ण संदर्भ प्राप्त करें |
request_plan_update | वृद्धिशील योजना संशोधनों का अनुरोध करें |
create_new_plan | एक नई योजना के निर्माण का संकेत दें |
get_usage_instructions | एजेंट-विशिष्ट निर्देश प्राप्त करें |
🔄 रीयल-टाइम WebSocket संचार
19 सर्वर-से-क्लाइंट संदेश प्रकार:
connected • plan_started • node_added • edge_added • plan_ready • plan_approved • node_status_updated • plan_completed • plan_failed • plan_paused • plan_resumed • nodes_inserted • node_removed • project_registered • projects_list • history_entries • plan_loaded • resume_plan_info • plan_updated
16 क्लाइंट-से-सर्वर संदेश प्रकार:
approve_plan • cancel_plan • rerun_request • pause_execution • resume_execution • insert_nodes • remove_node • register_project • subscribe_project • unsubscribe_project • get_history • load_plan • get_resume_info • save_plan • request_plan_update • create_new_plan
रिले मोड
जब WebSocket पोर्ट पहले से उपयोग में हो, तो Overture स्वचालित रूप से एक रिले क्लाइंट के रूप में काम करता है, मौजूदा सर्वर के माध्यम से संदेशों को अग्रेषित करता है। कई एजेंट इंस्टेंस एक ही UI साझा कर सकते हैं।
⚙️ कॉन्फ़िगरेशन
| चर | डिफ़ॉल्ट | विवरण |
|---|---|---|
OVERTURE_HTTP_PORT | 3031 | वेब UI के लिए पोर्ट |
OVERTURE_WS_PORT | 3030 | WebSocket के लिए पोर्ट |
OVERTURE_AUTO_OPEN | true | प्रारंभ पर ब्राउज़र स्वतः खोलें |
एनवायरनमेंट वेरिएबल सेट करना
Claude Code
claude mcp add overture-mcp -e OVERTURE_HTTP_PORT=4000 -e OVERTURE_AUTO_OPEN=false -- npx overture-mcp
Cursor / Cline / Sixth AI
{
"mcpServers": {
"overture": {
"command": "npx",
"args": ["overture-mcp"],
"env": {
"OVERTURE_HTTP_PORT": "4000",
"OVERTURE_WS_PORT": "4001",
"OVERTURE_AUTO_OPEN": "false"
}
}
}
}
GitHub Copilot
{
"servers": {
"overture": {
"command": "npx",
"args": ["overture-mcp"],
"env": {
"OVERTURE_HTTP_PORT": "4000",
"OVERTURE_WS_PORT": "4001",
"OVERTURE_AUTO_OPEN": "false"
}
}
}
}
⌨️ कीबोर्ड शॉर्टकट
| कुंजी | क्रिया |
|---|---|
Enter | योजना स्वीकृत करें (जब तैयार हो) |
Space | निष्पादन रोकें / फिर से शुरू करें |
Escape | वर्तमान नोड अचयनित करें / मोडल बंद करें |
🤝 समर्थित एजेंट
| एजेंट | स्थिति | नोट्स |
|---|---|---|
| Claude Code | ✅ पूर्ण | मूल MCP समर्थन |
| Cursor | ✅ पूर्ण | mcp.json कॉन्फ़िग के माध्यम से |
| Cline | ✅ पूर्ण | VS Code सेटिंग्स के माध्यम से |
| GitHub Copilot | ✅ पूर्ण | VS Code 1.99+ आवश्यक |
| Sixth AI | ✅ पूर्ण | अंतर्निहित, शून्य कॉन्फ़िग |
प्रत्येक एजेंट के पास इष्टतम योजना निर्माण के लिए कस्टम-अनुरूप प्रॉम्प्ट हैं।
💪 Overture क्यों?
उपयोगकर्ताओं के लिए
|
AI कोडिंग के लिए
|
🧑💻 विकास
# Clone the repo
git clone https://github.com/SixHq/Overture.git
cd Overture
# Install dependencies
npm install
# Build all packages
npm run build
# Start MCP server (in one terminal)
cd packages/mcp-server && npm start
# Start UI dev server (in another terminal)
cd packages/ui && npm run dev
टेक स्टैक
| परत | प्रौद्योगिकियाँ |
|---|---|
| MCP सर्वर | Node.js, TypeScript, Express, WebSocket (ws), SAX XML पार्सर |
| UI | React 18, React Flow, Zustand, Framer Motion, Tailwind CSS, Vite |
| लेआउट | Dagre (स्वचालित ग्राफ़ पोजिशनिंग) |
🤝 योगदान
Overture खुला स्रोत है और हम योगदान का स्वागत करते हैं!
- 🐛 बग रिपोर्ट करें GitHub Issues पर
- 💡 सुविधाएँ सुझाएँ GitHub Discussions पर
- 📖 दस्तावेज़ सुधारें — PRs का स्वागत है
- 🔧 कोड योगदान करें — CONTRIBUTING.md देखें
सभी योगदानों की सराहना की जाती है, चाहे वे कितने भी छोटे हों।
📄 लाइसेंस
MIT लाइसेंस - विवरण के लिए LICENSE देखें।
Sixth द्वारा निर्मित
सर्वोत्तम अनुभव के लिए, Sixth for VS Code
आज़माएँ
Overture बिना किसी कॉन्फ़िगरेशन के अंतर्निहित है।
अंधाधुंध उड़ना बंद करें। योजना देखें। उसे स्वीकृत करें। आत्मविश्वास के साथ निष्पादित करें।