Stavba AI-Powered Chatbot

Jan 29, 2026
jak
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.

Umělá inteligence (AI) nám umožňuje vytvářet nové způsoby, jak se dívat na stávající problémy, od přehodnocení environmentálních strategií na to, jak se učíme. Vaše projekty - Ať už aplikace, webové stránky nebo hry - mohou využít AI, aby byly více zapojení, snadněji používat a mají cennější výsledky. Jeden takový způsob zahrnuje vytváření přirozeného jazyka Chatbot, který pomáhá uživatelům komunikovat s vašimi stránkami.

Chcete-li vytvořit svůj první chatbot, použijeme nový dialogové okno Dialogflow. Vyrovnává výkonné strojní učení, stejně jako projev. Může být začleněn přímo do vašich webových stránek jako widget nebo přizpůsobení vašim potřebám.

Pokud jste v procesu plánování nových stránek, budete potřebovat radu o všem z ideálu Webové stránky Builder. ke kterému web hosting Service pro výběr, takže se podívejte na naše průvodce. Vytvoření nového návrhu systému? Zachránit to bezpečně cloudové úložiště Takže je přístupné vašemu celému týmu. Nyní, jak vytvořit chatbot ...

01. Vytvořte si účet

Jít do Dialogflow.com. a vytvořit svůj účet. Přihlaste se a souhlasíte s oprávněními, abyste mohli devázni pro přístup k účtu.

02. Vytvořte agenta

Dialogflow používá termín "agent", který představuje instance AI. Přemýšlejte o agentu jako virtuální inteligence, kterou vytváříte. Mohl byste pro vás pracovat mnoho agentů, každý s vlastní osobností a účelem.

Klikněte na tlačítko "Vytvořit agent" a zadejte název svého agenta: "HAL 9000".

03. Vytvořte úmysl

Za prvé, musíte vytvořit záměr. Definujeme "záměr" uživatelských vstupů. Klikněte na 'Vytvořit úmysl' a pojmenujte jej "Otevřít dveře". Stiskněte 'Uložit'.

04. Trénujte AI pro tento záměr

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'.

Trénujte AI pro úmysl tím, že poskytuje fráze, které by uživatel mohl používat

Trénujte AI pro tento záměr poskytnutím frází, které může uživatel použít. NLP AI bude používat tyto a odvozené odchylky pro trénování agenta. Přidejte následující výcvikové fráze v okně "Výcvik fráze" a přidejte tolik z vlastních, kolik chcete:

  • "Otevřete dveře pod zálivem, hal."
  • "Otevřete dveře."
  • "Dovolte mi, Hal!"

05. Přidat odpovědi

Dále potřebujete přidat některé odpovědi, se kterými bude agent reagovat. Zadáte je do okna "Reages". Vyzkoušejte něco takového:

  • "Obávám se, že to nemůžu udělat, Dave."
  • "Teď to nemůžu udělat."

Poté stiskněte 'Přidat odpovědi' a 'Uložit' nahoru nahoře nahoře. Uvidíte oznámení, že agent je vyškolen a pak je připraven.

06. Vyzkoušejte chatbot

Na pravé straně obrazovky je testovací nástroj. Chatel použije službu Google Serve-to-Text pro překládání hlasu do textu, pokud to zkusíte. Měli byste vidět výsledky vašeho požadavku a odpověď AI Agent vybraný. Skvělý!

07. Vytvořte a použijte účetní jednotku

Subjekty jsou pojmy, které lze definovat a znovu použít v reakcích agenta jako proměnné. Pojďme trénovat AI, abyste pochopili, když uživatel vyjadřuje emoce, pak použijte v reakci na uživatele.

V levém menu klepněte na tlačítko "Entity". Zadejte "emoce" pro název nového entity. Zaškrtnuto "Definujte synonyma". Klikněte v tabulce níže a zadejte "rozzlobený" jako první emoce. Poté klikněte napravo a přidejte synonyma, jako je "šílený", "rozrušený" a tak dále. Pak přidejte další položku pro "strach" a používejte synonyma "strach," "vyděšený" atd., Který se vám líbí. Stiskněte 'Uložit' při dokončení.

To nyní vyškolilo agenta, aby pochopil, že "rozzlobený" a "strach" jsou emoce, které může uživatel komunikovat. Všechny tyto synonyma jsou variace, ke kterým by mohlo dojít. AI bude také vygenerovat.

08. Vytvořte nový záměr

Nyní budeme vytvořit nový záměr použít "emoce", kterou jsme vytvořili. Zavolejte toto úmyslné "emoce" a klikněte na 'Uložit'.

Další přidejte nové vzdělávací fráze, jako je "vyděšuješ mě", "děláš mě šílený" a "Jsem velmi rozzlobený", používám variace rozzlobených a strach klíčových slov. To bude trénovat agenta pochopit různé způsoby, jak může uživatel fráze tohoto emocionálního prohlášení.

Všimnete si, že systém upozorňuje na strach a naštvaná slova pro vás. Už je to označovat jako subjekty. To také přidal záznam do okna "Akce a parametry". To vám umožní použít tyto entity ve vašich reakcích.

09. Přidat odpověď pomocí nové "emoce" entity

V okně Reages přidejte nové odpovědi, které používají tuto novou entitu. Všimněte si, že "$" označuje subjekt "$ Emotion". Zkuste přidat tyto odpovědi:

  • "Je mi líto, že se cítíš emoce, Dave.
  • "Pocit $ Emotion je lidská reakce, Dave."

Klikněte na 'Přidat odpovědi "a stiskněte tlačítko" Uložit "v horní části obrazovky uložte celý záměr.

10. Opětovné otestujte svůj chatbot

Zkuste říct nebo zadat následující fráze v testovacím nástroji.

  • "Děláš mě velmi rozzlobený hal."
  • "Ty mě vyděsíš."

Všimněte si, jak to reagovalo pomocí "strach" s druhým? To použilo naše synonymum, "šílené", abych věděl, že jsme se máme strach. Skvělý.

S tímto si můžete hrát, stejně jako přidat některé další záměry a odpovědi, které se vám líbí a pak to přidáme na webovou stránku.

11. Aktivace webové integrace

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

Kliknutím na webové demo zobrazí úryvek kódu, můžete použít widget do své vlastní webové stránky

Chcete-li ji přidat na webovou stránku, klepněte na tlačítko Integrace v levém menu. Poté klikněte na pole "Web Demo", chcete-li tuto možnost zapnout.

Zobrazí se vyskakovací okno, který ukazuje přímý odkaz, takže můžete použít k testování integrace ihned. Zobrazí také úryvek kódu, který můžete použít k upuštění widgetu do vlastního webu. Zkopírujte tento úryvek do schránky, abyste ji mohli vložit do svých stránek.

12. Vytvořte základní webovou stránku a přidejte úryvek

Vytvořit základní stránku HMTL a zahrnout tento kódový úryvek dále. Vyzkoušejte následující kód a nahrajte jej na server nebo jej spusťte na místním serveru. Vyměňte pod úryvkem níže s jedním, který jste zkopírovali z agenta dialogu: 

 Doctype HTML & GT;
& lt; html & gt;
& lt; hlava & gt;
& lt, titul & gt; net - ai chatbot & lt; / titul & gt;
& lt; / hlava & gt;
& lt; tělo & gt;
& lt; iframe
    Povolit = "mikrofon;" Šířka = "350" výška = "430" SRC = "https://console.dialogffflow.com/api-client/demo/emo/embedded/bbd27d04-5546-4b62-85A5-C373575A33AA" & gt;
& lt; / iframe & gt;
& lt; / tělo & gt;
& lt; / html & gt;

Tento článek byl původně publikován v čísle 312 sítě, nejprodávanější časopis světa pro webové designéry a vývojáře. Prodám vydání 312. nebo Přihlásit se k odběru Net. .

Keen se dozvědět více o tom, jak můžete přinést AI na vaše stránky a aplikace?

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

Generovat, ocenění výherní konference pro web designéry, se vrátí do NYC 24. dubna! Chcete-li rezervovat vstupenky navštivte www.generateconf.com

Dychtivý se dozvědět více o tom, jak můžete přinést AI do svých návrhů? Josh Clark, zakladatele velkého média, bude dávat jeho klíčovou poznámku 'AI je váš nový designový materiál "na generování New Yorku dne 25. dubna, ve kterém bude naučit používat stroj-generovaný obsah, vhled a interakce jako návrhový materiál Vaše každodenní práce.

Generovat New York běží od 24 do 25. dubna - Dostaňte si vstupenky Dokázal se!

Související články:

  • Průvodce k službě Cloudova vize
  • 7 Obrovské tech trendy v roce 2019, že designéři potřebují vědět
  • Budou návrháři nahrazeni roboti?

jak - Nejoblíbenější články

Afinitní návrhář: Jak používat efekty a styly

jak Jan 29, 2026

(Image Credit: Serif) S vektoru a rastrové nástroje kombinované, Afinitní návrhář je cenově do..

Začínáme s bulminou

jak Jan 29, 2026

(Image Credit: Bulma) Chcete začít používat bulma? Jsi na správném místě. Bulma je populární CSS rámec s j..

Listy znaků pro 3D Modellers: 15 Top tipů

jak Jan 29, 2026

(Image Credit: Dahlia Khodur) Listy jsou řádem dne v tomto tutoriálu, který pokrývá, jak vytvářet jeden pro 3..

Vytvoření materiálu dlaždic v návrháři látky

jak Jan 29, 2026

Návrhář látek je vynikající nástroj pro vytváření všech druhů materiálů pro vaše 3D umění . Zde v..

Vytvoření více expozičního obrazu s Adobe CC

jak Jan 29, 2026

Adobe mi pověděl s vytvořením obrázku pro vyjádření konceptu multilocalismu a vyšší, můžete vidět svou odpověď. V tomto tutoriálu budu procházet svým kreativním procesem p..

Jak malovat nádherné miniatury

jak Jan 29, 2026

Původ miniaturního malby se táhne daleko zpět ke středověkému věku, když miniaturní umělci malovali nádherné portré..

3D Text Tutorial pro grafické designéry

jak Jan 29, 2026

Strana 1 z 2: Začínáme s kinema 4d Začínáme s kinema 4d ..

Jak získat model Zbrush do Maya

jak Jan 29, 2026

Pro tohle Maya tutorial. Ukážu vám, jak jsem dostal tento Grumpy Link model od Zbrushu do Maya za vykreslován�..

Kategorie