Add a dynamic checklist which marks off items as the user completes each one. This is a simple way to use variables in Storyflow.
Let's help the user keep track of the things they need to do. We'll keep it simple and have two items on our list.
Step 1: Open the Spray Workbench Script
- Open the "Spray Workbench" script.
After the previous tutorial, the script will look like this.
Step 2: Add an Anchor
- In the Scene Objects frame, add a Scene Anchor resource.
- Set the Anchor as "Main UI Anchor".
Step 3: Add a Guide to the Pickup Jigsaw Frame
- Select the Pickup Jigsaw frame. This frame already contains a Grasp resource. We are going to add an Itemized List resource from the Guide section (not from Inspector section).
- Find "Itemized List" in the Resources section and drag it into the frame.
- Fill in the Guide with the following values:
- Anchor = Main UI Anchor. (This will position the Guide against the wall in a visible location)
- Title = Clear & Spray. (The title will appear at the top of the list)
- Select "Check List Item" from the drop-down menu. (This will add an additional item to the list)
- Click the "+" next to Items to add a second Check List Item
Once you have completed those four tasks, let's call our two checklist items:
- Pick up and hold the Jigsaw
- Spray the Workbench
Step 4: Create Variables to Keep Track of the Items
As you can see in the picture below, each checklist item can be either checked or unchecked. The way it is now, we'd need to decide which it should be.
At this point in the script, we know that neither is complete. Unchecked is correct. However, we need a way to change the value to checked once the item is complete. A variable helps us do that.
In the column with the Resources and Conditions, there is a Variables tab. When you open the tab, you will see a "+ Add New" button.
- Click the "+ Add New" button.
Conceptually, checked or unchecked is the same true or false, on or off, etc... There are only two possible options for the value. We need a variable with only two options. Let's make one.
- Give the variable a name like: Pick up and hold Checked
- The first drop-down can keep the value Primitive.
- Select Boolean for the second dropdown. A Boolean is simply a value that is true or false. For our checklist item, it will represent checked or unchecked.
- Save the variable by clicking the checkmark in a circle. It is near the top on the right.
- Create a second variable called Spray the Workbench Checked. Follow the same steps as you did for the previous variable.
Now we have two true or false variables that we can use to dynamically update our list items to checked or unchecked at any point in the rest of our script.
- Save the Script.
Step 5: Assign the Variables to the Checklist Items
The variables will allow us to control if a checklist item is checked or not at any point in the script. First, we need to assign the variables to their respective items.
- Scroll down to the Guide and find the first checklist item.
- Next to the Checked label for the check box, you'll see an atomic symbol. Click it and a drop-down will appear.
- Select the "Pick up and hold Checked" variable from the list.
- Do the same for the second checklist item and assign the Spray the Workbench Checked variable to it.
Now we can change the value of the variable at any time and it will check or uncheck the checklist item to which it is assigned.
- Save the script.
Step 6: Check the First Item on the List
- In the script, select the "Pickup Spray Bottle" frame.
If you'll recall, at this point in the script the user will have already picked up and will be holding the jigsaw. That means as authors, we know that if a user reaches this point in our script, the first checklist item has been completed.
- Drag the Script Variable "Pick up and hold Checked" into the frame. Now it is part of the "Variables in Frame".
- Let's mark it as checked for the user with one of our variables. Click "set value" on the "Pick up and hold Checked" variable.
- Check the Value box.
- Click the checkmark in the circle to save the variable value.
The checklist will now have the first item checked in the scenario.
Step 7: Check the Second Item on the List
- In the script, open the "Spraying Complete" frame.
At this point, we know the user had completed spraying the workbench. We can use the second variable to check off the list item.
- Follow the same procedure as the previous step in the "Spraying Complete" frame and use the Spray the Workbench Checked variable.
- STOP: Save and Test.
The checklist will appear on the wall with two checklist items. As soon as the jigsaw is picked up, the first checklist item will be checked. When you have finished spraying the workbench, the second checklist item will be checked.
In the Headset
This is what your scenario will look like so far:
Key Takeaways from Tutorial 7
- Variables help to keep track of items in the script. In this example, they are used as true or false items to determine where in a script an item is complete.