User Interfaces is the design or the system through which the user and the computer interact. Conversational user interfaces are the user interfaces that help humans to interact with computers using Voice or text. As technology is growing, it is becoming easy through NLU to interpret human voice or text to an understandable computer format.
• Voice assistants allow a person to interact verbally.
• Chatbots where the user interacts with the bots by typing commands or queries.
How to integrate them?
• Used through custom interfaces set up for the web and is ignorant of the model running in the background
• Used through chat applications such as Facebook Messenger, Whatsapp or Twitter
• Used through conversational AI platforms
• Used through custom interfaces with conversational AI platforms
| Library | Pros | Cons |
|---|---|---|
| Vanilla React Interfaces | the most flexibility in designing the interface and backend | less ready-to-use than the other options and needs more setup |
| Use Existing Chat Applications | ready to use once we have backend running, and users are already familiar with the interfaces/need minimum training | more difficult to bypass fidelity permission |
| ConvAI platforms | ready to use if we already build the model using the platform | have to use a platform |
| Custom UI with platforms | easy to plug in chatbot and flexibility in the custom interface | need to use a platform and need to work on the interface development |
Tutorial on the implementation is here
• Install Node.JS
• From the vanilla_chatbot folder, run npm install
• From the same folder, run npm start, a browser window will automatically open with the running webpage
See also implementation with react-simple-chatbot and demo
Commonly used applications include:
• Facebook Messenger
• Slack
• Telegram
• Twilio
• Google Hangout Chat
• Microsoft Teams
• Custom Websites
Example of slack bot configuration.
Conversational AI Platforms provide testing interfaces to manage bots and conversing with existing bots. Some options are:
• Test option on dialogflow
• AWS Lex
• RASA X
RASA X setup
• pip install rasa
• start a new folder, run rasa init to start test model
• (optional) train/configure model
• install rasactl following instruction
• inside test model folder, run rasactl connect rasa (test model name), a browser window will automatically open with rasa x interface, more instructions can be found here
Add chatbot component to custom websites using. Some options are:
• build chatbot component with aws-lex-web-ui
• build chatbot component with rasa webchat
rasa-webchat example
• have rasa model running
• change the port number of socketUrl in /rasa-webchat-bot/src/App.js to the port where the rasa model is running
• run npm install and npm start in the /rasa-webchat-bot folder to start interface with rasa bot component