Using the Storyboard Builder

in the

ToolBook Rapid Development Suite

 

 

This document provides an introduction to the Storyboard Builder along with specific instructions for its use.  Click on a topic from the Menu of Topics to jump to that section.

 

---

Menu of Topics

 

Introduction

Setting Up the Storyboard Builder on Your PC

The Storyboard Files

Running the Storyboard Builder Book

Definitions of the Lesson Types

Using Help in Storyboard Builder Book

The Lesson Type Outlines

    Simulation

    Content Only Lesson

    Quiz

Opening the Simulation Lesson Builder

Simulation Storyboard Builder Menu Bar Options

    Quick Navigation

    Insert Screens

    Maintenance

    Format Text

    More Help Options

Saving Your File

Exiting the Storyboard

Opening Your Saved File

Creating the Simulation Storyboard

    Navigation

    The Title Screen

    The Score Screen

    The Popup Screen

    Inserting a Task Outline Screen

    Inserting Content Only and Content Only with Graphic Screens

    Inserting Topic Mode Selection Screen

    Inserting a Text Only Screen

    Inserting a Scenario A Screen

    Inserting a Scenario L Screen

    Inserting a Text Only Summary Screen 

Version Information

Compacting the Storyboard File

Exporting the Data

Obtaining the Screenshots

Building a Content Only Lesson

Building a Quiz

 

    

---

 

Introduction

 

The Storyboard Builder, written in ToolBook, has been developed as a result of the need to standardize the writing of all Web-Based Training. In the past writers have used things like a Word Template or an Excel Template. The ToolBook developer then had the responsibility of taking the approved documents and copying/pasting text into ToolBook as the final lesson was built. What was important during the previous processes and is equally important now is that the writer knows how to write a lesson and what scenarios to select from to create the Simulation Lessons or other lesson types.  As an example, existing scenarios before and now include such actions as these: Learner clicks once on a screen to advance to the next screen. or Learner types input into an active field and clicks a button. Knowing what can be done and then writing the lesson to incorporate these actions is the key to success at all levels of the process: writing, reviewing, and building the lesson. 

 

Note:   ToolBook uses the book metaphor to describe a file, so throughout this document, you will find a file referenced as a book.  We also often refer to a screen as a page, still using the book metaphor of books and pages.

 

Setting Up the Storyboard Builder on Your PC

 

To be able to use this tool to write a lesson, each writer will have a package of files to install to their PC.  The setup process will make it very easy to allow for Storyboard updates as changes are needed along the way.   

1. From the projects drive or whatever the source of the setup files might be,  RDS200/wbtdev/storyboards/install_sb_tool/autosetup folder, copy the SB Setup folder to your desktop.

2. Open the SB Setup folder on your desktop and double-click the setup.exe file.

3. By default, the setup program will create a folder on your c: drive: c:/Program files/RDS_SBBUILDER

4. Allow the setup program to make this folder for you.  Upon installation, five blank Starter books are installed to this folder. If you get in trouble with a file, you can always make a copy of the appropriate file, rename it to your topic filename, and start over.

 

Note: This installation installs the master starter Storyboard files for five different types of lessons.

• Sim SBBuilder.tbk - A Simulation with Show Me Mode Optional
• Sim1 SBBuilder.tbk - A Simulation with all Three Modes (Demonstration, Practice, and Assessment)
• Content SBBuilder.tbk - A Content Only Lesson
• Quiz SBBuilder.tbk - A Quiz Lesson
• Demo Sim SBBuilder.tbk - A Simulation that runs in Demonstration Mode

 

The Storyboard Files

 

When you are ready to write a Storyboard for any topic in any project, you will get a file, such as SB_RDS_200_930.tbk.  You will also be told what the project code is (such as RDS200) so that you know the name to use to create your working folder.

1. Create a folder, naming it RDS200 Storyboards within the c:/Program files/RDS_SBBUILDER folder. 

2. You should copy this file into the c:/Program files/RDS200_SBBUILDER/RDS200 Storyboards folder.  As you write a Storyboard, you will enter information into this file, creating new screens as needed and saving.

  

Running the Storyboard Builder Book

 

The simplest thing to do is double-click on the icon (or filename) from this folder.  If you want an icon on your Desktop do this: 

1. First, right-click over this icon and choose Create Shortcut. 

2. Now, drag this icon to your Desktop.

3. Finally, rename this icon to the current topic filename if needed, such as SB_RDS_200_930.tbk.

4. You can now run the Storyboard Builder from your Desktop.

 

Definitions of the Lesson Types

 

We have divided the lesson options into five types and you will get a slightly different file for each type: 

 

Simulation with Show Me

This Simulation lesson will primarily be a series of screens where the Learner is required to do something to interact with the software being simulated. There will be two modes: Practice and Assessment. In addition, a Show Me button provides access to a Demonstration mode.  We have provided the ability to add Content Only screens as well as Content with Graphic screens which could be used to introduce a topic.

Simulation with all Three Modes

This Simulation lesson will primarily be a series of screens where the Learner is required to do something to interact with the software being simulated. There will be three modes: Demonstration, Practice ,and Assessment. We have provided the ability to add Content Only screens as well as Content with Graphic screens which could be used to introduce a topic.

Content Only

A Content Only lesson will be a series of screens that will not include any sort of Simulation or mode.  Normal navigation (Next and Previous) will allow the learner to move back and forth in this type of lesson as they choose.  The Content Only lesson will primarily be screens with text only or text with a screenshot of part of the software being simulated in another lesson.  This type of lesson can also include a Hotspots screen where the Learner clicks on parts of a screen to get more information and a Hotwords screen where the Learner clicks on a word to highlight a part of the screen and obtain information about that part of the screen. Additionally, practice questions can be added for review of the content and these can be scored if desired.

      Quiz

A Quiz lesson will be an assessment of Learner knowledge and will be a series of Multiple Choice and True/False questions where feedback is given for wrong answers and a quiz score provided at the end.  This type of lesson could possibly be at the end of a series of lessons (topics) which teach a particular skill.  We can add the ability to store this type of information later on if desired.

Simulation in Demonstration Mode Only

A Simulation lesson will primarily be a series of screens where the Learner is required to do something to interact with the software being simulated. This will be Demonstration only.  We have provided the ability to add Content Only screens as well as Content with Graphic screens which could be used to introduce a topic.  This will be very similar to The Simulation lessons except that there is one extra Sim Scenario (Sim P for radio buttons).

 

Using Help in Storyboard Builder Book

 

The Help menu for the file (book) provides three Outline options (in addition to other options) as shown here:

 

• Simulation Lesson Outline

Provides a typical outline for a Simulation Lesson.

• Content Only Lesson Outline

Provides a typical outline for a Content Only Lesson.

• Quiz Outline

Provides a typical outline for a Quiz.

  

 

 

The Lesson Type Outlines

 

This section will provide a close look at each of the outlines for each of the lesson types. The main lesson type you will be working with will be a Simulation.

 

Simulation Lesson Outline

 

Clicking Sim Lesson Outline from the Help drop-down menu in the book gives you this suggested outline for building a Simulation Lesson:

 

 

You are told that the Title, Score Page, and Popup Page are screens that are standard for any Simulation lesson and are part of the outline already once you open that file.  Most of the time, the Task Outline page will be inserted as the third page.  Listed also are the types of available screens that you can insert to build this a Simulation lesson.  A Help screen in the Simulation Storyboard Builder book will describe each of the Simulation Scenarios.

 

You close this Help screen by clicking the Close button. You also can print this screen for reference by clicking the Print Outline button.

Content Only Lesson Outline

 

Clicking Content Only Lesson Outline from the Help drop-down menu in the book gives you this suggested outline for building a Content Only Lesson:

 

 

 

Here you are told that the Content Title and Content Summary are the two existing screens.  The remaining screen types are those that you can insert into the Content Only lesson.  This outline can also be printed for reference. 

 

Quiz Outline

 

Clicking Quiz Outline from the Help drop-down menu in the book gives you this suggested outline for building a Quiz:

 

 

The Quiz Title and Quiz Summary screens are part of the initial outline and you can insert the M/C, T/F, and FIB screens as needed to build the quiz.  The Quiz Summary screen provides a score for the quiz.

 

 

Opening the Simulation Lesson Builder

 

To begin to build a Simulation lesson:

1. Double-click on the filename for the topic of double-click on the icon on your Desktop if you created one for the current topic.

 

 

Note:  Notice that the Menu Bar contains five options: Quick Navigation, Insert Screen, Maintenance, Format Text,

           and Help.

 

 

Simulation Storyboard Builder Menu Bar Options

 

As stated and demonstrated above, there are five options on the Menu Bar.

Quick Navigation

 

1. Click Quick Navigation to obtain the drop-down menu shown below.

 

 

 

The options include:

 

• Go to Title Page

• Go to Mode Selection Screen

• Go to Score Screen

• Go to Popup Screen

• Show Screen List – shows a list of the current screens in the lesson.  Once this list is populated, you can quickly navigate to any screen by clicking on any line. This list can also be printed by clicking the Print List button.

 

 

 

 

Insert Screens

1. Click Insert Screens to view the drop-down menu for this option. This is the main drop-down menu you will use to build your lesson storyboards.  A later section will give you more information on how to do this.

 

 

Maintenance 

1. Click Maintenance to view the Maintenance drop-down menu.

 

 

 

The options are fairly self-explanatory.  Version Info and Compact File options will be explained later on.  The Store Data option is used to build an ini file once you complete building the storyboard. This is what the ToolBook Developers will then use to build the actual lesson.  For each version of the Storyboard for any topic, you will build this ini  file and send it to the ToolBook Developer.  You also can do a Spelling Check.  Options include checking only the Current Screen or All Screens.

 

 

Note:   This uses a link to the Spelling Checker in Word but does not provide all the standard options you would expect in Word. However, it will do a good job in checking your input.  Words can be added to the Dictionary but it does not do a Change All or Ignore All across screens.  Note also that the Options does not work since you are not actually in a Word Document and running Word. In testing this, it has been determined that it is best to not have a Word Document open when you do a Spell Check. If you do, you might get an unexpected dialog box prompting you to save the Word template file.

 

 

 

 

Format Text

1. Click Format Text to view the options you have for formatting text.

 

 

  Bold Sim Text

When writing text for Simulations, you will want to bold things like the name (or Caption) of items user is to click on or the text string they are to type.  Demonstration Mode Text and Practice Mode Text are places where this is important.  In both instances, special characters are used to tell ToolBook how to treat the final text that is viewed in the Web Browser.  To apply

this type of formatting, just select the word or words (highlight) you want to bold and choose the Bold Sim Text option from the Format Text menu.  Notice in the case below that the word Catalog has what we call HTML tags around it -- <b>Catalog</b>.

 

 

  Bold Other Text

 

Feedback Text and Sticky Note text is displayed in a slightly different manner and needs to be marked slightly different. You still select the word or phrase (highlight), then choose Bold Other Text from the Format Text menu.  Notice that in this case as shown above, the words have brackets placed around them -- [Scenario A].

Note: If you decide to change the formatting, you can just delete the special characters and start over if necessary.

 

More Help Options

 

1. Click Help to view the Help drop-down menu.

 

 

 

You also can view your Screen List from here. The remaining options give you Help screens that give the various Lesson Outlines and the different types of screens as shown here:

 

 

It is recommended that you print this Help screen since these are the Screen types you need to be most familiar with as you write a Simulation lesson.

 

 

 

Saving Your File

 

As you add information to your Storyboard, you will need to save the file.

1. Click the Save button at the bottom of the first screen of the Simulation Lesson Storyboard Builder to save your current work in the CIS200 Storyboards folder.

  

 

 

 

Exiting the Storyboard 

1. To exit the Storyboard tool at any time, click the Exit button in the bottom right corner of the screen.

 

 

 

 

          Note: The small icon to the left of the Exit button can be used to quickly jump to the Screen List.

2. Anytime you try to exit, you will encounter this dialog box if you have made changes to the Storyboard and have not already clicked the Save button.  Most of the time, you will click Yes here. If you do not want to exit, just click Cancel.  Clicking No does not save any changes you might have just made.

 

 

 

Opening Your Saved File

 

Once you have saved your Storyboard, you can open it directly by just double-clicking on the icon in the folder where you saved the file.   

1. Use Windows Explorer or My Computer to locate the RD200 Storyboards folder within the RDS_SBBuilder folder.

  

 

2. Open that folder and double-click on the icon for the file you wish to run, such as SB_RDS_200_300.tbk.

  

 

 

Creating the Simulation Storyboard

 

There are several ways to begin creating the Storyboard.  The easiest way is to use the Navigation buttons provided. Recall also from an earlier section that there also are Quick Navigation options from the Menu Bar. You also can use the Screen List popup dialog box.

 

Navigation

 

Most all of the pages of the Storyboard contain a Navigation Panel in the bottom-right part of the screen with four buttons as shown here.

 

 

The Title Screen

 

The first screen of a Simulation lesson will always be an introduction to the topic. This screen is called the Title screen. 

1. Once you are ready to start entering text and adding screens, click the Next button at the bottom of the opening screen.

 

 

 

2. There are three bits of information you must enter on the Title screen.

• Your Name

• Lesson Name

• The topic introductory text

Note:    A Book Name is set based upon the file name for the Storyboard.  For this Book Name, we take only the set of numbers that were used when the file was saved. Thus if the file was named SB_CIS_200_930, then the Book Name is 200_930.  Once you start inserting screens, this will be referred to as the Topic Number and will be used as the first part of the file name for any screen captures you make later on.

3. To enter the information, all you need to do is type in the fields provided.  You can use the Tab key to move back and forth between the fields or you can just click in any field and type.  When you first enter a screen, the first field will most likely have the focus.  You can use your Windows keystrokes to cut (CTRL+X), copy (CTRL+C), and paste (CTRL+V) as desired throughout the Storyboard Builder.  This is important if you want to move information between fields or screens.

4. Many of the input fields will have examples of what to type with the style being approved already for this project.  In the example shown below, the Title screen for the WBT will have the following text:

In this topic, you learn the steps to navigate through ToolBook to learn some basic tasks.

 

Click the Next button to continue.

 

Note: The bold text comes from the tags described earlier.

5. A good habit would be to click the Save button each time you complete a screen. 

6. Click the Next button to proceed to the next screen.

The Score Screen

 

If you wish, you can go ahead and set up the Score Screen which will always be the last screen of a Simulation Lesson.  In Assessment mode, it displays Summary Text as well as provides a button for the Learner to click to display their score for Assessment mode. 

1. Type your Summary Text in the input field.

 

2. Click the Save button when done.

Note:   Since this is always the same text as you enter on the Title screen (except for the bolding tags which you would need to remove), you could use the Windows keystrokes to copy and paste the text.  Note also that if you write the Storyboard in this manner, this will currently be shown as Screen 3.  As you insert screens, this number will change.

 

 

 

           The Popup Screen

You can now go ahead and set up the Popup Screen if you wish. This will provide general Help information for the current task.  Text can be bolded as needed using the Format Text drop-down option. Bold Other Text.

 

  Inserting a Task Outline Screen

When you are ready to starting inserting pages, navigate back to the Topic Mode Selection page.  For most lessons, you will want to include a Task Outline screen.

1. From the Menu Bar, click Insert Screens, then Insert Task Outline Screen.

2. When you insert a screen, you will be prompted to name the screen.  The first seven characters will be provided for you based upon the file name which then gives the topic number, 200_930 in this case.  The remaining three numbers corresponding to the screen number.  As you insert screens, always try to use something like 005, 010, 015, or 020.  Then as you insert additional screens, do so in increments of 5.  This provides you leeway later on to insert additional screens between existing screens.  For example, if you have inserted 200_930_010 and 200_930_020 and then decide an additional screen is needed between these two, you could name it 200_930_012.

   Note:   This format will be strictly enforced. It must always be XXX_XXX_XXX where the X’s are numbers.

3. Now enter the required information in the fields provided.  Note that this screen is intended to provide a general outline of the basic steps to perform a task.  The steps go in the small fields and the text you wish to display about each goes in the larger fields to the right.

         Inserting Content Only and Content with Graphic Screens

You have the option of inserting Content Only and Content with Graphic screens as needed to introduce the task.  The Content  Only could be used to present a Scenario for the task.  The Content with Graphic could be used to give a partial screenshot of the application where specific areas could be highlighted in some manner to help the Learner understand what they must do when the get into the Simulation pages.

Inserting The Topic Mode Selection Screen

 

The Topic Mode Selection Screen is a screen that is always the screen before the Simulation Scenario pages and will always be    the same.  You will not enter any information on this screen. It is just here to show you what it will look like in the final lesson.  You will insert this page where it is needed.

 

 

Inserting a Text Only Screen

1. Many times, the early part of a lesson will contain a Non-Simulation Screen type such as Text Only.  From the Help screens, you should have learned that this type of screen can be used as an introduction to a topic.  A screenshot can be used as part of the introduction.  From the Menu Bar, click Insert Screens, then Insert Text Only Screen.