Workshop Tutorial 1 - Setting up
Set up your workspace and write your first script.
Training Notes
In this article, we will work with scripts and a resource. Before we start, please review these two articles:
- 1 Guided Walkthrough Video
- 2 Step 1: Create a Director Script (2:37 in Video)
- 3 Step 2: Create a New Scenario (3:08 in Video)
- 4 Step 3: Attach the Director Script to the Scenario (3:33 in Video)
- 5 Step 4: Create a new script called "Welcome Message" (4:35 in Video)
- 6 Step 5: Rename the Frame (6:04 in Video)
- 7 Step 6: Add a Screen Message (6:44 in Video)
- 8 Step 7: Launch the Welcome Script from the Director Script (8:19 in Video)
- 9 In the Headset
Guided Walkthrough Video
View full screen on Vimeo at this link
Step 1: Create a Director Script (2:37 in Video)
All scenarios start with a director script. This is the script that will be launched when the scenario begins in VR. The director script is meant to control the flow of the scenario.
Click Add New Script in the "Scenarios" tab of Storyflow:
Name your script Director Script
Click on the checkmark to save
Step 2: Create a New Scenario (3:08 in Video)
Now, you need to create a scenario. This is the title that will show up in the Scenario Menu in VR.
Click on Create in the Scenarios panel:
Give your scenario a title. In this case, we have chosen "Workshop Test"
Click on the green Save button:
Step 3: Attach the Director Script to the Scenario (3:33 in Video)
The scenario dictates which script will be launched to start the scenario. It is almost always the case that the scenario launches the Director script in your project.
While your scenario is open, you can drag the Director Script over from the script panel to the area that says "Script +"
Click on the green Save button
STOP: Save and Test. To make sure your scenario is working, put on your VR headset, and launch the experience. You should be standing in a workshop and you will see a menu with "Workshop Test" in it. You can click the Workshop Test and the menu will disappear. Nothing else will happen yet!
Step 4: Create a new script called "Welcome Message" (4:35 in Video)
One of the powerful things about Storyflow is the ability to generate a scenario from several scripts. It helps keep authoring organized and gives you control over the flow of the scenario and the order that things occur. It also makes troubleshooting a lot easier.
Let's create a new script to add a screen message.
Create a new script in the same way you created the Director Script. First, click on Add New Script.
Name the script Welcome Message
Click on the checkmark to save it
Now we want to open the Welcome Message script so that we can edit it.
While you are looking at the list of your scripts in the Project tab, click on the title Welcome Message
You will see that it opens a Script Frame. This is the frame for this specific script, the "Welcome Message". Within this area is where we can make edits and add items to this script.
It's important to ensure you are in the correct script. You should see the script name in the active tab. If the script is open, but not active, click on the "Welcome Message" tab to make it the active script. You can navigate to other scripts that you currently have open, in the same way.
Step 5: Rename the Frame (6:04 in Video)
On the left-hand side of the editor, you can see the "frames" that make up the script you are working on. Frames process in order and you can control when they open and run by using Conditions (we will learn more about this later in the tutorial).
To rename a frame, click the title on the frame (right now it says "New Frame") and enter the new name Welcome Message
Click outside of the edit box (or hit Return) to save the name
Step 6: Add a Screen Message (6:44 in Video)
We'll start by adding a welcome message for the learner that they will see when this scenario first starts. To do this, we will use a "Screen Message" resource.
When you are viewing a script you will see Resources on the right-hand side of the page:
Search for Screen Message
Make sure you have chosen the "screen message" from the Playable Content section. This is what we need for this particular action. There are also "screen message" resources under the Guide and Inspector sections.
Drag and drop the resource into the center section of the screen:
Add text to the screen message (the learner sees this). In the Text field add “This is your first screen message! Click ok to clear this message”.
Training Tip
By leaving Anchor blank, the message will appear in front of the learner wherever they are in the scene. To have the screen message appear above a specific item in the scene, you would anchor it. We'll learn more about that later.
If you want the button text to say something other than "ok" you can define that in the space above.
Click Save:
Step 7: Launch the Welcome Script from the Director Script (8:19 in Video)
If you were to try the scenario now, you would not see this screen message. That is because the scenario launches the Director Script we made, not this one. Let's add this script to our Director Script so that we can see it in action.
Open the Director Script
There is an important icon you will use often: the Script icon. Click on this button on the far right-hand side of the screen:
Click on script catalog to see all of your scripts.
Choose the Director Script
Click on the > icon to collapse the catalog
You should now see the empty director script open in your editor screen and the Director Script tab is the active one:
Re-name the first frame Launch Welcome Message:
As mentioned, in order for the Welcome Message script to launch, we need to attach it to the Director Script. There are a few ways to do this, but the quickest is to drag and drop the script directly on the center of your screen.
Click on the Scripts icon
Open your Script catalog
Drag and Drop in the Welcome Message Script
Collapse the scripts menu
STOP: Save and Test. Now, when you launch the scenario, you should see this message pop up!
In the Headset
This is what your scenario will look like so far:
For full screen, view on Vimeo at this link.
Next Up: Workshop Tutorial 2 - Add Ambience