The Visual Designer is a canvas-based tool that offers a drag-and-drop interface, empowering skill developers to construct conversational flows encompassing bot messages and decision paths. It is a user-friendly and customizable designer where steps within a skill are logically added and arranged in the desired order. The Virtual Designer requires minimal configuration, resulting in easily created, readable, and maintainable skills.
When you choose to use Visual Designer to build your skill, the below Create Skill pop-up screen appears:
On the screen, add the following details:
Specify the Skill Name. The skill name appears in the Welcome Skill suggestions or in a validation message to a user while chatting with Luma.
The system automatically suggests a skill. Identifier, which can be edited at the very time when the skill is being created.
Specify the Category to which this skill belongs. The category is used to filter skills within the Bot Builder interface. You can either select an existing category or create your own category by typing the Category name.
Enter the Image URL that you wish to get displayed. We can even skip this field as it is not mandatory.
Specify the skill Description. Use user-friendly terminology as the description is used as the sub-title when a skill is in the Welcome Skill.
Optionally select Mark as Sub-Skill. Checking this checkbox means that the Skill cannot be triggered directly by a user phrase; instead, it can only be triggered by another Skill.
The status is automatically set to active and can be set to inactive if you need to make the skill inaccessible, i.e., if the skill is not required or is pending changes.
Click Create.
The Skill is now created, and the user is moved to the canvas.
The following information configurations are added to the skill by default:
2 User phrased are added based on the skill name and description
Default steps are added to the canvas.
Designer Screen
The Designer screen is the platform used to add steps sequentially to form the skill's logic. As steps are added in sequence, the conversation and functionality of the skill gradually take shape. Now, let us explore the various sections and features available on the canvas.
Palette
The Canvas Palette holds the list of constructs that are available for the skill developers. These constructs are the building blocks of the Skill. The palette enables skill developers to drag and drop the constructs onto the canvas to define their skills. The palette enables developers to quickly build the skill by adding elements, defining decision pathways, and customizing the behavior of their skills.
The palette is divided into the following sections:
Prompts: This section holds the constructs designed specifically for capturing user input. Using prompts, you can pose questions to the user and store their responses in an attribute. These attributes can be easily referenced to access and utilize the information saved.
Messages: Messages section facilitates the display of bot responses. The section contains the constructs that can be used to present users with information. Using Messages, you can display information such as responses obtained from integrations, Notifications, or simple messages of completed actions.
Utilities: In this section, skill developers can access additional tools that assist in the skill-building process. Here, you will find various resources, such as branching to other skills and setting and manipulating data, that can be used to build the functionality and flow of the skill.
Integrations: The section offers integration options with external services. Here you find the integration tool that allows developer to connect to a third party application and execute a task.
Together, these constructs enable the skill developers to build and refine their skills.
Canvas
The Canvas is used to design Luma skills. It provides a visual interface where skill developers can create the conversational flow, defining the skill logic and Bot behavior. The canvas offers a user-friendly drag-and-drop interface that allows developers to connect the constructs, such as prompts, messages, and integration. With the canvas, developers can easily construct complex conversations with conditional branches and data manipulations.
Properties panel
The Properties Panel is the section where the configuration of each construct takes place. It is within this properties panel that the actual definition of each step is available. The Skill developers can modify the configurations to meet specific requirements.
Constructs
The Conversation constructs allow skill developers to build a conversation between the end-user and Luma. Each Construct represents the steps Luma should perform to complete a task. You can add the constructs in the sequence of desired execution. Using the constructs, you can ask users for information, integrate with a third-party application, show search results, or conditionally branch to a skill to exit the conversation.
For more information on the constructs, refer to Conversation Constructs in Visual Designer.
Tools bar
The Tools Bar on the Visual Designer canvas provides a range of helpful utilities to enhance the skill-building experience. The following tools are available for the skill developer:
Search Step: 'Search Step' tool simplifies navigation within extensive skill designs. Within this tool, you have the ability to search for specific steps by name. You can either select the desired step from the provided list or directly type in the step name. When a step is located through the search, the tool focuses on it, and the corresponding configuration is populated in the properties panel.
Auto Layout: Auto Layout facilitates the automatic arrangement of steps in a skill. By adding controls sequentially and then using the Auto Layout feature, the steps within the skill are automatically organized based on their link to the other steps. This ensures the skill is visually appealing and easily understandable.
Minimap: The Minimap provides an overview of the entire skill design, offering a bird's-eye view. It allows users to locate and focus on specific sections of the skill quickly. When a section is focused, the Canvas is loaded with the steps corresponding to the selected section, enabling easy navigation and targeted editing within the skill.
Download in PNG format: The option exports the skill as a PNG image.
Zoom in/Zoom out: This allows adjusting the level of magnification on the skill design canvas, depending on user needs. It provides flexibility in visualizing and working with the skill design at different scales.
Auto Fit: Auto Fit options assist in adjusting the display to suit individual preferences, ensuring a smooth and efficient skill-building process.
Skill Details
Once the skill is created, its information is readily accessible on the canvas. Click on the Skill Name in the Header or in the Start step. You can now view the general skill details and list of Users/Groups who have permission to execute the skill.
On Skill Details, you can view general skill details:
Permissions
Here you can grant access to individual users and groups to execute the skill. By default, the skill developer and the Administrators group are assigned to the skill and cannot be removed. This ensures that all skills can be accessed for testing by Administrators. Additional Users and Groups can be added. For more information, refer to Creating Skill using Classic Designer | Manage Skill Permissions.
<screen>
Re-prompting Behavior
The Visual Designer allows a skill developer to add an attribute multiple times in a skill. This enables Luma to re-prompt the user to fill an attribute again. This is called Re-prompting behavior and is specific to the skill. This is used to create a loop in the skill.
For more information on how re-promoting works, refer to Reusing attributes in Skill.