Zbuduj ChatBot AI

Feb 3, 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.

Sztuczna inteligencja (AI) pozwala nam tworzyć nowe sposoby patrzenia na istniejące problemy, od przemyślenia strategii środowiskowych do tego, jak się uczymy. Twoje projekty - czy aplikacje, strony internetowe lub gry - mogą wykorzystać AI, aby uczynić je bardziej angażującymi, łatwiejsze w użyciu i mają bardziej wartościowe wyniki. Jedna taka metoda obejmuje tworzenie naturalnego języka Chatbot, aby pomóc użytkownikom interakcji z witryną.

Aby utworzyć pierwszy chatbot, użyjemy nowego zestawu narzędzi Google Dialogflow. Wykorzystuje potężną uczenie maszyn, a także na tekst. Może być włączony do Twojej witryny jako widżet lub dostosowany do Twoich potrzeb.

Jeśli jesteś w trakcie planowania nowej witryny, potrzebujesz porady na wszystkiego, od ideału Kreator strony internetowej do którego hosting usługa do wyboru, więc sprawdź nasze przewodniki. Tworzenie nowego systemu projektowania? Zapisz go bezpiecznie magazyn w chmurze Jest więc dostępny dla całego zespołu. Teraz, jak stworzyć chatbot ...

01. Utwórz konto

Iść do dialogflow.com. i stwórz swoje konto. Zaloguj się i zgodzić się na uprawnienia, aby umożliwić dialog z dostępem do Twojego konta.

02. Utwórz agenta

Dialogflow używa terminu "agent", aby reprezentować instancje swojego AI. Pomyśl o agenta jako wirtualnej inteligencji, którą tworzysz. Możesz mieć dla ciebie wielu agentów, każdy z własną osobowością i celem.

Kliknij przycisk "Utwórz agenta" i wprowadź nazwę swojego agenta: "Hal 9000".

03. Utwórz zamiar

Po pierwsze, musisz stworzyć zamiar. Definiujemy "intencję" danych użytkownika. Kliknij "Utwórz zamiar" i nazwij go "otwórz drzwi". Naciśnij "Zapisz".

04. Trenuj AI do tego zamiaru

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

Trenuj AI z zamiarem, dostarczając frazy, które może użyć użytkownika

Trenuj AI do tego celu, dostarczając frazy, których użytkownik może użyć. NLP AI będzie korzystać z tych i pochodnych wariantów do szkolenia agenta. Dodaj następujące zwroty szkoleniowe w oknie "Frazy szkoleniowe" i dodaj jak najwięcej, jak chcesz:

  • "Otwórz drzwi Podsze, Hal".
  • 'Otwórz drzwi.'
  • - Pozwól mi, hal!

05. Dodaj odpowiedzi.

Następnie musisz dodać kilka odpowiedzi, z którymi agent zareaguje. Wprowadzasz je w oknie "Odpowiedzi". Wypróbuj takie:

  • "Obawiam się, że nie mogę tego zrobić, Dave".
  • "Nie mogę tego teraz zrobić".

Następnie naciśnij "Dodaj odpowiedzi" i ponownie zapisuj "na górze. Zobaczysz powiadomienia, które agent jest przeszkolony, a następnie jest gotowy.

06. Sprawdź chatbot

Po prawej stronie ekranu jest narzędzie do testowania. Chatbot będzie korzystać z usługi mowy do tekstu Google, aby przetłumaczyć głos w tekst, jeśli spróbujesz tego. Powinieneś zobaczyć wyniki Twojej prośby i odpowiedzi wybrany agent AI. Bardzo fajny!

07. Utwórz i używaj podmiotu

Podmioty to koncepcje, które można zdefiniować i ponownie wykorzystać w odpowiedziach agenta jako zmienne. Trenujmy AI, aby zrozumieć, kiedy użytkownik wyraża emocje, użyj tego w odpowiedzi na użytkownika.

W lewym menu kliknij "Etykiety". Wpisz "emocje" dla nazwy nowej jednostki. Zachowaj zaznaczone "Define Synonimy". Kliknij poniższą tabelę i wpisz "Angry" jako pierwszą emocję. Następnie kliknij po prawej stronie i dodaj synonimy, takie jak "Mad", "zdenerwowany" i tak dalej. Następnie dodaj kolejny wpis dla "przestraszony" i użyj synonimy "boi się" "przerażony" itp, które lubisz. Naciśnij "Zapisz" po zakończeniu.

To teraz przeszkolił agenta, aby zrozumieć, że "zły" i "przestraszony" są emocjami, którym może się komunikować. Wszystkie te synonimy są odmianami, które mogą wystąpić. AI również wygeneruje trochę.

08. Utwórz nowy zamiar

Teraz stworzymy nowy zamiar użyć podmiotu "Emotion", które stworzyliśmy. Zadzwoń do tych intencyjnych "emocji" i kliknij "Zapisz".

Następnie dodaj nowe zwroty szkoleniowe, takie jak "Sikasz mnie", "robisz mnie zły", a "jestem bardzo zły", używając odmian zły i przestraszonych słów kluczowych. Trenuje to agenta, aby zrozumieć różne sposoby, aby użytkownik mógł wyrabiać ten emocjonalny oświadczenie.

Zauważysz, że system podkreśla przestraszone i gniewne słowa. To już flaga jako podmioty. Dodano również wejście do okna "Działania i parametrów". Umożliwia to również korzystanie z tych podmiotów w swoich odpowiedziach.

09. Dodaj odpowiedź za pomocą podmiotu "Emotion"

W oknie Odpowiedzi dodaj nowe odpowiedzi, które korzystają z tego nowego podmiotu. Zwróć uwagę na "$", aby oznaczyć jednostkę "$ emocji". Spróbuj dodać te odpowiedzi:

  • "Przykro mi, że czujesz się $ emocji, Dave".
  • "Uczucie $ emocji jest ludzką odpowiedzią, Dave".

Kliknij "Dodaj odpowiedzi" i naciśnij przycisk "Zapisz" na górze ekranu, aby zapisać cały zamiar.

10. Ponownie przetestuj swój chatbot

Spróbuj powiedzieć lub wpisywać następujące frazy w narzędziu testowym.

  • - Sprawiasz, że jestem bardzo zły Hal.
  • 'Przerażasz mnie.'

Zauważ, jak odpowiedział przy użyciu "przestraszony" z drugim? Używał naszego synonimu, "przerażony", aby wiedzieć, że chodziliśmy na przestraszony. Bardzo fajny.

Zapraszamy do gry z tym zabawą, a także dodaj więcej intencji i odpowiedzi, które lubisz, a następnie dodamy to do strony internetowej.

11. Aktywuj integrację internetową

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

Kliknięcie demo Web wyświetli fragment kodu, którego możesz użyć, aby upuścić widżet na własną stronę internetową

Aby dodać go na stronę internetową, kliknij "Integracje" w lewym menu. Następnie kliknij pole "Web Demo", aby włączyć tę opcję.

Poduszka pojawi się, że pokazuje bezpośrednie link, dzięki czemu możesz wyrządzić do przetestowania integracji od razu. Wyświetla również fragment kodu, którego możesz użyć, aby upuścić widżet na własną stronę internetową. Skopiuj ten fragment do schowka, dzięki czemu można wkleić go do witryny.

12. Utwórz podstawową stronę internetową i dodaj fragment

Utwórz podstawową stronę HMTL i zawierać ten fragment kodu Dalej. Wypróbuj następujący kod i prześlij go na swój serwer lub uruchom go na swoim lokalnym serwerze. Wymień fragment poniżej, który został skopiowany z agenta dialogowego: 

 DocType HTML & GT;
& lt; html & gt;
& lt; Head & GT;
& LT; Nett & GT; Net - Ai Chatbot & LT; / Title & GT;
& LT; / Head & GT;
& lt; body & gt;
& lt; iframe
    Zezwalaj = "mikrofon;" Szerokość = "350" wysokość = "430" SRC = "https://console.dialogflow.com/api-client/demo/embedDed/bbd27d04-5546-4B62-85A5-C3735A33AAA" & GT;
& lt; / iframe & gt;
& lt; / body & gt;
& lt; / html & gt;

Ten artykuł został pierwotnie opublikowany w wydaniu 312 netto, najlepiej sprzedający się na świecie magazyn dla projektantów stron internetowych i programistów. Kup problem 312. lub Subskrybuj netto. .

Chętnie dowiedzieć się więcej o tym, jak możesz przynieść AI do witryn i aplikacji?

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

Generuj, nagradzaną konferencję dla projektantów stron internetowych, wraca do NYC 24-25! Zarezerwuj bilety Odwiedź www.generateConf.com

Chętnie dowiedzieć się więcej o tym, jak możesz przynieść za swoje projekty? Josh Clark, założyciel dużego medium, będzie dawać jego keynote "AI jest twoim nowym materiale projektowym" w Generuj Nowy Jork 25 kwietnia, w którym nauczy cię używać treści wygenerowanych maszynowo, wglądu i interakcji jako materiału projektowego w Twoja codzienna praca.

Generuj Nowy Jork Runs od 24-25 kwietnia - Uzyskaj teraz bilety !

Powiązane artykuły:

  • Przewodnik po Vision Cloud Google
  • 7 Ogromne Trendy techniczne w 2019 roku, które projektanci muszą wiedzieć
  • Czy projektanci zostaną zastąpione przez roboty?

Jak - Najpopularniejsze artykuły

Jak tworzyć symulacje wody

Jak Feb 3, 2026

Ten samouczek nauczy Cię stworzyć animowaną plażę Diorama od początku do końca za pomocą Houdini FX. Zrozumiesz cały prz..

Naucz się modelować osobę 3D w Zbrush i Maya

Jak Feb 3, 2026

Strona 1 z 2: Strona 1 Strona 1 Strona 2..

Robić realistyczne włosy 3D i futro w 3DS Max i V-Ray

Jak Feb 3, 2026

Nie przegap VEREX 2018. , nasze debiutanckie wydarzenie dla społeczności CG. Zapakowany..

Jak zarządzać klasami CSS z JavaScript

Jak Feb 3, 2026

Podczas opracowywania prostych projektów internetowych, które obejmują interakcję użytkownika, jak najlepiej zarządzać zmi..

Symuluj transformację zawodnika ducha

Jak Feb 3, 2026

Strona 1 z 2: Strona 1 Strona 1 Strona 2..

Zbuduj interfejs użytkownika z fundamentem

Jak Feb 3, 2026

Oparte na karcie Układy stron internetowych. przejęli sieć. Popularne przez Pinterest, Twitter, Facebook i Goog..

Utwórz ramki w stylu w Photoshopie

Jak Feb 3, 2026

Strona 1 z 2: Strona 1 Strona 1 Strona 2..

Dokumentuj swoje systemy projektowe Fraktal

Jak Feb 3, 2026

Czy masz ochotę na więcej nauki na temat systemów projektowych? Więc nie przegap starszego inżyniera UI ..

Kategorie