Basic branching and looping

Learn to make make a flow branch out based on user answers.

This article explains basic branching and looping. While the method we show here gives you a lot of flexibility, it needs a fair bit of boilerplate. So, for some common use cases, DialogForm offers an alternative way of branching and looping through a feature called "quick responses", which needs much less boilerplate. Learn about it here.

Basic Branching

If you have read some of the earlier sections of this user guide, you may already have come across some instances of branching, although we didn't specifically use the term "branching". Here is such an instance:​​

Editor

Preview

The above prompt asks the user a question (what is 5 times 9), and presents a list of options they can respond with. The user can select any one option. Based on the answer selected, the chat moves on to either prompt #2 (if the user answers '45') or prompt #3 (if the user answers anything other than '45').

Prompts #2 and #3 are not shown here, but we can imagine prompt #2 to be something like "Yes, that's correct" and prompt #3 to be something like "No, that's wrong".

So, in effect, we have created two branches - the "correct" branch and the "wrong" branch. This is only one use case of branching, there can be many others.

What To Do

In DialogForm, open up a flow you want to edit.

In the prompts panel, click on the "+ Add prompt" button.

This will add an empty prompt right below. Type in a message to the user.

Then, click on "+ Add answer" to type in an answer choice. Hovering over any answer will reveal a button to insert another answer before/after it. Add as many answers as you want. You can always move answers around using their drag handles (the icon with the six dots).

Note the "**" surrounding the question statement in the example at the top of the page. Everything enclosed within it is made bold. This special syntax is a part of Markdown. You can use Markdown to compose rich-text messages and answers.

Each answer has a box labeled "To". Here you can specify which prompt to move to if the user selects this answer. Click on each box and assign a next prompt.

Basic Looping

If a user provides an incorrect answer to a prompt, you can have them re-attempt the prompt by looping back to it. Here is an instance of looping:

Prompt #0 asks the user the question "What is 1 + 1?".

If the user answers 2, the chat moves on to Prompt #2, which says "Correct!".

If the user answers anything but 2, the chat moves on to Prompt #1 which says "Nope, try again!", and then moves on to Prompt #0 again.

Prompt #0 has a correct answer (i.e. 2) and a catch-all answer (i.e. the "*") that matches all other answers. We call this type of prompt a "free-form answer prompt". You can read more about it here.

What Next?

Learn about an alternative, quicker way to set up branching and looping for common use cases.

pageBranching and looping with quick responses