प्रॉम्प्ट सरफेस: नया UX प्रिमिटिव
प्रॉम्प्ट इनपुट ही नया बटन है। प्रॉम्प्ट सरफेस को फर्स्ट-क्लास UX प्रिमिटिव की तरह डिज़ाइन करने की एक काम की गाइड: एनाटॉमी, पैटर्न, फेल होने के तरीके और शिप से पहले का ऑडिट।
प्रॉम्प्ट सरफेस ही नया बटन है। जो डिज़ाइनर इसे सर्च बार की तरह ट्रीट करता है, वह 2026 में 2018 का प्रोडक्ट शिप कर रहा है। टेक्स्ट इनपुट ने फ़ॉर्म, विज़ार्ड और सेटिंग्स पैनल का ज़्यादातर हिस्सा खा लिया है, और जीतने वाले प्रोडक्ट वही हैं जो इनपुट को पेपर-एयरप्लेन आइकन वाले टेक्स्टएरिया की जगह फर्स्ट-क्लास UX प्रिमिटिव मानते हैं।
ज़्यादातर टीमें आज भी वही टेक्स्टएरिया शिप करती हैं। एक खाली आयत, "कुछ भी पूछें" लिखा प्लेसहोल्डर, एक सेंड बटन, और बस। यह भ्रम में जी रहा सर्च बार है। असली प्रॉम्प्ट सरफेस एक कंपोनेंट है जिसमें एनाटॉमी, एफ़ोर्डेंस, स्टेट और रिकवरी का रास्ता होता है।
यह लेख इसका ऑपरेशनल वर्ज़न है। प्रॉम्प्ट सरफेस असल में क्या है, हर अच्छे सरफेस के आठ हिस्से, उन्हें मारने वाले छह फेल्योर मोड, इस वक़्त बेहतरीन प्रोडक्ट्स में इस्तेमाल हो रहे छह नामित पैटर्न, और सात सवालों का ऑडिट जो तीन मिनट में बता देता है कि आपका सरफेस प्रिमिटिव है या सिर्फ़ प्लेसहोल्डर।
प्रॉम्प्ट सरफेस टेक्स्टएरिया नहीं है
प्रॉम्प्ट सरफेस वह पूरा इलाका है जिसमें यूज़र टाइप करता है, कॉन्फ़िगर करता है और जवाब वापस पढ़ता है। इनपुट उसका दिखने वाला हिस्सा है। कंपोनेंट वह सब कुछ है जो उससे जुड़ा है।
इनपुट सिर्फ़ एक एलिमेंट है। सुझावों वाला एम्प्टी स्टेट, अटैचमेंट स्लॉट, मॉडल पिकर, टूल टॉगल, सेंड एफ़ोर्डेंस, स्ट्रीमिंग आउटपुट रीजन, रीजेनरेट-एडिट-ब्रांच कंट्रोल और हिस्ट्री सरफेस बाकी हिस्से हैं। जिस टीम ने सिर्फ़ बॉक्स डिज़ाइन किया, उसने हिमशैल का सिरा शिप किया है।
Cursor, Claude, Linear AI, v0, Lovable, Notion AI, Raycast AI, Vercel AI Playground। इनमें से कोई इनपुट को टेक्स्टएरिया नहीं मानता। हर एक एक स्ट्रक्चर्ड सरफेस शिप करता है, जहाँ इनपुट एक कॉन्फ़िगर होने लायक, देखी जा सकने वाली और पलटी जा सकने वाली इंटरैक्शन का एंट्री पॉइंट है। यही बार है।
काम करने वाले प्रॉम्प्ट सरफेस की एनाटॉमी
आठ हिस्से। एम्प्टी स्टेट, सुझाव, अटैचमेंट स्लॉट, मॉडल पिकर, टूल टॉगल, सेंड एफ़ोर्डेंस, स्ट्रीमिंग आउटपुट रीजन, रिविज़न कंट्रोल। जो प्रॉम्प्ट सरफेस छह से कम हिस्से शिप करता है, वह अधूरा है।
एम्प्टी स्टेट को टेक्स्ट की दीवार खड़ी किए बिना प्रोडक्ट सिखाना होता है। Cursor का कमांड बार हाल की फ़ाइलें और हाल के प्रॉम्प्ट दिखाता है। Notion AI का स्लैश मेन्यू ही एम्प्टी स्टेट है, जो इरादे के हिसाब से शाखाओं में बँटा है। v0 स्टार्टर प्रॉम्प्ट्स की गैलरी देता है जो सबूत का भी काम करती है। "कुछ भी पूछें" दुश्मन है। यह यूज़र से कहता है कि यूज़ केस वह खुद गढ़े।
सुझाव यूज़र से आधे रास्ते पर मिलते हैं। इनलाइन चिप सुझाव, हाल के प्रॉम्प्ट की हिस्ट्री, संदर्भ-जागरूक कम्प्लीशन। Cursor का @-मेंशन पिकर पाठ्यपुस्तक जैसा उदाहरण है, जो एक कीस्ट्रोक में प्रॉम्प्ट को किसी फ़ाइल, फ़ंक्शन या डॉक तक सीमित कर देता है।
अटैचमेंट स्लॉट इनपुट को मल्टीमॉडल बनाते हैं। v0 में यूज़र स्क्रीनशॉट पेस्ट करके उसी पर प्रॉम्प्ट कर सकता है। Claude PDF, इमेज और कोड फ़ाइलें लेता है। Lovable संदर्भ के तौर पर Figma फ़्रेम लेता है। स्लॉट ही कॉन्ट्रैक्ट है।
मॉडल पिकर, टूल टॉगल और सेंड एफ़ोर्डेंस कॉन्फ़िगरेशन लेयर हैं। ये यूज़र को होने से पहले बता देते हैं कि क्या होने वाला है। Vercel AI Playground मॉडल पिकर को सबसे प्रमुख कंट्रोल बनाता है। Cursor सबमिट से पहले एजेंट मोड और इनलाइन एडिट के बीच टॉगल कराता है। कॉन्फ़िगरेशन छिपाइए और यूज़र अंदाज़े से चलेगा।
स्ट्रीमिंग आउटपुट रीजन और रिविज़न कंट्रोल लूप को बंद करते हैं। Claude का आर्टिफ़ैक्ट पैनल अब तक शिप हुए सबसे साफ़ उदाहरणों में से है। आउटपुट को अपना रीजन मिलता है, प्रॉम्प्ट सरफेस लाइव रहता है, और यूज़र किसी भी तरफ़ का कुछ खोए बिना प्रॉम्प्ट एडिट कर सकता है या आर्टिफ़ैक्ट दोबारा जनरेट कर सकता है।
ट्रस्ट सिग्नल ही असली बोझ उठाने वाली डिटेल हैं
प्रॉम्प्ट सरफेस वह जगह है जहाँ यूज़र तय करता है कि मॉडल पर भरोसा करे या नहीं। हर दिखने वाला सिग्नल या तो भरोसा कमाता है या जला देता है।
भरोसा साफ़गोई से आता है। मॉडल की पहचान दिखती है। टूल कॉल चलने से पहले लिस्ट होते हैं, या चलते समय स्ट्रीम होते हैं। स्ट्रीमिंग फ़ीडबैक ईमानदार होता है, काम का नाटक करता नकली स्पिनर नहीं। अनडू एक सेकंड से कम में पहुँच में है। एरर का रास्ता बताता है कि क्या फेल हुआ और क्यों। यह वही कारीगरी है जो एक अच्छा एजेंट UI माँगता है, बस इनपुट तक सीमित।
सबसे सस्ता ट्रस्ट सिग्नल स्टॉप बटन है। दिखने वाले स्टॉप के बिना स्ट्रीम होता जवाब एक शत्रुतापूर्ण सरफेस है। यूज़र मॉडल को वह लिखते देख रहा है जो उसे पहले से गलत पता है, और बचने का इकलौता रास्ता टैब बंद करना है। Claude, Cursor और v0 सब दिखने वाला स्टॉप शिप करते हैं। ज़्यादातर घर के बने चैट UI इसे भूल जाते हैं।
छह फेल्योर मोड जो प्रॉम्प्ट सरफेस को मार देते हैं
आज प्रोडक्शन में ज़्यादातर प्रॉम्प्ट सरफेस इनमें से कम से कम एक शिप करते हैं। फ़िक्स कोई छिपे हुए नहीं हैं।
खाली आयत। एक टेक्स्टएरिया, "मैं कैसे मदद करूँ" लिखा प्लेसहोल्डर, और कुछ नहीं। यूज़र यूज़ केस शून्य से गढ़ता है। फ़िक्स: असली प्रोडक्ट क्षमताओं से जुड़े तीन से पाँच ठोस स्टार्टर वाला स्ट्रक्चर्ड एम्प्टी स्टेट।
बिना सुझाव वाला इनपुट। सरफेस प्रॉम्प्ट लेता है पर कभी एक सुझाता नहीं। पावर यूज़र पैटर्न सीख लेते हैं। नए यूज़र छोड़ जाते हैं। फ़िक्स: हाल के प्रॉम्प्ट, स्कोप्ड सुझाव (Cursor का @-मेंशन, v0 का सिलेक्शन पिकर) और मौजूदा संदर्भ के हिसाब से ट्यून किए इनलाइन कम्प्लीशन।
मरा हुआ स्ट्रीमिंग स्पिनर। स्पिनर घूमता रहता है जबकि मॉडल चुपचाप बैकग्राउंड में दस टूल कॉल कर रहा है, और यूज़र को पता नहीं इसका मतलब क्या है। फ़िक्स: असली काम को स्ट्रीम कीजिए। टूल कॉल दिखें, फ़ाइल एडिट दिखें, बीच का आउटपुट दिखे।
न बदला जा सकने वाला मॉडल। प्रोडक्ट एक मॉडल चुनता है और चुनाव छिपा देता है। पावर यूज़र भारी काम मज़बूत मॉडल को नहीं भेज सकते, और बजट देखने वाले यूज़र हल्के काम सस्ते मॉडल को नहीं भेज सकते। फ़िक्स: पिकर दिखाइए, समझदारी से डिफ़ॉल्ट रखिए, चुनाव हर टास्क के हिसाब से याद रखिए।
भूलने वाला सरफेस। हर नया प्रॉम्प्ट संदर्भ रीसेट कर देता है। यूज़र हर बार फ़ाइल, URL, ब्रीफ़ दोबारा पेस्ट करता है। फ़िक्स: एक मेमोरी चिप, पिन किया हुआ संदर्भ स्लॉट, या सेशन-स्तर का स्कोप जिसे यूज़र देख और एडिट कर सके।
विनाशकारी रीजेनरेट। रीजेन बटन पिछले आउटपुट को वर्ज़न हिस्ट्री के बिना ओवरराइट कर देता है। यूज़र का सबसे अच्छा जवाब चला गया और वापस नहीं आ सकता। फ़िक्स: रीजेनरेट को ओवरराइट नहीं, ब्रांच बनाइए, जैसे Claude की हिस्ट्री और v0 का वर्ज़न स्टैक पहले से करते हैं।
प्रॉम्प्ट सरफेस के लिए पैटर्न लाइब्रेरी
छह नामित पैटर्न उन प्रॉम्प्ट सरफेस को अलग करते हैं जो प्रिमिटिव लगते हैं, उनसे जो प्लेसहोल्डर लगते हैं। कुछ भी रीडिज़ाइन करने से पहले इस सूची से उठाइए।
स्कोप्ड प्रॉम्प्ट। इनपुट एक स्कोप टोकन लेता है जो तय करता है कि मॉडल किसे छू सकता है। Cursor का @-मेंशन पिकर कैनोनिकल उदाहरण है। यूज़र @layout.tsx टाइप करता है और प्रॉम्प्ट उसी फ़ाइल तक सीमित हो जाता है। v0 में भी ऐसा ही सिलेक्शन-ड्रिवन स्कोप है, जहाँ यूज़र कैनवास का एक हिस्सा क्लिक करता है और प्रॉम्प्ट उसी हिस्से पर काम करता है। स्कोपिंग यूज़र से ज़्यादा लिखवाए बिना धुँधले प्रॉम्प्ट को सटीक बना देती है।
सिलेक्शन-ड्रिवन प्रॉम्प्ट। यूज़र प्रोडक्ट में कुछ चुनता है और प्रॉम्प्ट सरफेस उस चुने हुए को पहले से संदर्भ के रूप में बाँधकर दिखता है। v0 कैनवास सिलेक्शन पर यह करता है। Notion AI हाइलाइट किए टेक्स्ट पर करता है। Linear का AI इश्यू का स्कोप अपने आप उठा लेता है। यूज़र से वह मत बतवाइए जिस पर वह पहले ही उँगली रख चुका है।
इनलाइन टूल टॉगल। सरफेस टूल कॉल को इनपुट फ़्रेम पर टॉगल या चिप की तरह दिखाता है। Cursor एजेंट मोड, एडिट मोड और टूल सेट टॉगल कराता है। Raycast AI कमांड दिखाता है। Vercel AI Playground फ़ंक्शन-कॉलिंग टॉगल दिखाता है। यूज़र को सेंड से पहले पता होता है कि कौन से टूल तैयार हैं।
मेमोरी चिप। एक स्थायी एफ़ोर्डेंस जो दिखाता है कि मॉडल मौजूदा सेशन के बारे में पहले से क्या जानता है। ChatGPT और Claude दोनों इसके रूप शिप करते हैं। चिप एडिट हो सकता है, हटाया जा सकता है और दिखता है, पूरी चाल यही है। छिपी हुई मेमोरी फ़ीचर का भेस पहने डेटा लीक का जोखिम है।
ब्रांचिंग प्रॉम्प्ट। रीजेनरेट बातचीत को ओवरराइट करने की जगह फ़ोर्क करता है। हर ब्रांच एक सेव किया हुआ स्टेट है जिस पर यूज़र लौट सकता है। Claude की कन्वर्सेशन हिस्ट्री यह दिखाती है, v0 जनरेट किए UI का वर्ज़न स्टैक रखता है, Cursor के चैट थ्रेड ब्रांच हो सकते हैं। प्रयोग एक पेड़ बन जाता है, कैसीनो का स्पिन नहीं।
अप्रूवल-गेटेड टूल कॉल। सरफेस किसी विनाशकारी टूल कॉल से पहले रुकता है और यूज़र से अप्रूव, मॉडिफ़ाई या कैंसल करने को कहता है। Cursor का कंपोज़र जोखिम भरे शेल कमांड गेट करता है। Claude Code विनाशकारी ऑपरेशनों को परमिशन सिस्टम के पीछे रखता है। ChatGPT Operator ब्राउज़र में पेमेंट एक्शन गेट करता है। जो क्षण पलटा नहीं जा सकता उसे धीमा कीजिए, और एक्शन चलने से पहले उसे सादे टेक्स्ट में दिखाइए।
ये पैटर्न मिलकर काम करते हैं। एक बढ़िया प्रॉम्प्ट सरफेस आमतौर पर स्कोप्ड, सिलेक्शन-ड्रिवन, इनलाइन टूल और अप्रूवल गेट को एक ही सुसंगत कंपोनेंट में शिप करता है। पैटर्न आपस में तनाव में नहीं, तालमेल में हैं।
सात सवालों वाला प्रॉम्प्ट-सरफेस ऑडिट
किसी भी AI इनपुट को शिप करने से पहले यह चलाइए। अगर तीन या ज़्यादा में फेल हो, तो सरफेस तैयार नहीं है।
- एम्प्टी स्टेट। क्या सरफेस यूज़र को सिखाता है कि क्या टाइप करना है, या उस पर खाली फ़ील्ड पटक देता है?
- सुझाव। क्या सरफेस संदर्भ, हाल की हिस्ट्री या सिलेक्शन के आधार पर अगला प्रॉम्प्ट सुझाता है?
- स्कोप। क्या यूज़र ज़्यादा लिखे बिना प्रॉम्प्ट को फ़ाइल, सिलेक्शन, ब्लॉक या सेशन तक सीमित कर सकता है?
- कॉन्फ़िगरेशन की दृश्यता। क्या मॉडल, टूल और ऑटोनॉमी का स्तर सेंड से पहले दिखते हैं, सेटिंग्स ड्रॉअर में दबे नहीं हैं?
- स्ट्रीमिंग की ईमानदारी। क्या स्ट्रीमिंग आउटपुट असली काम दिखाता है, या यह ऐसा स्पिनर है जिसका कोई मतलब नहीं?
- रोकना और सुधारना। क्या स्ट्रीमिंग के दौरान दिखने वाला स्टॉप बटन है, और बाद में गैर-विनाशकारी रीजेनरेट?
- मेमोरी की पारदर्शिता। क्या यूज़र देख और एडिट कर सकता है कि मॉडल पूरे सेशन में क्या याद रखता है?
जो सरफेस सातों पास करता है वह प्रिमिटिव लगता है। जो तीन या ज़्यादा में फेल होता है वह सर्च बार लगता है। इन दो नतीजों के बीच का फ़ासला ही AI-नेटिव प्रोडक्ट डिज़ाइन को ऊपर से चिपकाए AI से अलग करता है।
जो टीमें प्रॉम्प्ट सरफेस को असली कंपोनेंट की तरह बना रही हैं, वही टीमें इंजीनियरिंग की तरफ़ अपने प्रॉम्प्ट को कंपोनेंट मान रही हैं। अनुशासन का फल एक ही तरह मिलता है।
FAQ
प्रॉम्प्ट सरफेस क्या है?
प्रॉम्प्ट सरफेस पूरा UI क्षेत्र है जिसमें यूज़र प्रॉम्प्ट करता है, कॉन्फ़िगर करता है और जवाब वापस पढ़ता है। इसमें इनपुट, एम्प्टी स्टेट, सुझाव, अटैचमेंट स्लॉट, मॉडल पिकर, टूल टॉगल, सेंड एफ़ोर्डेंस, स्ट्रीमिंग आउटपुट रीजन और रिविज़न कंट्रोल शामिल हैं। इसे टेक्स्टएरिया मानना गलती है। इसे कंपोनेंट मानना बार है।
प्रॉम्प्ट सरफेस चैट इनपुट से कैसे अलग है?
चैट इनपुट बारी-बारी वाला मैसेज बॉक्स है। प्रॉम्प्ट सरफेस कॉन्फ़िगर होने लायक, देखी जा सकने वाली, पलटी जा सकने वाली इंटरैक्शन का कंपोनेंट है। चैट UI बातचीत के लिए ऑप्टिमाइज़ होता है। प्रॉम्प्ट सरफेस लक्ष्य की स्पष्टता, मॉडल पर भरोसे और टास्क थ्रूपुट के लिए ऑप्टिमाइज़ होता है। चैट इनपुट प्रॉम्प्ट सरफेस की एक संभावित अभिव्यक्ति है, पर्यायवाची नहीं।
प्रॉम्प्ट UI डिज़ाइन की सबसे आम गलतियाँ क्या हैं?
बिना सुझाव वाली खाली आयतें, मरे हुए स्ट्रीमिंग स्पिनर, न बदले जा सकने वाले मॉडल, हर प्रॉम्प्ट पर संदर्भ भूल जाने वाले अम्नीशिया सरफेस, अच्छा आउटपुट ओवरराइट करने वाले विनाशकारी रीजेनरेट बटन, और स्ट्रीमिंग के दौरान गायब स्टॉप बटन। हर एक छोटे सरफेस बदलाव से ठीक हो सकता है। इनमें से कोई भी कॉपी से ठीक नहीं होता।
2026 में किन प्रोडक्ट्स के प्रॉम्प्ट सरफेस सबसे अच्छे हैं?
स्कोप्ड प्रॉम्प्ट के लिए Cursor, ब्रांच होने वाली हिस्ट्री और आर्टिफ़ैक्ट पैनल के लिए Claude, सिलेक्शन-ड्रिवन प्रॉम्प्ट के लिए v0, एम्बेडेड प्रॉम्प्ट के लिए Linear AI, स्लैश-मेन्यू एम्प्टी स्टेट के लिए Notion AI, पिकर के अनुशासन के लिए Raycast AI, और कॉन्फ़िगरेशन की दृश्यता के लिए Vercel AI Playground। कोई भी हर पैटर्न पूरी ताकत से शिप नहीं करता, इसीलिए यह कैटेगरी अब भी पूरी तरह खुली है।
इनपुट को ऐसे बनाइए जैसे वही प्रोडक्ट है
प्रॉम्प्ट सरफेस किसी भी AI-नेटिव प्रोडक्ट का सबसे अहम कंपोनेंट है, और ज़्यादातर टीमें इसे अब भी बाद की बात की तरह डिज़ाइन कर रही हैं। एक टेक्स्टएरिया, एक सेंड बटन, एक प्लेसहोल्डर, शिप कर दो। वह स्टैक उसी दिन सड़ गया जिस दिन Cursor और Claude ने बार ऊँचा किया।
इनपुट को प्रिमिटिव मानिए। आठ हिस्से शिप कीजिए। छह फेल्योर मोड से बचिए। छह पैटर्न को जोड़िए। सात सवालों का ऑडिट चलाइए। जो प्रोडक्ट दूसरी तरफ़ से निकलेगा वह 2026 जैसा लगेगा, नए लोगो वाले 2022 के चैट साइडबार जैसा नहीं।
अगर आपको ऐसी टीम चाहिए जो प्रॉम्प्ट सरफेस को टेक्स्टएरिया की जगह पूरे कंपोनेंट की तरह शिप करे, तो Brainy को हायर कीजिए। हम AI-नेटिव प्रोडक्ट UI शुरू से आख़िर तक डिज़ाइन करते हैं, एम्प्टी स्टेट से स्ट्रीमिंग आउटपुट पैनल तक, ट्रस्ट सिग्नल पहले से बनाकर, इससे पहले कि पहला यूज़र एक शब्द भी टाइप करे।
Want a prompt surface that earns the click instead of explaining itself? Brainy ships AI-native product UI end to end, from the empty state to the streaming output panel.
Get Started
