Чатбот интерфейсін қалай құруға болады

Автор: Randy Alexander
Жасалған Күн: 2 Сәуір 2021
Жаңарту Күні: 16 Мамыр 2024
Anonim
Чатбот интерфейсін қалай құруға болады - Шығармашылық
Чатбот интерфейсін қалай құруға болады - Шығармашылық

Мазмұны

2000-шы жылдардың ортасында виртуалды агенттер мен клиенттерге қызмет көрсету чат-боттары олармен көп сөйлеспейтініне қарамастан, көптеген сүйсінулерге ие болды және капюшон астында олар тек веб-серверлермен мәліметтер алмасудан құралды.

Қазіргі уақытта «әлсіз AI» мысалдары көп болса да (Siri, Alexa, веб-іздеу жүйелері, автоматты аудармашылар және тұлғаны тану) және басқа веб-дизайн сияқты тақырыптар назар аударады, чат-боттар әлі де үлкен шу тудыруда . Ірі компаниялардың үлкен инвестицияларымен болашақтағы интерактивті интерфейстерді бұзудың көптеген мүмкіндіктері қалады.

  • Чатбот тәжірибесін қалай құруға болады

Кейде олар жаман беделге ие болады, бірақ чат-боттар пайдалы болуы мүмкін. Олар пайдаланушы енгізу өрістерін толтыратын және тексеруді күтетін стандартты веб-форманың негізгі ауыстыруы сияқты сезінудің қажеті жоқ - олар сөйлесу тәжірибесін ұсына алады.


Негізінен біз веб-шолғышты немесе сілтемелерді немесе мобильді қимылдарды емес, маманмен немесе доспен сөйлесу сияқты табиғи сезіну үшін пайдаланушы тәжірибесін жақсартамыз. Мұндағы мақсат эмпатикалық, контексттік жауаптар беру арқылы бұл технология адамдардың өміріне тікелей енеді.

Төмендегі бейнені қараңыз немесе сервисті жобалау тәжірибесінде жобаны қабылдаудың нақты қосымшасына негізделген чатботты құрастырудың және құрудың практикалық әдісін табу үшін оқыңыз.

01. Тұлғаны орнатыңыз

Бұл тәжірибе бүкіл әлем бойынша 110 000-нан астам мүшеге қызмет ететіндіктен, мақсат тез, ыңғайлы және табиғи интерфейсті қамтамасыз ету болды, сол арқылы ішкі мүдделі тараптар түсініксіз формаларды толтырудың орнына тиімді цифрлық қызметтерді сұрай алады.

Бірінші қадам чатботтың жеке басын қалыптастыру болды, өйткені бұл оның дизайны тобының мүдделі тараптарға дауысын білдіреді. Біз Aarron Walter-тің дизайн персоналына арналған негізгі жұмысын жасадық. Бұл біздің командаға боттың жеке қасиеттерін дамытуға көмектесті, содан кейін сәлемдесу, қателіктер және пайдаланушылардың пікірлері туралы хабарламалар анықталды.


Бұл нәзік кезең, өйткені бұл ұйымды қалай қабылдауға әсер етеді. Бізде мүмкіндігінше көбірек ақпарат бар екендігіне көз жеткізу үшін біз дереу мүдделі тараптардың шеберханаларын құрып, ботпен байланыс орнатқан кезде жеке тұлға, түс, типография, бейнелер мен пайдаланушының ағымын қадағалаймыз.

Біз барлық қажетті мақұлдауды алғаннан кейін, соның ішінде заң консультациясына жүгіну арқылы біз археикалық сұраныстардың формаларын мүдделі тараптар мен дизайнерлік қызмет тобымыздың өкілі арасындағы сұхбатты имитациялайтын бірнеше кері сұрақтарға айналдыруды бастадық.

02. RiveScript қолданыңыз

Біз өңдеу бөлігі үшін жасанды интеллектуалды тілді белгілеу тіліне терең енгіміз келмейтінін білдік - тәжірибені тез бастау үшін бізге жеткілікті.

RiveScript - қарапайым chatbot API, оны үйренуге жеткілікті және біздің қажеттіліктерімізге жеткілікті. Бірнеше күн ішінде бізде боттан жоба сұранысын қабылдау логикасы болды және оны растауға және санаттауға жеткілікті бизнес-логикамен талдадық, сондықтан оны JSON REST қызметтері арқылы жобаның тиісті ішкі тапсырмалар кезегіне жіберуге болады.


Бұл негізгі чат-боттың жұмысын қамтамасыз ету үшін RiveScript репосына өтіп, оны клондап, барлық стандартты түйін тәуелділіктерін орнатыңыз. Репо-да сіз әртүрлі мысалдар фрагменттерімен қосуға болатын өзара әрекеттесудің дәмін біле аласыз.

Содан кейін, негізгі Grunt серверін іске қосу арқылы ботты веб-параққа айналдыратын веб-клиенттік қалтаны іске қосыңыз. Осы кезде сіз өз қажеттіліктеріңізге сәйкес тәжірибені жетілдіре аласыз.

03. Боттың миын жасаңыз

Келесі қадам - ​​боттың «миын» қалыптастыру. Бұл .RIVE кеңейтімі бар файлдарда көрсетілген, және шүкір, RiveScript қораптың ішіндегі негізгі өзара әрекеттесулермен бірге келеді (мысалы, «сіздің атыңыз кім?», «Жасыңыз қанша?» Және «сіз кімсіз?» сүйікті түс? ').

Тиісті Node пәрменін қолданып веб-клиент қосымшасын іске қосқан кезде, HTML файлына оларды жүктеу тапсырылады.ТІРУ файлдар.

Әрі қарай біз чатбот миымыздың жобалық сұраныстармен айналысатын бөлігін жасауымыз керек. Біздің басты мақсатымыз - қабылдау сұрақтарына жауап беретін жобаның таңдауын тұрақты әңгімеге айналдыру.

Мәселен, мысалы:

  • Сәлеметсіз бе, біз қалай көмектесе аламыз?
  • Керемет, біз қанша уақыттан кейін бастауымыз керек?
  • Маған өз бюджетіңіз туралы нақты түсінік бере аласыз ба?
  • Маған өз жобаңыз туралы көбірек айтыңыз ...
  • Біз туралы қалай естідіңіз?

Әдеттегі қол жетімді веб-форма келесідей болады:

форма әрекеті = «»> өрістер жиынтығы> легенда> сұраныс түрі: / легенда> енгізу id = «опция-бір» тип = «радио» аты = «сұраныс-тип» мән = «опция-бір»> белгі үшін = «опция- one «> option 1 / label> br> input id =» option-two «type =» radio «name =» request-type «value =» option-two «> label for =» option-two «> нұсқа 2 / label> br> input id = «option-three» type = «radio» name = «request-type» value = «option-three»> label for = «option-three»> option 3 / label> br> / fieldets > өрістер жиынтығы> аңыз> Уақыт шкаласы: / аңыз> енгізу id = «бір ай» type = «radio» name = «request-timeline» value = «one-month»> label for = «one-month»> 1 ай / label> br> input id = «one-three-months» type = «radio» name = «request- timeline» value = «one-three-months»> label for = «one-month»> 1-3 ай / label> br> input id = «four-plus-months» type = «radio» name = «request- timeline» value = «four-plus-months»> label for = «four-plus-months»> 4+ ай / label> br> / fieldset> br> label for = «request-budget»> Бюджеттік ақпарат / label> br> textarea id = «request-budget» name = «request-budget-text» rows = «10» cols = «30»> / textarea> br> label for = «request-description»> жобаның сипаттамасы / label> br> textarea id = «request-description» name = «request- description-text» rows = «10» cols = «30»> / textarea > br> label for = «request-reference»> Reference / label> br> textarea id = «request-reference» name = «request-reference- text» rows = «10» cols = «30»> / textarea> br > input type = «submit» value = «Submit»> / form>

Веб-пішіндермен біз белгілі үлгілермен таныспыз: Жіберу батырмасын басасыз, барлық формалық мәліметтер сұраныс өңделетін басқа бетке жіберіледі, содан кейін сыпайы рахмет беті ашылады.

Чот-боттар арқылы біз сұрау жіберудің өзара әрекеттесуін қабылдап, оны мағыналы ете аламыз.

04. Дауысты жобалаңыз

Бұл форманы RiveScript-тің chatbot веб-клиентінде қызмет ететін сөйлесу интерфейсіне түрлендіру үшін біз ақпараттық архитектураны қатаңнан сұйықтыққа түрлендіруіміз керек; немесе интерфейстік жолдардағы өріс белгілері.

Бірнеше қол жетімді өріс белгілерін және оларға қатысты сұрақтар тонын қарастырайық:

  • Сұраныс: Біз қалай көмектесе аламыз? Сенімді емеспін? Мен бірнеше сұрақ қойсам қарсы емессіз бе?
  • Хронология: Бізге қанша уақыттан кейін бастау керек?
  • Бюджеттік ақпарат: Маған өз бюджетіңіз туралы нақты түсінік бере аласыз ба?
  • Жоба Сипаттамасы: Жарайды, шешілетін мәселенің қысқаша мазмұнын айта аласыз ба?
  • Анықтама: Сондай-ақ, сізді кім бізге бағыттады?

Содан кейін біз RiveScript-тің екі жақты сөйлесулер үшін өте ыңғайлы өңдеу логикасына сүйене отырып, веб-форманың кодын AI сценарийіне ауыстыруымыз керек:

- Біз қалай көмектесе аламыз? + *% қалай көмектесе аламыз - бағыттарды орнатыңыз = varSure, егер мен сіздерге бірнеше сұрақ қойсам қарсы емессіздер ме? + *% мен бірнеше сұрақ қойсам қарсы емессіз бе - Мен бұл сұранысты қанша уақыттан кейін бастауым керек? + *% мен бұл сұранысты қанша уақыттан кейін бастауым керек - = varCet мәнін орнатыңыз, маған сіздің бюджетіңіз туралы нақты түсінік бере аласыз ба? + *% маған бюджет туралы нақты түсінік бере аласыз ба - set budget = varOK, шешілетін проблеманың қысқаша мазмұны, әсер ететін компоненттер мен орталар немесе жалпы сипаттама бере аласыз ба? + *% ok, маған шешілетін проблеманың қысқаша мазмұнын және әсер ететін компоненттерді немесе қоршаған ортаны немесе жалпы сипаттаманы айта аласыз ба - set project = varAlso, кім сізді бізге бағыттады? + *%, сондай-ақ сізді кім бізге бағыттады - referal = vargreat мұнда орнатыңыз, мен осы уақытқа дейін алдым: n Қызметтер қажет: аймақтарды алу> n Басталу керек: қашан жету керек> n Дөрекі бюджет: бюджет алу> n Сіздің жобаңыз туралы: жобаны алу> n Анықтама: сілтеме алу> n және жақын арада байланысқа шығамын, сізге бүгін көмектесе алатын тағы бір нәрсе бар ма? қоңырау> қабылдау аймақтары> қашан алу> бюджет алу> жоба алу> сілтеме алу> / қоңырау шалу>

05. Ұсыну туралы өтініш

Стандартты форма айнымалыларының басқа параққа немесе қызметке өңдеу үшін жіберілуіне қарағанда, чат-боттар қолданушы енгізген ақпаратты дереу сөйлесу терезесіне (немесе айтылған) тексере алады және жібере алады, демек, қолданушылар бұрын енгізілген мәндерді оңай қайта қарайды.

Чат-бот интерфейсіне енгізілген пайдаланушының сұранысын JSON REST API арқылы жобаның сыртқы тапсырма серверіне жіберу керек болды.

RiveScript-js-де біз an XMLHttpRequest деректерді пайдаланушы енгізгендіктен, сұранысты бір уақытта дерлік жіберуге қарсы болыңыз:

> объект қабылдау javascript var 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 (), «жоба»); var e = rs.getUservar (rs.currentUser (), «сілтеме»); var url = «http: // localhost: 3000 / send»; var params = «fields =» + a + «& when =» + b + «& budget =» + c + «& pro ject =» + d + «& referal =» + e; console.log (параметрлер); http.open («POST», url, шын); http.setRequestHeader («Content-type», «application / x- www-form-urlencoded»); http.setRequestHeader («Connection», «close»); http.onreadystatechange = function () {// күй өзгерген кезде функцияны шақырыңыз. егер (http.readyState == 4 && http.status == 200) {ескерту (http.responseText); }} http.send (params); объект

06. Чатботтан қорықпаңыз

Көп ұзамай ақпарат алу үшін компьютерлермен өзара әрекеттесудің қазіргі кездегі жолдары жасанды интеллектке негізделген чат-боттарға негізделген технологияға ие болады, мұнда адамдар қарапайым дауыстық командалар жасайды, мысалы, біз Amazon Echo және Google Home сияқты технологиялармен танысқанбыз.

Веб-дизайн қауымдастығы қорықпауы керек - біз бәріміз осы жаңа технологияның қосымша құнын қабылдағанымыз жөн.

Бұл өзі жұмыс істейтін компаниялар үшін толықтай масштабталатын қызмет көрсетуді және тұтынушылардың интеллектісін жақсартуды ұсынатын ойын ауыстырғыш болуы мүмкін.

Бұл мақала бастапқыда көрсетілгентор журналы, веб-дизайнерлер мен әзірлеушілерге арналған әлемдегі ең көп сатылатын журнал. Мұнда жазылыңыз.

Біздің Таңдауымыз
Дориді табу өнері
Ары Қарай Оқу

Дориді табу өнері

Әлемдегі ең әйгілі студиялардың бірінің әдемі туындыларымен қамтылған Art of Finding Dory - бұл терең мәліметтермен толтырылған қызықты кітап. Дамудың барлық салаларындағы өнер туындыларының байлығы Ә...
Өзіңіздің HTML5 3D қозғалтқышыңызды жасаңыз
Ары Қарай Оқу

Өзіңіздің HTML5 3D қозғалтқышыңызды жасаңыз

Интернетте 3D үшін бірнеше дайын шешімдер бар. Алайда, бұл шешімдер барлық сайттарға сәйкес келмейді, кейде сізге өзіңіздің код базаңыздың қыр-сырын білуден болатын толық бақылау қажет. Интерактивті н...
Сіздің әлеміңізді дүр сілкіндіретін қағаз өнері
Ары Қарай Оқу

Сіздің әлеміңізді дүр сілкіндіретін қағаз өнері

Соңғы бірнеше айда біз қағаз өнерінің шабыттандыратын үлгілерін кездестірдік және кейбір жаңа туындыларға әрқашан қатысамыз. Zim & Zou - Нансиде орналасқан, дизайнның әр түрлі салаларын зерттейтін...