चैटबॉट इंटरफ़ेस कैसे बनाएं

लेखक: Randy Alexander
निर्माण की तारीख: 2 अप्रैल 2021
डेट अपडेट करें: 16 मई 2024
Anonim
चैटबॉट इंटरफ़ेस कैसे बनाएं
वीडियो: चैटबॉट इंटरफ़ेस कैसे बनाएं

विषय

2000 के दशक के मध्य में, वर्चुअल एजेंटों और ग्राहक सेवा चैटबॉट्स को बहुत अधिक प्रशंसा मिली, भले ही वे बहुत संवादी नहीं थे, और हुड के तहत वे केवल वेब सर्वर के साथ डेटा एक्सचेंजों से बने थे।

आजकल, भले ही 'कमजोर एआई' (सिरी, एलेक्सा, वेब सर्च इंजन, स्वचालित अनुवादक और चेहरे की पहचान सहित) के उदाहरण बड़ी संख्या में मौजूद हैं और अन्य विषय जैसे उत्तरदायी वेब डिज़ाइन सुर्खियों में हैं, चैटबॉट अभी भी हलचल पैदा कर रहे हैं। . बड़ी कंपनियों के बड़े निवेश के साथ, भविष्य के संवादी इंटरफेस को हैक करने के बहुत सारे अवसर हैं।

  • चैटबॉट अनुभव कैसे डिज़ाइन करें

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


अनिवार्य रूप से हम वेब ब्राउज़र पॉइंट-एंड-क्लिक या मोबाइल जेस्चर के बजाय, किसी विशेषज्ञ या मित्र के साथ बातचीत करने जैसे अधिक स्वाभाविक महसूस करने के लिए उपयोगकर्ता अनुभव को बढ़ा रहे हैं। उद्देश्य यह है कि सहानुभूतिपूर्ण, प्रासंगिक प्रतिक्रियाएं प्रदान करके, यह तकनीक सीधे लोगों के जीवन में अंतर्निहित हो जाएगी।

सेवा डिज़ाइन अभ्यास में वास्तविक प्रोजेक्ट-इनटेक एप्लिकेशन के आधार पर चैटबॉट को डिज़ाइन करने और बनाने का एक व्यावहारिक तरीका खोजने के लिए नीचे दिया गया वीडियो देखें या पढ़ें।

01. एक व्यक्तित्व सेट करें

चूंकि यह प्रथा विश्व स्तर पर 110,000 से अधिक सदस्यों को सेवा प्रदान करती है, लक्ष्य एक त्वरित, सुविधाजनक और प्राकृतिक इंटरफ़ेस प्रदान करना था जिसके माध्यम से आंतरिक हितधारक भ्रमित करने वाले फॉर्म भरने के बजाय प्रभावी डिजिटल सेवाओं का अनुरोध कर सकते थे।

पहला कदम चैटबॉट के व्यक्तित्व को स्थापित करना था, क्योंकि यह अपने हितधारकों के लिए सेवा डिजाइन टीम की आवाज का प्रतिनिधित्व करेगा। हमने डिजाइन व्यक्तियों पर आरोन वाल्टर के मौलिक कार्य पर निर्माण किया। इसने हमारी टीम को बॉट के व्यक्तित्व लक्षणों को विकसित करने में बहुत मदद की, जिसने तब बधाई, त्रुटियों और उपयोगकर्ता प्रतिक्रिया के लिए संदेशों को निर्धारित किया।


यह एक नाजुक चरण है, क्योंकि यह प्रभावित करता है कि संगठन को कैसे माना जाता है। यह सुनिश्चित करने के लिए कि हमारे पास यथासंभव अधिक से अधिक जानकारी है, हमने बॉट के साथ संलग्न होने पर उपयुक्त व्यक्तित्व, रंग, टाइपोग्राफी, इमेजरी और उपयोगकर्ता के प्रवाह को ठीक करने के लिए तुरंत हितधारक कार्यशालाएं स्थापित कीं।

कानूनी सलाह लेने सहित - सभी आवश्यक अनुमोदन प्राप्त करने के बाद - हमने पुराने अनुरोध फ़ॉर्म को आगे और पीछे के प्रश्नों की एक श्रृंखला में बदलने के लिए निर्धारित किया है जो हितधारकों और हमारी डिज़ाइन सेवा टीम के प्रतिनिधि के बीच बातचीत की नकल करते हैं।

02. राइवस्क्रिप्ट का प्रयोग करें

हमें पता था कि हम प्रसंस्करण भाग के लिए एआई मार्कअप भाषा में बहुत गहराई तक नहीं जाना चाहते हैं - हमें अनुभव को शुरू करने के लिए पर्याप्त आवश्यकता है।

RiveScript एक साधारण चैटबॉट API है जो सीखने में काफी आसान है और हमारी आवश्यकताओं के लिए पर्याप्त है। कुछ दिनों के भीतर हमारे पास बॉट से एक परियोजना अनुरोध को स्वीकार करने के लिए तर्क था, और इसे मान्य और वर्गीकृत करने के लिए पर्याप्त व्यावसायिक तर्क के साथ पार्स किया ताकि इसे JSON REST सेवाओं के माध्यम से उपयुक्त आंतरिक प्रोजेक्ट टास्किंग कतार में भेजा जा सके।


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

इसके बाद, वेब-क्लाइंट फ़ोल्डर चलाएं, जो मूल ग्रंट सर्वर चलाकर बॉट को वेब पेज में बदल देता है। इस बिंदु पर आप अपनी आवश्यकताओं के अनुरूप अनुभव को बढ़ा सकते हैं।

03. अपने बॉट के दिमाग को उत्पन्न करें

अगला कदम हमारे बॉट का 'ब्रेन' तैयार करना है। यह .RIVE एक्सटेंशन वाली फाइलों में निर्दिष्ट है, और शुक्र है कि RiveScript पहले से ही बुनियादी इंटरैक्शन के साथ आता है (उदाहरण के लिए, 'आपका नाम क्या है?', 'आप कितने साल के हैं?' और 'आपका क्या है?') जैसे प्रश्न हैं। पसंदीदा रंग?')।

जब आप उचित नोड कमांड का उपयोग करके वेब-क्लाइंट ऐप शुरू करते हैं, तो HTML फ़ाइल को इन्हें लोड करने का निर्देश दिया जाता हैराइव फ़ाइलें।

आगे हमें अपने चैटबॉट के दिमाग का वह हिस्सा तैयार करना होगा जो परियोजना अनुरोधों से निपटेगा। हमारा मुख्य लक्ष्य प्रोजेक्ट टास्किंग इंटेक प्रश्नों के चयन को नियमित बातचीत में बदलना है।

तो, उदाहरण के लिए:

  • हैलो, हम कैसे मदद कर सकते हैं?
  • बढ़िया, हमें कितनी जल्दी शुरू करने की ज़रूरत है?
  • क्या आप मुझे अपने बजट के बारे में कुछ जानकारी दे सकते हैं?
  • मुझे अपने प्रोजेक्ट के बारे में और बताएं ...
  • आपको हमारे बारे में कैसे पता चला?

एक सामान्य सुलभ वेब फॉर्म इस तरह दिखेगा:

प्रपत्र क्रिया = ""> फ़ील्डसेट> किंवदंती> अनुरोध प्रकार: / किंवदंती> इनपुट आईडी = "विकल्प-एक" प्रकार = "रेडियो" नाम = "अनुरोध-प्रकार" मान = "विकल्प-एक"> लेबल के लिए = "विकल्प- one">विकल्प 1/लेबल>br> इनपुट आईडी="विकल्प-दो" प्रकार="रेडियो" नाम="अनुरोध-प्रकार" मान="विकल्प-दो"> के लिए लेबल="विकल्प-दो">विकल्प 2/ लेबल> br> इनपुट आईडी = "विकल्प-तीन" प्रकार = "रेडियो" नाम = "अनुरोध-प्रकार" मान = "विकल्प-तीन"> लेबल के लिए = "विकल्प-तीन"> विकल्प 3/लेबल> br> / फ़ील्डसेट > फ़ील्डसेट> लेजेंड> समयरेखा:/किंवदंती> इनपुट आईडी = "एक महीने" प्रकार = "रेडियो" नाम = "अनुरोध-समयरेखा" मान = "एक महीने"> लेबल = "एक महीने"> 1 महीने / लेबल> br> इनपुट आईडी = "एक-तीन-महीने" प्रकार = "रेडियो" नाम = "अनुरोध- समयरेखा" मान = "एक-तीन-महीने"> लेबल = "एक-महीने"> 1-3 महीने / लेबल> br> इनपुट आईडी = "चार-प्लस-महीने" प्रकार = "रेडियो" नाम = "अनुरोध- समयरेखा" मान = "चार-प्लस-महीने"> लेबल = "चार-प्लस-महीने"> 4+ महीने /लेबल>br> /फ़ील्डसेट> br> के लिए लेबल="अनुरोध-बजट">बजट जानकारी/लेबल>br> textarea id="अनुरोध-बजट" नाम="अनुरोध-बजट-पाठ" पंक्तियां="10" cols= "30"> / textarea> br> के लिए लेबल = "अनुरोध-विवरण"> परियोजना विवरण / लेबल> br> textarea id = "अनुरोध-विवरण" नाम = "अनुरोध- विवरण-पाठ" पंक्तियाँ = "10" cols = "30"> / पाठ क्षेत्र > br> के लिए लेबल = "अनुरोध-संदर्भ"> संदर्भ/लेबल> br> textarea id = "अनुरोध-संदर्भ" नाम = "अनुरोध-संदर्भ- पाठ" पंक्तियाँ = "10" cols = "30"> / textarea> br > इनपुट प्रकार = "सबमिट" मान = "सबमिट करें"> / फॉर्म>

वेब फ़ॉर्म के साथ, हम कुछ पैटर्न से बहुत परिचित हैं: आप सबमिट बटन पर क्लिक करते हैं, सभी फ़ॉर्म डेटा दूसरे पेज पर भेज दिए जाते हैं जहां अनुरोध संसाधित होता है, और फिर सबसे अधिक संभावना है कि एक चुटीला धन्यवाद पृष्ठ पॉप अप होता है।

चैटबॉट के साथ, हम एक अनुरोध सबमिट करने की बातचीत करने में सक्षम हैं, और इसे और अधिक सार्थक बनाते हैं।

04. एक आवाज डिजाइन करें

इस फ़ॉर्म को RiveScript के चैटबॉट वेब क्लाइंट में पेश किए गए एक संवादी उपयोगकर्ता इंटरफ़ेस में बदलने के लिए, हमें सूचना संरचना को कठोर से तरल में बदलने की आवश्यकता है; या UI स्ट्रिंग्स में फ़ील्ड लेबल।

आइए कुछ सुलभ फ़ील्ड लेबल और उनके संबंधित प्रश्न स्वर पर विचार करें:

  • निवेदन: हम आपकी सहायता किस तरह से कर सकते है? पक्का नहीं? अगर मैं कुछ प्रश्न पूछूं तो क्या आपको कोई आपत्ति है?
  • समयरेखा: हमें कितनी जल्दी आरंभ करने की आवश्यकता है?
  • बजट की जानकारी: क्या आप मुझे अपने बजट के बारे में कुछ जानकारी दे सकते हैं?
  • परियोजना विवरण: ठीक है, क्या आप मुझे हल की जाने वाली समस्या का सारांश बता सकते हैं?
  • संदर्भ: इसके अलावा, आपको हमारे पास किसने भेजा?

आगे हमें वेब फॉर्म के कोड को एआई स्क्रिप्ट में बदलने की जरूरत है, दो-तरफा बातचीत के लिए रिवेस्क्रिप्ट के बहुत सीखने योग्य प्रसंस्करण तर्क का पालन करते हुए:

- हम आपकी सहायता किस तरह से कर सकते है? + *% हम कैसे मदद कर सकते हैं - क्षेत्र निर्धारित करें=varSure, क्या आपको कोई आपत्ति है अगर मैं कुछ प्रश्न पूछूं? + *% यदि मैं कुछ प्रश्न पूछूं तो क्या आपको कोई आपत्ति है - मुझे यह अनुरोध कितनी जल्दी शुरू करने की आवश्यकता है? + *% मुझे इस अनुरोध को कितनी जल्दी शुरू करने की आवश्यकता है - सेट कब = var क्या आप मुझे अपने बजट का अनुमान दे सकते हैं? + *% क्या आप मुझे अपने बजट का मोटा अंदाजा दे सकते हैं - बजट सेट करें = varOK, क्या आप मुझे हल की जाने वाली समस्या का सारांश, घटक और वातावरण प्रभावित, या समग्र विवरण बता सकते हैं? +* % ठीक है, क्या आप मुझे समस्या का एक सारांश बता सकते हैं जो कि हल किए जाने वाले घटकों और वातावरण को प्रभावित करता है या एक समग्र विवरण - सेट प्रोजेक्ट = varइसके अलावा, आपको हमारे पास किसने भेजा है? +* % भी जिन्होंने आपको हमारे पास भेजा - रेफरल सेट करें = vargreat यहाँ मुझे अब तक क्या मिला है: सेवाओं की आवश्यकता है: क्षेत्र प्राप्त करें> शुरू करने की आवश्यकता है: कब प्राप्त करें> रफ बजट: बजट प्राप्त करें> आपके प्रोजेक्ट के बारे में: प्रोजेक्ट प्राप्त करें> इसके द्वारा संदर्भित: रेफ़रल प्राप्त करें> और शीघ्र ही संपर्क करेंगे, क्या आज मैं आपकी कुछ और मदद कर सकता हूँ? कॉल> सेवन क्षेत्र प्राप्त करें> कब प्राप्त करें> बजट प्राप्त करें> परियोजना प्राप्त करें> रेफरल प्राप्त करें> / कॉल>

05. अनुरोध प्रस्तुत करना

संसाधित करने के लिए किसी अन्य पृष्ठ या सेवा पर भेजे जाने वाले मानक प्रपत्र चर के विपरीत, चैटबॉट उपयोगकर्ता द्वारा चैट विंडो (या बोली जाने वाली) में दर्ज की गई जानकारी को तुरंत सत्यापित और सबमिट कर सकते हैं, जिसका अर्थ है कि उपयोगकर्ता पहले से दर्ज किए गए मानों को आसानी से फिर से देख सकते हैं।

हमें JSON REST API के माध्यम से चैटबॉट UI में दर्ज किए गए उपयोगकर्ता के अनुरोध को बाहरी प्रोजेक्ट टास्किंग सर्वर पर भेजने की आवश्यकता है।

RiveScript-js में हम an . का उपयोग करने के लिए स्वतंत्र हैं XMLHttpRequest लगभग एक साथ अनुरोध सबमिट करने पर आपत्ति, क्योंकि उपयोगकर्ता द्वारा डेटा दर्ज किया जाता है:

> वस्तु सेवन जावास्क्रिप्ट वर http = नया XMLHttpRequest (); var a = rs.getUservar(rs.currentUser (), "क्षेत्र"); var b = rs.getUservar(rs.currentUser (), "कब"); var c = rs.getUservar(rs.currentUser (), "बजट"); var d = rs.getUservar(rs.currentUser (), "प्रोजेक्ट"); वर ई = rs.getUservar(rs.currentUser (), "रेफ़रल"); var url = "http://localhost:3000/send"; var params = "क्षेत्रों ="+a+"&कब ="+b+"&बजट ="+c+"&pro ject="+d+"&referal="+e; कंसोल.लॉग (पैरा); http.open ("पोस्ट", यूआरएल, सच); http.setRequestHeader ("सामग्री-प्रकार", "एप्लिकेशन/एक्स- www-form-urlencoded"); http.setRequestHeader ("कनेक्शन", "करीब"); http.onreadystatechange = function() {// किसी फंक्शन को कॉल करें जब स्टेट बदल जाए। अगर (http.readyState == 4 && http.status == 200) {अलर्ट (http.responseText); } } http.send(params); वस्तु

06. चैटबॉट से न डरें

जल्द ही, सूचना प्राप्त करने के लिए कंप्यूटर के साथ बातचीत करने के मौजूदा तरीके चैटबॉट्स जैसी एआई-आधारित तकनीक में आ जाएंगे, जहां लोग केवल साधारण वॉयस कमांड बनाते हैं, जैसा कि हमने अमेज़ॅन इको और Google होम जैसी तकनीक के साथ देखा है।

वेब डिज़ाइन समुदाय को डरने की ज़रूरत नहीं है - हम सभी को इस नई तकनीक के अतिरिक्त मूल्य को अपनाना चाहिए।

यह उन कंपनियों के लिए गेम-चेंजर हो सकता है जिनके लिए यह काम करता है, पूरी तरह से स्केलेबल ग्राहक सेवा और बेहतर ग्राहक खुफिया प्रदान करता है।

यह लेख मूल रूप से में चित्रित किया गया थाशुद्ध पत्रिका, वेब डिजाइनरों और डेवलपर्स के लिए दुनिया की सबसे ज्यादा बिकने वाली पत्रिका। यहां सदस्यता लें.

दिलचस्प
दिन का फ़ॉन्ट: सत्तर का दशक
डिस्कवर

दिन का फ़ॉन्ट: सत्तर का दशक

हम टाइपोग्राफी के बहुत बड़े प्रशंसक हैं और हमेशा नए और रोमांचक टाइपफेस की तलाश में रहते हैं, चाहे वह मुफ्त फोंट हों या सबसे अच्छे फोंट के लिए। इसलिए, यदि आपको अपने वर्तमान प्रोजेक्ट के लिए एक फ़ॉन्ट क...
पारभासी वैम्पायर की त्वचा को रंगने के लिए 3 टिप्स
डिस्कवर

पारभासी वैम्पायर की त्वचा को रंगने के लिए 3 टिप्स

देखने के माध्यम से, पीला त्वचा खराब स्वास्थ्य या बीमारी का प्रतीक है, इसलिए यह पिशाच को जमीन पर सूट करता है। किसी मृत शरीर की पहचान उसकी शीतलता से होती है। नीला शीतलता का सामान्य रूप से पहचाना जाने वा...
डिजाइनर और क्लाइंट के बीच का अंतर सामने आया
डिस्कवर

डिजाइनर और क्लाइंट के बीच का अंतर सामने आया

सबसे अनुभवी क्रिएटिव डायरेक्टर से लेकर कॉलेज से नए ग्राफिक डिज़ाइन ग्रेजुएट तक हर कोई जानता है कि क्रिएटिव और क्लाइंट हमेशा एक-दूसरे से नज़र नहीं मिलाते हैं। जबकि डिज़ाइनर नवीन विचारों को अत्यधिक महत्...