The domain-specific language we designed to specify chatbots employs a textual notation. We love textual modeling languages. They are easy to create and manipulate with any IDE. This includes for instance using standard version control tools to manage different versions of the bot. You can do all these things with graphical languages as well, but this typically requires more specialized tools and environments.

But nothing beats a graphical depiction of a model when it comes to read, understand and brainstorm about a model. The killer combination is having a textual notation to create and edit a model combined with a graphical one to read it. This is what Xatkit now provides, thanks to combining our textual-based Xtext implementation with our new graphical Sirus-based rendering.

Xtext and Sirius are now “buddies” and can work together to make textual and graphical representations co-exist together in harmony. We took advantage of this integration and extended our Eclipse toolkit to display Xatkit models as state machine diagrams. This blog post explains how to install and configure Eclipse to start rendering your chatbot models.

Building the Xatkit Eclipse plugins

The diagrams feature will soon be part of Xatkit global build. Just follow the instructions provided in the wiki to build Xatkit. Until then (or if you already have Xatkit installed), you need to install Xatkit first and then update your Eclipse installation to support this feature, do the following.

1. Navigate to the folder your Xatkit installation then update Xatkit-eclipse submodule
git submodule update --remote xatkit-eclipse
2. Use the build script to generate the update site
./build.sh --eclipse --skip-tests

Installing the Xatkit Eclipse plugins

Now you can Open your Eclipse installation and go to Help > Install New Software > Add > Local… There, select the repository folder located at path-to-xatkit\xatkit-eclipse\update\com.xatkit.update\target\repository. The update site contains two features containing the language editors and the Sirius integration. Select both then press Next.

Installing Xatkit in Eclipse
A warning pop-up will appear, asking if you are sure you want to install unsigned content, click on Install Anyway. Restart Eclipse and check the installation by navigating to Help > About Eclipse IDE > Installation Details > Installed Software, and check that the entries Xatkit DSLs and Xatkit-graphical-representation exist.

Display Xatkit Chatbot Diagrams

Now we are almost ready to render any of ouf chatbot models. As an example, we will use this SimpleQA bot already provided by Xatkit but of course, you can follow the rest of this short tutorial with your own Xatkit project. The SimpleQA bot illustrates how to create a FAQ bot to automatically handle your customers’ questions.

Let’s first import the bot to your Eclipse. Click on File/New/Examples… and select Xatkit Examples/SimpleQABot Example. 

Importing a bot into Eclipse

This will create a project in your workspace called SimpleQABot. Here is a snippet of the execution model of the chatbot which you can find at src/SimpleQABot.execution of your project.

...
MainState {
	Body {
		ReactPlatform.Reply("Hi, I can help you, ask me a question!")
	}
	Next {
		_ --> AwaitQuestion
	}
}

AwaitQuestion {
	Next {
		intent == Welcome --> HandleWelcome
		intent == XatkitInfos --> GiveInfos
		intent == WantBot --> AskBotSize
	}
}

HandleWelcome {
	Body {
		ReactPlatform.Reply("Hi, what can I do for you?")
	}
	Next {
		_ --> AwaitQuestion
	}
}
...

Here, the MainState state displays a message to the user (“Hi, I can help you, ask me a question!”) and has an automatic transition to the AwaitQuestion state. This state awaits the user’s query and based on the matched intent a transition will be made to the appropriate state (HandleWelcome, GiveInfos, AskBotSize). For instance, the HandleWelcome state will show a greeting message (“Hi, what can I do for you?”) then will go back to AwaitQuestion state to handle future user’s queries.

Even if the state machine behind this bot is rather simple, it’s still easier to grasp its states and the transitions between them if we look at it as a diagram (of coure, this is much more critical as the complexity of the state machine increases, e.g. if you have long conversation paths that fork depending on the user responses)

Follow the following steps to render the Xatkit diagram.

1. Right click on you project then select Configure > Convert to Modeling Project

2. Make sure that you’re using the Modeling or the Sirius perspective then right-click on the project again and click on Viewpoints selection.

3. Check Xatkit then click on OK

Eclipse modeling chatbot viewpoint

4. Open the representations.aird file located in your project folder then Select Xatkit/XatkitDiagram (1)/XatkitDiagram from the representations view

5. This should initialize a XatkitDiagram for you such as this one:

Bot graphical state machine

6.  You can now save the diagram if you wish.

The Sirius team did a very good job integrating ELK algorithms. We spent some time testing these algorithms with different bots and ended up choosing ELK Layered which showed good results. Besides, thanks to the smooth integration between Xtext and Sirius, when you change your model in the text editor you’ll see that you diagram has changed as well.

Subscribe To Our Newsletter

Subscribe To Our Newsletter

Follow all our news around the world of bots, chatbots and digital assistants. Learn how to build your own for free with Xatkit.

You have Successfully Subscribed!

Pin It on Pinterest

Share This