Jak vytvořit rozhraní chatbotu

Autor: Randy Alexander
Datum Vytvoření: 2 Duben 2021
Datum Aktualizace: 16 Smět 2024
Anonim
How to make a WhatsApp Chatbot for Free - Dialogflow
Video: How to make a WhatsApp Chatbot for Free - Dialogflow

Obsah

V polovině 2000s dostali virtuální agenti a chatboti zákaznických služeb velkou pochvalu, i když nebyli příliš konverzační, a pod kapotou se skládali pouze z výměny dat s webovými servery.

V dnešní době, i když existuje obrovské množství příkladů „slabé AI“ (včetně Siri, Alexa, webových vyhledávačů, automatických překladačů a rozpoznávání obličeje) a dalších témat, jako je responzivní webový design, přitahují pozornost, chatboti stále způsobují rozruch . Díky velkým investicím od velkých společností zbývá spousta příležitostí k hacknutí konverzačních rozhraní budoucnosti.

  • Jak navrhnout prostředí chatbotu

Někdy mají špatnou pověst, ale chatboti mohou být užiteční. Nemusí se cítit jako základní náhrada za standardní webový formulář, kde uživatel vyplní vstupní pole a čeká na ověření - může poskytnout konverzaci.


V zásadě vylepšujeme uživatelský komfort, abychom se cítili přirozenější, jako je konverzace s odborníkem nebo přítelem, namísto klikání webovým prohlížečem nebo mobilních gest. Cílem je, aby poskytováním empatických, kontextových odpovědí byla tato technologie začleněna přímo do života lidí.

Podívejte se na video níže nebo čtěte dále a objevte praktický způsob, jak navrhnout a postavit chatbota na základě skutečné aplikace pro příjem projektu v praxi designu služby.

01. Nastavit osobnost

Jelikož tato praxe slouží více než 110 000 členům po celém světě, bylo cílem poskytnout rychlé, pohodlné a přirozené rozhraní, prostřednictvím kterého by interní účastníci mohli požadovat efektivní digitální služby, místo aby museli vyplňovat matoucí formuláře.

Prvním krokem bylo zjistit osobnost chatbota, protože by to představovalo hlas týmu návrhářů služeb pro jeho zúčastněné strany. Stavěli jsme na klíčové práci Aarrona Waltera na designových personách. To významně pomohlo našemu týmu rozvíjet osobnostní rysy robota, který pak určoval zprávy pro pozdravy, chyby a zpětnou vazbu od uživatelů.


Jedná se o choulostivou fázi, protože ovlivňuje to, jak je organizace vnímána. Abychom zajistili, že budeme mít co nejvíce informací, okamžitě jsme zorganizovali workshopy zúčastněných stran, abychom při práci s robotem získali vhodnou osobnost, barvu, typografii, snímky a tok uživatelů.

Poté, co jsme získali všechna potřebná schválení - včetně získání právního poradce - jsme se pustili do převádění archaických formulářů žádostí na řadu otázek, které napodobovaly rozhovor mezi zúčastněnými stranami a zástupcem našeho týmu návrhářských služeb.

02. Použijte RiveScript

Věděli jsme, že se nechceme dostat příliš hluboko do značkovacího jazyka AI pro zpracovatelskou část - prostě jsme toho potřebovali k nastartování zážitku.

RiveScript je jednoduché rozhraní API chatbotu, které je dostatečně snadné se naučit a postačuje pro naše potřeby. Během několika dní jsme měli logiku, abychom dostali požadavek na projekt od robota a analyzovali jej s dostatečnou obchodní logikou, abychom jej ověřili a kategorizovali, aby jej bylo možné poslat prostřednictvím služeb JSON REST do příslušné interní fronty úkolů projektu.


Chcete-li, aby tento základní chatbot fungoval, přejděte do repozitáře RiveScript, klonujte jej a nainstalujte všechny standardní závislosti uzlů. V repo můžete také ochutnat interakce, které můžete přidat pomocí různých ukázkových úryvků.

Dále spusťte složku webového klienta, která změní robota na webovou stránku spuštěním základního serveru Grunt. V tomto okamžiku můžete vylepšit zážitek tak, aby vyhovoval vašim potřebám.

03. Vytvořte mozek svého robota

Dalším krokem je vygenerování „mozku“ našeho robota. Toto je specifikováno v souborech s příponou .RIVE a RiveScript naštěstí již obsahuje základní interakce po vybalení z krabice (například otázky jako „Jak se jmenujete?“, „Jak jste starý?“ A „Jaký je váš oblíbená barva?').

Když spustíte aplikaci webového klienta pomocí správného příkazu Node, soubor HTML se vyzve k jejich načtení.RIVE soubory.

Dále musíme vygenerovat část mozku našeho chatbota, která se bude zabývat požadavky projektu. Naším hlavním cílem je převést výběr otázek přijímání úkolů projektu do běžného rozhovoru.

Například:

  • Dobrý den, jak můžeme pomoci?
  • Skvělé, jak brzy musíme začít?
  • Můžete mi udělat přibližnou představu o vašem rozpočtu?
  • Řekněte mi více o svém projektu ...
  • Jak jsi se o nás dozvěděl?

Typický přístupný webový formulář by vypadal takto:

form action = ""> fieldset> legenda> Type Request: / legend> input id = "option-one" type = "radio" name = "request-type" value = "option-one"> label for = "option- one "> option 1 / label> br> input id =" option-two "type =" radio "name =" request-type "value =" option-two "> label for =" option-two "> option 2 / label> br> input id = "option-three" type = "radio" name = "request-type" value = "option-three"> label for = "option-three"> option 3 / label> br> / fieldset > fieldset> legenda> Timeline: / legend> input id = "one-month" type = "radio" name = "request-timeline" value = "one-month"> label for = "one-month"> 1 month / label> br> input id = "one-three-months" type = "radio" name = "request- timeline" value = "one-three-months"> label for = "one-month"> 1-3 months / štítek> br> vstupní id = "čtyři plus měsíce" type = "radio" name = "požadavek - časová osa" value = "čtyři plus měsíce"> štítek pro = "čtyři plus měsíce"> 4+ měsíce / label> br> / fieldset> br> label for = "request-budget"> Informace o rozpočtu / label> br> textarea id = "request-budget" name = "request-budget-text" lines = "10" cols = „30“> / textarea> br> label for = "request-description"> Popis projektu / label> br> textarea id = "request-description" name = "request- description-text" řádky = "10" cols = "30"> / textarea > br> label for = "request-reference"> Reference / label> br> textarea id = "request-reference" name = "request-reference- text" lines = "10" cols = "30"> / textarea> br > input type = "submit" value = "Submit"> / form>

S webovými formuláři určité vzory velmi dobře známe: kliknete na tlačítko Odeslat, všechna data formuláře se odešlou na jinou stránku, kde se požadavek zpracovává, a pak se s největší pravděpodobností objeví drzá stránka s poděkováním.

S chatboty můžeme převzít interakci s odesláním žádosti a učinit ji smysluplnější.

04. Navrhněte hlas

Chcete-li převést tento formulář na konverzační uživatelské rozhraní obsluhované webovým klientem chatbotu RiveScript, musíme převést informační architekturu z rigidní na fluidní; nebo popisky polí do řetězců uživatelského rozhraní.

Zvažme několik přístupných štítků polí a související tón otázek:

  • Žádost: Jak můžeme pomoci? Nejsem si jistý? Nevadí vám, když se zeptám na pár otázek?
  • Časová osa: Jak brzy musíme začít?
  • Informace o rozpočtu: Můžete mi udělat přibližnou představu o vašem rozpočtu?
  • Popis projektu: Dobře, můžete mi říct shrnutí problému, který má být vyřešen?
  • Odkaz: Kdo vás k nám také doporučil?

Dále musíme převést kód webového formuláře do skriptu AI podle velmi naučitelné logiky zpracování RiveScript pro obousměrné konverzace:

- Jak můžeme pomoci? + *% jak můžeme pomoci - nastavit oblasti = varJistě, nevadí vám, když se zeptám na pár otázek? + *% jistě vám bude vadit, když se zeptám na pár otázek - Jak brzy musím zahájit tento požadavek? + *%, jak brzy musím zahájit tento požadavek - nastavit kdy = var Můžeš mi poskytnout přibližnou představu o svém rozpočtu? + *% můžete mi poskytnout přibližnou představu o svém rozpočtu - nastavte rozpočet = varOK, můžete mi sdělit shrnutí problému, který má být vyřešen, ovlivněných komponent a prostředí nebo celkový popis? + *% ok, můžete mi sdělit souhrn problému, který má být vyřešen, ovlivněné komponenty a prostředí nebo celkový popis - set project = varAlso, kdo vás odkázal na nás? + *% také kdo vás odkázal na nás - nastavit referal = vargreat zde je to, co jsem zatím dostal: n Potřebné služby: získat oblasti> n Je třeba začít: získat kdy> n Hrubý rozpočet: získat rozpočet> n O vašem projektu: získejte projekt> n Doporučeno: získejte doporučení> n a brzy se vám ozveme, existuje ještě něco, s čím vám dnes mohu pomoci? volejte> příjem získejte oblasti> získejte, když> získejte rozpočet> získejte projekt> získejte doporučení> / volejte>

05. Žádost o odeslání

Na rozdíl od standardních proměnných formuláře, které se odesílají na jinou stránku nebo službu ke zpracování, chatboti mohou okamžitě ověřit a odeslat informace zadané uživatelem v okně chatu (nebo mluvené), což znamená, že uživatelé mohou také snadno znovu navštívit dříve zadané hodnoty.

Potřebovali jsme odeslat požadavek uživatele zadaný v uživatelském rozhraní chatbotu prostřednictvím rozhraní JSON REST API na externí server úkolů projektu.

V RiveScript-js můžeme svobodně využívat XMLHttpRequest vznést námitku k podání požadavku téměř současně, protože údaje zadává uživatel:

> příjem objektu javascript var http = nový XMLHttpRequest (); var a = rs.getUservar (rs.currentUser (), "areas"); var b = rs.getUservar (rs.currentUser (), "kdy"); var c = rs.getUservar (rs.currentUser (), "rozpočet"); var d = rs.getUservar (rs.currentUser (), "projekt"); var e = rs.getUservar (rs.currentUser (), "doporučení"); var url = "http: // localhost: 3000 / odeslat"; var params = "areas =" + a + "& when =" + b + "& budget =" + c + "& pro ject =" + d + "& referal =" + e; console.log (parametry); http.open ("POST", url, true); http.setRequestHeader ("Content-type", "application / x- www-form-urlencoded"); http.setRequestHeader ("Připojení", "zavřít"); http.onreadystatechange = function () {// Volání funkce při změně stavu. if (http.readyState == 4 && http.status == 200) {alert (http.responseText); }} http.send (parametry); objekt

06. Nebojte se chatbota

Současné způsoby interakce s počítači za účelem získání informací brzy ustoupí technologii založené na umělé inteligenci, jako jsou chatboti, kde lidé dělají jednoduché hlasové příkazy, jaké jsme viděli u technologií jako Amazon Echo a Google Home.

Komunita webdesignu se nemusí bát - všichni bychom měli využívat přidanou hodnotu této nové technologie.

Pro společnosti, pro které pracuje, by to mohlo změnit hru, protože nabízí plně škálovatelné služby zákazníkům a lepší inteligenci zákazníků.

Tento článek byl původně uveden vsíťový časopis, světově nejprodávanější časopis pro webové designéry a vývojáře. Přihlaste se k odběru zde.

Čerstvé Články
Čaroděj ze země Oz, jakého jste ještě nikdy neviděli
Číst

Čaroděj ze země Oz, jakého jste ještě nikdy neviděli

Čaroděj ze země Oz je jedním z nejoblíbenějších příběhů na větě. Publikovány v řadě různých formátů v průběhu let, j ou to knižní ilu trace, které nám...
5 z nejžhavějších trendů typografie
Číst

5 z nejžhavějších trendů typografie

Trendy j ou nevyhnutelnou oučá tí každé de ignové di ciplíny. A zatímco ob edantně může být ledování trendů kontraproduktivní - je těžší vytvořit...
Vytvořte efekt pozadí paralaxy ovládaný myší
Číst

Vytvořte efekt pozadí paralaxy ovládaný myší

Weby po ouváním paralaxy j ou i nadále populární z nějakého důvodu: vytvářejí pro uživatele příjemné a poutavé procházení webu. Už j me...