- Exploring CourseBuilder
- Inserting a Multiple Choice Interaction
- Modifying the Feedback in the Action Manager
- Inserting a Drag and Drop Interaction
- Inserting a Button
- Inserting a Timer
- Inserting a Slider
- Using the General Tab
- Summary
Inserting a Multiple Choice Interaction
The first interaction you'll try is in the Multiple Choice category. There are six different types of multiple-choice questions listed in Table 10.2.
Table 10.2 Multiple Choice Category Interactions
|
Icon |
Interaction Name |
Description |
|
|
True/False |
Two radio buttons enabling the learner to select true or false as an answer. |
|
|
Radio buttons |
Multiple radio buttons enabling the learner to select a single answer. |
|
|
Image radio buttons |
Multiple button images that act like radio buttons, enabling the learner to select a single answer. |
|
|
Image buttons |
Multiple button images enabling the learner to select multiple correct answers. |
|
|
Check box buttons |
Multiple check boxes enabling the learner to select multiple correct answers. |
|
|
Image check box buttons |
Multiple button images that act like check boxes, enabling the learner to select multiple correct answers. |
The Multiple Choice interaction can be sorted into two groups: answer selections that act like radio buttons and answer selections that act like check boxes. These two common form elements function in slightly different ways. Radio buttons act as a group, presenting mutually exclusive values. You should use radio buttons when a question has a single answer. Check boxes function independently, with each check box toggling an answer value on and off. You should use check boxes when a question has multiple answers.
Follow these steps to insert a CourseBuilder interaction into the Web page you created earlier, 1.html in the Quiz directory:
Place the cursor in the Content layer on the left side of the Document window.
Click the CourseBuilder object in the Learning tab of the Insert bar, or use the CourseBuilder interaction command (Insert, CourseBuilder Interaction). The CourseBuilder Gallery appears.
Be sure 4.0+ Browsers is selected as the Target.
Select the Image Radio Buttons multiple choice interaction.
After you select the interaction in the Gallery, the General, Choices, and Action Manager tabs appear along the bottom of the CourseBuilder Interaction dialog box. You can also see the question inserted into the Document window behind the CourseBuilder Interaction dialog box (you might have to move the dialog box out of the way). Usually, you can see the updates you make in the CourseBuilder Interaction dialog box as you set up the interaction.
NOTE
The name of the icon appears when you place the cursor over the interaction icon in the Gallery.
Using the General Tab
All CourseBuilder interactions have a General tab where you set the question stem, when the interaction will be judged, when the answer is correct, and whether you want to limit the time or tries for the question. The General tab also has an option to turn on Knowledge Track, the automatic tracking on the interaction to a learning management system (LMS). You'll learn more about this option in Chapter 15, "Using a Learning Management System."
Select the General tab in the CourseBuilder Interaction dialog box to display the General tab options, shown in Figure 10.7.
){kind=link}
Figure 10.7 Each CourseBuilder interaction has General tab options containing the base items necessary for the interaction.
To configure the General tab for this multiple-choice question, follow these steps:
Leave the default name in the Interaction Name text box. This name is used only by CourseBuilder.
Enter the text for the question in the Question Text text box.
In this interaction, select the When the User Clicks a Button Labeled radio button, and enter Check Answer as the button label. The other settings in the Judge Interaction radio buttons enable you to judge the question when the user clicks a button, immediately when the user clicks a choice, or on some other event. The other event might be after an animation finishes or when the user places the cursor in a certain area of the screen.
The Correct When drop-down list box enables you to specify whether the user must select all the correct answers when there are multiple correct answers. For example, if you asked the question "What regions of the world grow coffee?" you could have the following possible answers: Africa, Antarctica, Greenland, and Indonesia. Both Africa and Indonesia are correct answers. Will you require the learner to select both answers or just one to have the question marked as correct?
For this interaction, you have only a single correct answer, so you can select either choice from the Correct When drop-down list box. Both All Correct and None Incorrect or Any Correct and None Incorrect will cause the interaction to be scored correctly.
5You can skip the Knowledge Track check box for now. You'll deal with this in Chapter 15.
In the Tries Are list box, select Limited To, and type 2 in the Tries text box. In the Time Is list box, select Limited To, and type 15 into the Time text box.
Select the check box next to Reset to add a reset button to the interaction. This button resets the interaction to its original state.
Leave the Layer check box unchecked. This interaction is already contained in a layer. If it was not, however, it's good to choose this setting so that you can easily position the interaction. Be sure you always consult the compatibility guidelines in Table 10.1, as some interactions do not work when placed in layers.
Don't click the OK button yet! You will go on and set up the next two tabs before exiting the CourseBuilder Interaction dialog box and testing the interaction.
Using the Choices Tab
The Choices tab enables you to set up the answer choices, consisting of the correct answer or answers and the incorrect answers (distractors). This tab, shown in Figure 10.8, is divided into an upper and a lower half. The upper half is a list of all the available choices. The lower half displays the attributes (choice options) of the choice selected in the upper half.
){kind=link}
Figure 10.8 The Choices tab enables you to set up the attributes of the correct and incorrect answer choices.
If you receive an error message warning you that CourseBuilder can't find button images, it's because you moved the location of the CourseBuilder images from their default spot. You'll be able to browse for the image files when you are setting up the choices.
Follow these steps to configure the Choices tab for this multiple-choice question:
CourseBuilder displays four choices. Click the Add button to add additional answer choices, and click the Delete button to delete extra choices. You can also rearrange the choice with the Up and Down button.
Select the first choice, choice1. The Choice options appear in the lower half of the dialog box. You can leave the default name in the Name text box as choice1.
You can have text or an image as an answer choice, or you can have both. Enter the answer text in the Text text box and enter the path to an image (if available) in the Image File text box.
Select the type of button in the Appearance drop-down list box. Selecting one of the button images displays a sample of the button to the right of the drop-down list.
Set whether the current answer choice is correct or incorrect in the Choice Is drop-down list box. Set the score for this answer in the Score text box.
Repeat these steps for each of the other three choices. All the choices should have the same button appearance.
Using the Action Manager Tab
The Action Manager tab contains the "brain" of the CourseBuilder interaction. In this chapter, you do not modify the Action Manager because you'll explore that function extensively in the next chapter. In this section, you simply look at the Action Manager and familiarize yourself with its functionality.
Click on the Action Manager tab. The logic of the Action Manager, shown in Figure 10.9, controls the functionality of the CourseBuilder interaction. The logic is divided into three sections, called segments, in this type of interaction. The Check Time segment controls the time limit functionality, the Check Tries segment controls the tries limit functionality, and the Correctness segment directs what happens if the question is answered correctly or incorrectly.
){kind=link}
Figure 10.9 The Action Manager tab controls the logic behind the CourseBuilder interaction.
If a segment is collapsed, you see a plus sign beside the segment name. To see the logic contained in the segment, select the segment name and click the + button. The lines of code in the Action Manager are written in something close to real language—statements that can be understood.
You can see that the default feedback for a correct or incorrect answer is a pop-up message. The pop-up message used in the Action Manager is the same Popup Message behavior you used in Chapter 8, "Creating Interactivity with Behaviors and Animations." Also, notice that when the Check Tries or Check Time segments are triggered, CourseBuilder disables the interaction. Again, you'll learn about editing and inserting this type of functionality into Action Manager in Chapter 11.
Click the OK button to save the CourseBuilder interaction. Preview the Web page in a browser and check the page's functionality. Check that the buttons appear and work the way you expected (only one can be selected at a time). Also, check the Time limit and Tries limit functionality. Be sure you check that the correct answer works and the incorrect answers behave as expected. In the next section, you'll change the generic feedback that CourseBuilder inserts.
Editing an Interaction
When you insert a CourseBuilder interaction into a Web page, the CourseBuilder icon appears if you have invisible elements set as visible (View, Visual Aids, Invisible Elements). You can select this icon to edit an existing CourseBuilder interaction. Sometimes, because of where the CourseBuilder icon is located in the Document window, you cannot see the icon even if invisible elements are showing. You'll learn two additional methods to edit an interaction when that is the case.
TIP
Until you close and save the interaction settings during the initial setup, you can always go back to the Gallery and change the type of CourseBuilder interaction you want to use. After you've closed the CourseBuilder dialog box, you can no longer change the type of interaction because the Gallery tab no longer appears in the CourseBuilder dialog box.
When you select the CourseBuilder icon, the Property inspector displays the CourseBuilder interaction attributes, shown in Figure 10.10. Click the Edit button in the Property inspector to display the CourseBuilder Interaction dialog box, where you edit settings for the interaction.
){kind=link}
Figure 10.10 When the CourseBuilder interaction is selected, the Property inspector displays interaction attributes.
Dreamweaver uses the <interaction> tag to identify CourseBuilder interactions. You can see this tag in the tag selector when you place the cursor anywhere within the CourseBuilder Interaction elements in the Web page. This tag is Dreamweaver specific, is not recognized by the browser, and is simply ignored when the Web page is displayed in the browser. To use the second editing method, select the <interaction> tag in the tag selector to display the CourseBuilder Interaction Edit button in the Property inspector.
The third editing method is to again place the cursor anywhere within the interaction elements. Select the Edit Interaction command (Modify, CourseBuilder, Edit Interaction) to open the CourseBuilder Interaction dialog box. This technique can be tricky when there is more than one interaction in a Web page.
You haven't yet created a Web page with multiple CourseBuilder interactions, but when you do, you can select and edit a specific interaction in the Name drop-down list in the Property inspector, as shown in Figure 10.11.
){kind=link}
Figure 10.11 The Name drop-down list enables you to pick a CourseBuilder interaction to edit when there are multiple interactions in a Web page.