Create Accountlogin

The State Model

By adding state to your trees you can turn your project from a conversational website into a conversational application. But first things first.

What is state?

State keeps track of how you as a user interact with a system. Imagine using a regular vending machine to buy a coke. Usually, you'll have to press a button to select the product you'd like to buy. The selected product is written to memory and forms the state of the vending machine. Later on, the state will also keep track of how many coins you entered in the machine and whether the transaction is complete or still in progress.

Why using state in a conversational model?

State is an essential part of every software product you use. Zircel uses state too - even if you don't realize it. We keep track of what buttons an end-user has clicked and determine with that state information what to display next.

With Zircel, you can define your own structured state model to keep track of your end-users state within the conversation. You can then later view, import, export or even manipulate this state and use it for other tasks. Further, You can also customize and personalize the experience based on the state the end-user left behind the last time he visited your conversational website or application.

State Keys

Zircel lets you define your own state model tailored to your needs. You can do so by setting up state keys. For every key, your end-users can provide a value. For example, you could have a state key "email" and your users would manipulate their state by entering their actual email address.

One can distinguish two different types of state keys: Internal State Keys, Explicit State Keys.

Internal State Keys

Internal State Keys can be defined in the Node Editor. You can set state keys for feedback fields (e.g. input fields) and buttons.

Keys associated with an input field (or a textarea) are mandatory and need to be defined upfront. They are needed to assign each input field with a specific purpose. For example, one input field expects the end-users' email address and another input field is here to get an end-users' name.

On the other hand, you can also define state keys for buttons. Maybe you want to know if an end-user is interested in buying a specific product. To do so you can simply ask this question and assign a state key (e.g. "wantsProductX") to the "Yes"-button. Whenever a user agrees by clicking this button your state will contain a boolean value: { wantsProductX: true }.

Explicit State Keys

Sometimes capturing state during an end-users' conversation is not enough and you have to import additional state to provide a pleasant and personalized experience to your user. Or maybe, you use an (anonymized) customer-id to identify your clients in your main IT system. By sharing this customer-id with Zircel, you can retain this id again at a later point in time with an integration endpoint and thus de-anonymize and reference the newly gained state with your main system.

You can set explicit state keys in the "Dev"-Tab by clicking the green "plus" sign at the bottom of the page. For every explicit state key, one has to set a data type (Boolean/String or Number) upfront. State keys are uniquely identified by their combination of data type and key-name.

Importing State

There are three ways to import state into your end-users conversation:

However you decide to import state: don't forget to set state keys for every object property you try to import.

Session Management and State

Maybe you are wondering how Zircel connects a specific state to a user. In other words: how does Zircel know which state belongs to which user?

Generally, on has to distinguish two cases:

Using State

In this chapter, we'll learn about how you can use state in your application.

Logic Nodes

State can be used for intelligent routing. Based on a certain logical condition, you can route a user to certain subtree or the other. You can learn more about Logic here.

Listening to State Changes

With the plugin and the Zircel Event API you can listen to state changes continuously and update your own website accordingly.

Personalization with State Keys

One of the easiest ways to leverage state is to personalize messages to your end-users:

As you can see, the syntax to personalize text is pretty straight-forward Hi {#name | there} 👋. Let's look at it in more detail:

If you are certain that a state key exists you can also use the simplified notation Hi #name 👋.