1. Description

A graphical Low-Code editor for creating Flows that can be used for any maintenance scenario.

Represented by space to build, as well as:

1. Top bar (Fig.1(1));
2. Bar of components (Fig.1(2));
3. Space for building (Fig.1(3)).

Fig. 1. Webitel Flow Diagram

1.1. Top bar

This bar displays the name of the Flow and also contains the following elements:

1. Edit tool (Fig.2);
2. Go to start;
3. Jsonify to console;
4. Save;
5. Close.

Fig. 2. Top bar

1.1.1. Edit tool

It is designed to change the name and the tags of the Flow.

Click the button opens the Update name modal window (Fig.3).

Fig. 3. Update name modal window

1.1.2. Go to start

Clicking the Go to start button returns the schematic to where the Start component is in the middle of the space for the build.

1.1.3. Jsonify to console

The Jsonify to console button is designed to display the JSON code that matches the generated flow schema in the console. To view it, you need to open the console.

1.1.4. Save

It is designed to save changes in the flow schema.

Clicking the arrow opens the possibility of selecting the Save as option (Fig.4).

Fig. 4. Save as

When you select Save as the Update name modal window (Fig. 3) opens. You can change the flow scheme's name in this modal window.

The Save failed modal window opens (Fig.5) when the connection with the server disappears during the work in the constructor after clicking on the Save button.

Fig. 5. Save failed modal window

Retry button - repeated attempt to save changes.

Export to JSON button - downloading a JSON file of an unsaved schema.

Close button - closing the modal window.

1.1.5. Close

When there are unsaved changes, the Save button is active, and when you click on the Clos button, the Warning modal window opens (Fig.6).

Fig. 6. Warning modal window

The Warning modal window consists of an informational notification and buttons:

• Save - saves changes and closes the editor. The Flow page opens;
• Don't save - does not save changes and closes the editor. The Flow page opens;
• Cancel - cancel closing the editor. The modal window closes. You can continue working in the editor.

1.2. Bar of components

This bar displays a list of components from which you can create flow schemes and a search field. The flow type is displayed at the top of the bar.

There are such components:

Each component has its settings bar.

The setting bar opens on the right side of the page when you click a component block in the space for building.

1.3. Space for building

This is the main workspace for building a Flow.

You can clone or delete the selected block by right-clicking on a component block.

You can change the scale of the constructed flow using the mouse wheel.

In the lower right corner is a mini-map of the scheme with a zoom scale for ease of use. The scale is 50% by default and after clicking on Go to start button.

2. Opportunities

2.1. Add a Component to a Flow

3. Additional materials

3.1. Instructions

3.1.1. Flow examples

• Add missed call to outgoing dialer
• Add a Subscriber to the Inbound Task Queue — Email
• Conference (Flow)
• Create an Activity on a missed call in Creatio
• Flow schema fragments
• Forms - Call processing
• Form — Send an email
• Incoming call with additional dialing
• Internal transfer per group
• Outgoing call
• Request a call back from the queue
• Route an incoming call to the responsible agent in Creatio
• Simple IVR menu
• Processing and Reply to Email