In this in-depth tutorial, you will learn how to dynamically create new slot values in runtime. Moreover, the use of this feature on our interaction builder platform enables Skill Designers and developers to create a more personalized experience for the end-users. Another significant aspect of this feature is that you can dynamically enable or disable slot values based on conversation specific to your skill’s requirements or user context.
The illustration put to use in this tutorial showcases the step-by-step process of rendering information regarding cars from the Used Cars showroom to prospective customers enquiring by stating the car model. The comprehensive instructions combined with highlighted screenshots will offer the required direction needed to execute the Dynamic slots within a custom interaction model to override existing values with new values and synonyms.
Prerequisites
- VOGO Voice account: https://www.vogovoice.com/
- Access rights to the Interactions section.
- Access rights to the Interaction builder platform.
Create a Custom Slot
Make a custom slot named Cars and add as slot values the names of popular car models such as “chevrolet chevelle malibu”, “buick skylark 320”, “plymouth satellite” and “amc rebel sst’ as shown below.
To learn how to create custom slots refer to the guide: https://university.vogovoice.com/kb/creating-custom-slots/
Create a Custom Intent
Make a suitable intent to be invoked for executing an interaction flow mapped to it.
Create an intent titled ‘My Cars’ with suitable sample utterances linked to it. The sample utterances for this intent would be, “Tell me about the cars you sell”, “What cars do you sell”, and “Tell me about the cars on sale”. These sample utterances will serve the purpose of fetching the desired results when the end-user makes a general inquiry of cars on sale.
To learn how to create custom intents refer to the guide: https://university.vogovoice.com/kb/creating-intents/
Steps to create an interaction flow
- Log into your VOGO Voice account to be directed to VOGO Voice Management Console (https://account.vogovoice.com)
- Navigate to Interactions on the vertical bar displayed on the left-hand side of the Dashboard.
Dashboard > Interactions
3. Now, click on the Interactions button at the bottom right-hand corner of the screen. Select the ‘My Cars’ intent to be directed onto the Interaction builder platform.
4. In the flow diagram area, you will be able to see the Start and Response components.
5. Unlink the Start component from the Response card by clicking the delete icon placed in the middle of the chain.
6. Now, drag and drop an Add Variables component onto the flow diagram area.
7. Now mouse over the top right corner of the Add Variables component. Click on the pencil icon that appears. This will open up its configuration window.
8. Configure the Add Variables component by adding the key-value pairs as shown in the screenshot below. Fill in the first variable name as details and add the array as value, the format, and content of which is provided below. Then, set the datatype as Array. To know more about data types, click here.
details:
[
{
"Name":"chevrolet chevelle malibu",
"Miles_per_Gallon":18,
"Cylinders":8,
"Displacement":307,
"Horsepower":130,
"Weight_in_lbs":3504,
"Acceleration":12,
"Year":"1970-01-01",
"Origin":"USA"
},
{
"Name":"buick skylark 320",
"Miles_per_Gallon":15,
"Cylinders":8,
"Displacement":350,
"Horsepower":165,
"Weight_in_lbs":3693,
"Acceleration":11.5,
"Year":"1970-01-01",
"Origin":"USA"
},
{
"Name":"plymouth satellite",
"Miles_per_Gallon":18,
"Cylinders":8,
"Displacement":318,
"Horsepower":150,
"Weight_in_lbs":3436,
"Acceleration":11,
"Year":"1970-01-01",
"Origin":"USA"
},
{
"Name":"amc rebel sst",
"Miles_per_Gallon":16,
"Cylinders":8,
"Displacement":304,
"Horsepower":150,
"Weight_in_lbs":3433,
"Acceleration":12,
"Year":"1970-01-01",
"Origin":"USA"
},
{
"Name":"ford torino",
"Miles_per_Gallon":17,
"Cylinders":8,
"Displacement":302,
"Horsepower":140,
"Weight_in_lbs":3449,
"Acceleration":10.5,
"Year":"1970-01-01",
"Origin":"USA"
},
{
"Name":"ford galaxie 500",
"Miles_per_Gallon":15,
"Cylinders":8,
"Displacement":429,
"Horsepower":198,
"Weight_in_lbs":4341,
"Acceleration":10,
"Year":"1970-01-01",
"Origin":"USA"
},
{
"Name":"chevrolet impala",
"Miles_per_Gallon":14,
"Cylinders":8,
"Displacement":454,
"Horsepower":220,
"Weight_in_lbs":4354,
"Acceleration":9,
"Year":"1970-01-01",
"Origin":"USA"
},
{
"Name":"plymouth fury 3",
"Miles_per_Gallon":14,
"Cylinders":8,
"Displacement":440,
"Horsepower":215,
"Weight_in_lbs":4312,
"Acceleration":8.5,
"Year":"1970-01-01",
"Origin":"USA"
},
{
"Name":"pontiac catalina",
"Miles_per_Gallon":14,
"Cylinders":8,
"Displacement":455,
"Horsepower":225,
"Weight_in_lbs":4425,
"Acceleration":10,
"Year":"1970-01-01",
"Origin":"USA"
},
{
"Name":"amc ambassador dpl",
"Miles_per_Gallon":15,
"Cylinders":8,
"Displacement":390,
"Horsepower":190,
"Weight_in_lbs":3850,
"Acceleration":8.5,
"Year":"1970-01-01",
"Origin":"USA"
}]
9. Now add another variable in the Add Variables component and configure it as illustrated below. Name the newly added variable as list and add the names of cars as an array: the format, and content of which are provided below in detail. These car names added to var.list represent the Dynamic slot values added additionally to the slot named Cars. Next, select its data type as Array.
list:
["ford torino","ford galaxie 500","chevrolet impala","plymouth fury 3","pontiac catalina","amc ambassador dpl"]
Create a custom intent for Dynamic slots
Make a suitable intent to be invoked for executing an interaction flow mapped to it.
Create an intent titled ‘Car Name’ with suitable sample utterances linked to it. The sample utterances for this intent would be, “{{car}}”, and “I am looking for {{car}}” These sample utterances will serve the purpose of capturing the preferred car name suggested by users and call to action the Dynamic slots saved in this interaction flow.
10. Next, drag and drop a Response component and connect it to the Add Variables card as shown below.
11. Now, configure the Response component as shown right below. To configure click on the Voice icon on the top right-hand side of the Response component. Clicking on the voice icon opens a Speak pop-up window with a field titled Say wherein you need to type the following response.
Say: My cars, your trusted used car dealer will provide you details of any car you prefer to buy.
Prompt: Say the name of the car you are looking for
The same message will be replicated in the Reprompt field.
Reprompt: Say the name of the car you are looking for
12. Next, to configure the Dynamic Slots, populate the field under Expectations by checking the Allow Global Interactions. Then click on the plus button and select Car Name intent. Then check Include Dynamic Slots, after which click on the Label dropdown and select the Cars from the list of intents. Then type the var.list in the text area and select the data type as Path in the corresponding field.
🖍 Note: Ensure to click the Save button to save the interaction flow as and when edits are made.
To add a display message in a display voice-assisted device.
- Click on the Computer icon, and type in the field titled Display Message of the Show pop-up window.
- Populate the required fields and click the Save button.
Title: My Cars
Display Message: Say the name of the car you’re looking for.
To learn about different template engines to be followed to run functions visit https://university.vogovoice.com/kb/template-engine/
13. Now, drag and drop an Add Variables component onto the flow canvas and connect it to the already configured Response component as demonstrated below.
14. To configure the Add Variables component, fill in the variable name as findCar. To fulfill this step, a find function is to be added.
15. To add the find function in the value field, navigate to the Data tab adjacent to the Components on the top left-hand side of the interaction builder platform.
16. Click on the Data part and in the search bar type ‘find’. From the drop-down that appears, click on the plus button beside the collection, and this will bring up the find function as shown below.
17. Drag and drop the find function in the value field corresponding to the findCar variable name. This will automatically generate the find function in the respective field. Now continue to configure as illustrated below. Click the plus button that appears under the heading Arguments and add the first argument as var.details and select the data type as Path. For the second argument use the object {“Name” : “{{inputs.car.value}}”} and select its type as Object. Here, the find function will iterate over each of the objects in the var.details and fetch a match for the user input. If the match is found then that object is returned from the array.
18. Now drag and drop a Response component onto the flow canvas and connect it to the already configured Add Variables component as shown below.
19. Configure the Response component as shown right below. To proceed click on the Voice icon on the top right-hand side of the Response component. Clicking on the voice icon opens a Speak pop-up window with a field titled Say wherein you need to type the following response.
Say: {{var.findCar.Name}} is an {{var.findCar.Cylinders}} cylinder, {{var.findCar.Displacement}} cc, {{var.findCar.Horsepower}} horsepower vintage car which is built in the year {{var.findCar.Year}} in {{var.findCar.Origin}}.
Here the template {{var.findCar.Name}} will render the name of the car, the template {{var.findCar.Cylinders}} will fetch the number of cylinders, {{var.findCar.Displacement}} will produce the detail about the displacement of the car in cc, wherein {{var.findCar.Horsepower}} contains the horse power, {{var.findCar.Year}} will give the manufacturing year and the template {{var.findCar.Origin}} will provide the country of origin.
To add a display message in a display voice-assisted device.
- Click on the Computer icon, and type in the field titled Display Message of the Show pop-up window.
- Populate the required fields and click the Save button.
Title: {{var.findCar.Name}}
Display Message:
Cylinders: {{var.findCar.Cylinders}}
Displacement: {{var.findCar.Displacement}} cc
Horsepower: {{var.findCar.Horsepower}} hp
Year: {{var.findCar.Year}}
Origin: {{var.findCar.Origin}}
Testing Instructions
- Log in to the Developer Console and select the skill for which the interaction is created.
- Click on the Test Button on the Navigation Bar
3. On the left side of the screen, in the Alexa Simulator window, type in the testing instructions in the empty text box as highlighted below.
4. Invoke the skill first and then call out the My Cars interaction by typing any of the sample utterances mapped to the intent eg: “Tell me about the cars you sell”. Immediately, a prompt will ask for the name of the car you want to look up.
5. Next, type in any of the car names added as Dynamic slots to see if it got registered in the skill and is working to fetch the necessary details.
Shown below is the sequence of the output conversation
Here’s the Output Display
Congratulations! You have successfully learned how to implement the Dynamic Slots to create new slot values in runtime so as to deliver a more personalized experience by generating fine-tuned results specific to the end user’s spoken requests.
👍 Note: To test the functioning of the interactions on your device you have to deploy the custom skill to facilitate the skill with the new edits. To accomplish this, click on the Deploy button seen at the bottom of the Skill Settings pop-up window.
To know how to deploy a custom skill visit https://university.vogovoice.com/kb/deploying-a-skill/
To Learn about Dynamic slots, click here.