My first steps in conversational design as a UX Designer or How I built my first Conversational agent using Dialogflow CX by Google
Overview
Recently my team decided to build a conversational agent to support internal associates. The issue that I’m facing right now is that I have no tool to rapidly prototype AI powered conversational flows. The goal is to be able to deliver well-tested prototypes to the engineers before they start coding. Figma is not an ideal tool for this type of task especially for complicated scenarios with cross depended questions.
Another criteria for the tool is to have something with good comprehensive user interface so I can build prototypes with no or minimal coding. Python is not on my bucket list to learn as of now :)
FlowiseAI
The first thing that came up to me was Flowise which is basically a front end of a LangChain framework.
Here are my take aways after playing with Flowise for a little bit:
- Pretty easy to setup a Flowise environment. If you are able to complete Computer Science 101 course you should be able to do so. You might need some basic understanding of command line.
- Good learning tool to better understand how AI chat bots are being built. You will see all available components of LangChain such as vector databases, LLMs, prompts, chains, etc and how these all work together
- The downside of Flowise is that it’s still green, with poor documentation. Something is either not supported or lays very low so I wasn’t able to figure it out. For example I wasn’t able to setup multiple-choice questions and store answers in memory to prompt next questions based on old questions and then generate product suggestions
Dialogflow CX
After playing with Flowise for some time, I found another tool called Dialogflow CX by Google. As of right I can say that Dialogflow is much more advanced than Flowise, and of course I am judging it from a perspective of a UX designer.
My takeaways after learning DialogflowCX for some time
- The UI is a little confusing but mainly because there are millions of features and configurations
- Dialogflow CX has very good learning paths at Google Cloud Skill Boost
I took this tutorial which was really helpful to understand fundamentals. https://www.cloudskillsboost.google/course_sessions/5761858/video/413388
Notes
I am not going to recreate exact same project as in a tutorial, I’ll just use this article to keep some notes for myself and if someone else find them helpful, feel free to reuse them.
Use conditional route to move to another page or flow if all parameters are satisfied
Use Yes/No intents to route the flow to the right direction
When using conditional route, write down a response to a user on a Route level after condition is satisfied
Question for a condition is better to setup on a Parameter level
Use True as a condition to automatically move to another flow or page without a user input
Create event handlers for every parameters on a page to handle events such as incorrect entry, no entry, etc
Use custom Entity type to capture information from users. Example below is a Regex Entity to verify if an input from a user is a 4 digits number
Here is a file if you want to see this project in action. You will need to import it to your Agent.
My next steps in my learning journey:
- Learn Web Hooks to be able to work with databases
- Learn Dialogflow AI capabilities
