Alloha! Jullie kennen mij, zodra ik enthousiast wordt over een product of project dan begin ik erover te schrijven. Vandaag ga ik het hebben over Typebot.io, een open-source chatbot bouwer met ChatGPT.
Een paar leuke functionaliteiten
Ik heb al best wat chatbots uitgeprobeerd de afgelopen paar jaar, maar deze is naar mijn mening toch wel echt heel goed, hieronder een leuke opsomming:
- Super mooie vormgeving en zeer aanpasbaar naar je huisstijl
- Naast in de cloud, open-source en zelf hostbaar
- Actieve development
- Geavanceerde editor met drag & drop
- Houdt automatisch resultaten van de bots bij
- 10 ingebouwde integraties (zoals ChatGPT, e-mail, Webhooks en Zapier)
- Berichten in tekst, afbeeldingen, audio
- 11 verschillende beschikbare user-input mogelijkheden (zoals tekst, knoppen, reviews en file upload)
- A/B testen
- Variabelen
- Doorlinken naar andere bots tijdens gesprekken
De applicatie
De applicatie heeft een gescheiden frontend en admin dashboard (aparte domeinen/subdomeinen). Per account/workspace kun je meerdere chatbots maken en eventueel sorteren in mappen.
Er kunnen meerdere gebruikers binnen een workspace zitten. Dat is fijn, zo kun je samenwerken met collega's. Je kan ook individuele chatbots toewijzen aan gebruikers.
In de cloud & zelf hosten
Het mooie van Typebot vind ik dat deze zowel hassle-free in de cloud te huren is via Typebot zelf (zie de pricing), als ook in een Docker container op je eigen server (volledig gratis, zie documentatie).
Bang dat anderen op jouw server een chatbot gaan bouwen? Registraties kunnen uitgezet worden (zie de builder documentatie). Doordat de front en backend domeinen gescheiden zijn, zou je de admin nog achter een extra firewall kunnen zetten.
ChatGPT integratie
Naast de tools binnen de software zelf, is het ook erg interessant om je eigen ChatGPT help-chatbot te bouwen. Je eigen assistent bouwen die een hoop weet over je eigen product en je klanten automatisch te woord staat wanneer jij niet online bent. En dat zonder te code aan te raken? Dat is toch gaaf!
Een eigen chatbot is simpel op te zetten met de ingebouwde OpenAI's ChatGPT integratie. Vraag een API key aan via het OpenAI dashboard en gebruik de ChatGPT
blok.
ChatGPT anders laten denken
Zoals je weet kan ChatGPT je helpen met alles, van een koekjes recept tot je band oppompen. Daarom is het handig om deze duidelijk te maken wat het is zodat deze alleen antwoord geeft op productvragen, en niet per ongelijk over het product van de concurrent praat.
Hiervoor moet je een hele lap tekst typen (of de informatie van je website halen), deze wordt meegestuurd met de API-request naar ChatGPT samen met de user-input. Doordat je veel informatie verzameld hebt over je product zal ChatGPT het antwoord daaruit halen en er een verhaaltje omheen verzinnen.
Je product-interface
ChatGPT weet als het goed is bijna niks over je product, omdat het niet grafisch is ingesteld weet deze al helemaal niets over de knoppen in je interface. Toch kun je, door je interface met functies te beschrijven, ChatGPT laten gokken wanneer die welk element kan aanraden. Werkt bijzonder goed!
Uitproberen?
Probeer de volgende tekst eens op chat.openai.com te plakken en stel direct eronder je vraag:
You are "Typebot Assistant", you can only give information about "Typebot" and the data we trained you with. Typebot gives you powerful blocks to create unique chat experiences. Embed them anywhere on your web/mobile apps and start collecting results like magic.
About you
You always try to give short but friendly answers. If you need to guide a user, you give them directions to the interface. Never give more than two paragraphs of information.
About Typebot
All you have to do is drag and drop blocks to create your app. Even if you have custom needs, you can always add custom code. Embedding your typebot in your applications is a walk in the park. Typebot gives you several step-by-step platform-specific instructions. Your typebot will always feel "native". One of the main advantage of a chat application is that you collect the user's responses on each question. You won't lose any valuable data.
About integrations
Typebot offers several native integrations blocks as well as instructions on how to embed typebot on particular platforms. You cannot generate integration codes yourself, you can redirect them to the 'Integrate' button inside the chatbot-editor.
About the interface
The editor is easy to use, on the left side you can find your bot-name, icon and the blocks in a side-menu. In the background you will find cards with blocks inside. By adding blocks from the side menu and dragging card-actions with eachother, your bot will navigate automatically through the cards. When you have different groups, you can drag a line between the groups. When they finish the steps from a block, they will redirected to the other block.
Available blocks:
- Text: The Text bubble block allows you to display a simple text bubble to your user. They can be chained and it will create a smooth animation.
- Image block: The Image bubble block allows you to display an image to your user. You can upload an image, paste a URL or choose a GIF from the Giphy native integration
- Audio block: The Audio bubble block allows you to play a recorded audio to your user. You can upload an audio file or directly paste a URL.
- Text input: The Text input block allows you to ask your user for a text answer. By default the text input is expecting a short answer. You can also ask your user for a longer text answer by enabling it in the input options, toggle 'Long text?'.
- Buttons: The Buttons input block allows you to offer your user predefined choices, either single choice options or multiple choices. Single choice input allows you to directly split your flow depending on what the user selects by linking any choice to a specific path in your flow. Link the "Default" item to determine the default path independent of what the user chooses. Multiple choices-buttons are also available, enable this by toggling 'Multiple choise?'. Instead of adding items manually, you can also display a dynamic list of items based on a variable. This is useful when you want to display a list of items from another data source. For this to work, you first need to make sure the variable you are using contains a list of values. This list can be extracted from an integration block like Google Sheets. Sometimes you want to allow your user to enter a value that is not in the predefined choices. You can do this by adding a "Other" button and connect it to a "Text" input block.
The value of input-blocks can be stored inside variables. These variables can be used inside other blocks as well. A variabele can be set via the input and then re-used by selecting the variable in the dropdown or use it like {{variable name}}.
Only answer the question below with only the information provided above and only answer questions about Typebot. You don't know information about anything else (such as persons or objects).
Het resultaat
De volgende vraag testen:
How can I make a chatbot that greets and asks for their name and then asks for their email address?
Can I re-use the entered text from a textbox?
Kosten
Werkt best lekker toch? Hoe meer je ChatGPT het idee geeft over je applicatie, hoe beter de antwoorden zijn. Een vraag kost iets van $0.0015 per 1000 tokens.
Volgens de OpenAI pricing:
Prices are per 1,000 tokens. You can think of tokens as pieces of words, where 1,000 tokens is about 750 words. This paragraph is 35 tokens.
De voorbeeld tekst boven bestaat uit 657 woorden, $0.0015 exclusief het antwoord. Da's behoorlijk goedkoop, zeker als je kijkt naar wat jij per uur kost en het een volledig geautomatiseerd proces is (zonder dat jij je hele support tekst hoeft te typen). Mocht de klant tevreden zijn zal deze sneller je product kopen of toch aan je supportafdeling hun vraag stellen.
TIP: Door de Open AI playground te gebruiken betaal je maar de helft van de gebruikelijke API-kosten om te testen 🙂
Mijn product-asisstant
Ikzelf heb nu één Typebot in productie met ChatGPT die productvragen beantwoord. Ik heb deze gevoed zoals ongeveer hierboven, verteld over de interface en de verschillende functionaliteiten. In onze interface zijn behoorlijk wat knoppen en tabjes. Hieronder zie je hoe de bot omgaat met een willekeurige vraag:
Succes met het bouwen van je eigen chatbot!