Rakenna AI-powered chatbot

Sep 11, 2025
Miten tehdään
An illustration showing an android with an electronic brain in front of a globe marked with symbols indicated technological advancement, such as binary code, molecules and communications relays.

Keinotekoinen älykkyys (AI) antaa meille mahdollisuuden luoda uusia tapoja tarkastella olemassa olevia ongelmia, jotka käsittelevät ympäristöstrategioita siitä, miten opimme. Projektit - onko sovellukset, verkkosivustot tai pelit - voivat hyödyntää AI: tä tekemään niistä enemmän tarkempaa, helpompaa käyttää ja olla arvokkaampia tuloksia. Yksi tällainen menetelmä käsittää luonnollisen kielen chatbotin luomisen, jotta käyttäjät voivat olla vuorovaikutuksessa sivustosi kanssa.

Jos haluat luoda ensimmäisen chatbot, käytämme Googlen uutta dialogflow-työkaluja. Se valjaat tehokkaan koneen oppimisen sekä puheen ja tekstin. Se voidaan sisällyttää suoraan verkkosivustoosi widgetiksi tai räätälöity tarpeisiisi.

Jos olet prosessissa uuden sivuston suunnittelussa, tarvitset neuvoja kaikesta ihanteellisesta Verkkosivuston rakentaja johon sivujen ylläpito Palvelu valitsemalla, niin tarkista oppaat. Uuden suunnittelun järjestelmän luominen? Tallenna se kunnolla pilvivarasto Joten se on käytettävissä koko tiimisi. Nyt voit luoda chatbot ...

01. Luo tili

Mene Dialogflow.com ja luo tili. Kirjaudu sisään ja hyväksy oikeudet, jotta valintaikkuna on pääsy tilillesi.

02. Luo agentti

Dialogflow käyttää termiä "agentti" edustamaan AI: n tapauksia. Ajattele asiamiehen virtuaalisena älykkyydenä, jonka luot. Sinulla voisi olla monia asiamiehiä työskentelevät sinulle, joista jokaisella on oma persoonallisuus ja tarkoitus.

Napsauta "Luo agentti" -painiketta ja kirjoita nimi: 'Hal 9000'.

03. Luo tarkoitus

Ensin sinun on luotava tarkoitus. Me määrittelemme käyttäjän panosten "tarkoituksen". Napsauta "Luo tarkoitus" ja nimeä se "Openovet". Paina "Tallenna".

04. Harjoittele AI tätä tarkoitusta varten

An image showing the Google Dialogflow interface – in the box that's marked 'USER SAYS', it reads 'open the door hal' and in the box marked 'DEFAULT RESPONSE', it reads 'Sorry Dave. I can't do that now'.

Harjoittele AI: n tarkoituksena antamalla lauseita, joita käyttäjä voi käyttää

Harjoittele AI tätä tarkoitusta varten antamalla lauseita, joita käyttäjä voi käyttää. NLP AI käyttää näitä ja johdettuja vaihteluita agentin kouluttamiseksi. Lisää seuraavat koulutuslausekkeet "Koulutuslausekkeiden ikkunassa ja lisää niin monta omasi kuin haluat:

  • 'Avaa Pod Bay Ovet, Hal.'
  • "Avaa ovet."
  • 'Anna minun, Hal!'

05. Lisää vastauksia

Seuraavaksi sinun on lisättävä vastauksia, joita edustaja vastaa. Syötä nämä "Response" -ikkunaan. Kokeile jotain näin:

  • "Pelkään, etten voi tehdä sitä, Dave. '
  • "En voi tehdä sitä juuri nyt."

Paina sitten "Lisää vastauksia" ja "Tallenna" ylöspäin ylöspäin. Näet ilmoitukset, joita edustajaa koulutetaan ja sitten se on valmis.

06. Testaa chatbot

Näytön oikealla puolella on testaustyökalu. Chatbot käyttää Googlen puheenvuoropalvelua kääntämään äänesi tekstiin, jos yrität sitä. Sinun pitäisi nähdä pyynnön tulokset ja vastaus AI-agentti valitsee. Todella siistiä!

07. Luo ja käytä kokonaisuutta

Yksiköt ovat käsitteitä, jotka voidaan määritellä ja käyttää uudelleen edustajan vastauksiin muuttujina. Koulutetaan AI ymmärtämään, kun käyttäjä ilmaisee tunteen, sitten käyttää sitä vastauksessaan käyttäjälle.

Vasemmalla valikossa napsauta "Yksiköt". Kirjoita "tunne" uuden yksikön nimeksi. Pidä "määrittelevät synonyymit". Napsauta alla olevassa taulukossa ja kirjoita "vihainen" kuin ensimmäinen tunne. Napsauta sitten oikeaa ja lisää synonyymit, kuten "hullu", "järkyttynyt" ja niin edelleen. Lisää sitten toinen merkintä "peloissaan" ja käyttää synonyymejä "pelkää", "kauhistui" jne. Paina "Tallenna", kun olet valmis.

Tämä on nyt kouluttanut edustajaa ymmärtämään, että "vihainen" ja "peloissaan" ovat tunteita käyttäjä voi kommunikoida. Kaikki nämä synonyymit ovat vaihteluita, jotka voivat ilmetä. AI tuottaa myös joitakin.

08. Luo uusi aikomus

Nyt aiomme luoda uuden aikomuksen käyttää "tunteita" yksikköä, jonka olemme luoneet. Soita tähän tarkoituksiin "tunteisiin" ja napsauta Tallenna.

Seuraavaksi lisää uusia koulutuslausekkeita, kuten "olet pelottava minua", "Teet minut hulluksi", ja "Olen hyvin vihainen", käyttäen vihaisia ​​ja peloissaan avainsanoja. Tämä kouluttaa edustajaa ymmärtämään eri tapoja, joita käyttäjä voi ladata tämän emotionaalisen lausunnon.

Huomaat, että järjestelmä korostaa pelkäävät ja vihaiset sanat sinulle. Se on jo liittänyt nämä kokonaisuutena. Se on myös lisännyt merkinnän "toimintoihin ja parametreihin". Näin voit käyttää näitä yksiköitä myös vastauksissasi.

09. Lisää vastaus uudella "tunne" -yksiköllä

Lisää vastauksiin ikkunassa uusia vastauksia, jotka käyttävät tätä uutta kokonaisuutta. Huomaa "$" merkitä $ emotion 'Entity. Yritä lisätä nämä vastaukset:

  • "Olen pahoillani, että tunnet $ tunteita, Dave. '
  • "Tunne $ tunne on ihmisen vastaus, Dave."

Napsauta Lisää vastauksia ja paina "Tallenna" -painiketta näytön yläosassa, jotta voit tallentaa koko aikomuksen.

10. Testaa chatbot uudelleen

Yritä sanoa tai kirjoittaa seuraavat lauseet testaustyökalussa.

  • "Teet minut hyvin vihainen hal.
  • "Sinä olette minua ulos."

Huomaa, miten se vastasi käyttäen "peloissaan" toisen kanssa? Se käytti synonyymiämme, "freaked" tietää, että tarkoitamme peloissaan. Todella siistiä.

Voit vapaasti pelata tämän kanssa sekä lisätä lisää aikomuksia ja vastauksia, jotka haluat ja sitten lisätä tämän verkkosivulle.

11. Aktivoi Web Integration

An image showing Google Dialogflow's pop-up featuring a direct link and embeddable HTML snippet for a created chatbot.

Napsauttamalla Web-demoa näyttää koodinpätkä, jota voit pudottaa widgetin omaan verkkosivustoosi

Jos haluat lisätä sen verkkosivulle, valitse vasemmanpuoleisella valikossa 'Integrations'. Napsauta sitten Web Demo -ruutua painamalla tätä vaihtoehtoa.

Näyttöön tulee ponnahdusikkuna, joka näyttää suoran linkin, jotta voit testata integraatiota heti. Se näyttää myös koodinpätkä, jota voit käyttää Widgetin pudottamiseen omaan verkkosivustoosi. Kopioi, että leikkaava leikepöydälle, jotta voit liittää sen sivustoosi.

12. Luo perusverkkosivu ja lisää katkelman

Luo perus HMTL-sivu ja sisällytä tämä koodinpätkä seuraavaksi. Kokeile seuraava koodi ja lataa se palvelimellesi tai suorita se paikallispalvelimellasi. Vaihda alla oleva katkelma, jossa olet kopioitu valintaikkunastasi: 

 & lt ;! DocType HTML & GT;
& lt; html & gt;
& lt; pää & gt;
& lt; otsikko & gt; net - ai chatbot & lt; / otsikko & gt;
& lt; / head & gt;
& lt; body & gt;
& lt; iframe
    Salli = "mikrofoni;" Leveys = "350" korkeus = "430" SRC = "https://console.dialogflow.com/ap-li-cial/demo/embedded/bbd27d04-5546-4b62-85A5-C373575A33AA" & gt;
& lt; / iframe & gt;
& lt; / body & gt;
& lt; / html & gt;

Tämä artikkeli julkaistiin alun perin liikkeeseen 312, maailman parhaiten myytävänä lehden web-suunnittelijoille ja kehittäjille. Osta numero 312 tai Tilaa Net .

Keen saada lisätietoja siitä, miten voit tuoda AI sivustoihisi ja sovelluksiin?

An image promoting generate New York 2019 from April 24th -25th and speaker Josh Clark's keynote 'AI is your new design material'.

Generate, palkittu konferenssi web-suunnittelijoille, palaa NYC: hen 24-25! Voit varata lippuja osoitteessa www.generateconf.com

Haluatko oppia lisää siitä, miten voit tuoda AI malleihin? Josh Clark, Big Mediumin perustaja, antaa Keynote 'Ai on uusi suunnittelumateriaali "luo New Yorkissa 25. huhtikuuta, jossa hän opettaa sinua käyttämään koneen luomaa sisältöä, näkemystä ja vuorovaikutusta suunnittelumateriaalina Sinun jokapäiväinen työ.

Luo New York Runsilta 24-25 - Hanki liput nyt !

Aiheeseen liittyvät artikkelit:

  • Opas Googlen pilvi visioon
  • 7 valtava tekninen trendit vuonna 2019, että suunnittelijoiden on tiedettävä
  • Aikooko suunnittelijat korvataan robotteilla?

Miten tehdään - Suosituimmat artikkelit

Mixed-Media Art Tutorial: Miten vesiväri digitaalisen taideteoksen yli

Miten tehdään Sep 11, 2025

(Kuva Luotto: Naomi Vandori) Riippumattomana taiteilijana nautin luovasta prosessista yhtä paljon kuin valmiin maala..

Mikä on terminaattoriviiva?

Miten tehdään Sep 11, 2025

On monia näkökohtia valaistus, jonka sinun on harkittava, jotta voidaan välittää lomake. Yksi erittäin hyödyllinen perusta..

Luo reagoiva asettelu CSS-verkkoon

Miten tehdään Sep 11, 2025

CSS Grid Layout Kasvaa selaimen tukea joka päivä ja voimme lähettää CSS-verkkoa tuotantoon. CSS Gridin nopea kä..

Luo joustava karuseelikomponentti

Miten tehdään Sep 11, 2025

Vue.js on tullut harppauksiin äskettäin, tulossa kuudenneksi haarautuneimmaksi hankkeeksi tähän mennessä Github ..

Rakenna oma Webgl Fysiikan peli

Miten tehdään Sep 11, 2025

Tämä projekti jaetaan eri osiin. Annamme lyhyen esittelyn Herokalle, osoittavat, kuinka käyttää Physijs Three.js: n kanssa, ..

Paranna harjasi öljyissä

Miten tehdään Sep 11, 2025

Öljymaalit tarjoavat ihanteellisen välineen vahvan ja mielenkiintoisen harjauksen saavuttamiseksi. Taiteilijan tyyli brushstrokesista on se, mikä määrittelee työnsä ja antaa sille pers..

Maalaa karvainen lemmikkieläinten muotokuva

Miten tehdään Sep 11, 2025

Valmis kissan muotokuva Maalaus lemmikkejä ja Eläinten piirtäminen voi olla hauskaa. Vaikka ..

Mallinnus avaruusalusta pelattavuudelle

Miten tehdään Sep 11, 2025

Kanssa Murtunut tila Koska se on - vapaa-to-pelaaja tiimi taistelupeli - alukset ja niiden kyvyt ovat näyttelyn t..

Luokat