macromedia - LCSHELP Home Page

Transcription

macromedia
®
COURSEBUILDER
for DREAMWEAVER
™
Using CourseBuilder
™
macromedia
Trademarks
Afterburner, AppletAce, Attain, Attain Enterprise Learning System, Attain Essentials, Attain Objects for Dreamweaver, Authorware,
Authorware Attain, Authorware Interactive Studio, Authorware Star, Authorware Synergy, Backstage, Backstage Designer, Backstage
Desktop Studio, Backstage Enterprise Studio, Backstage Internet Studio, Design in Motion, Director, Director Multimedia Studio,
Doc Around the Clock, Dreamweaver, Dreamweaver Attain, Drumbeat, Drumbeat 2000, Extreme 3D, Fireworks, Flash, Fontographer,
FreeHand, FreeHand Graphics Studio, Generator, Generator Developer's Studio, Generator Dynamic Graphics Server, Knowledge
Objects, Knowledge Stream, Knowledge Track, Lingo, Live Effects, Macromedia, Macromedia M Logo & Design, Macromedia Flash,
Macromedia Xres, Macromind, Macromind Action, MAGIC, Mediamaker, Object Authoring, Power Applets, Priority Access, Roundtrip
HTML, Scriptlets, SoundEdit, ShockRave, Shockmachine, Shockwave, Shockwave Remote, Shockwave Internet Studio, Showcase, Tools
to Power Your Ideas, Universal Media, Virtuoso, Web Design 101, Whirlwind and Xtra are trademarks of Macromedia, Inc. and may be
registered in the United States or in other jurisdictions including internationally. Other product names, logos, designs, titles, words or
phrases mentioned within this publication may be trademarks, servicemarks, or tradenames of Macromedia, Inc. or other entities and
may be registered in certain jurisdictions including internationally.
This guide contains links to third-party Web sites that are not under the control of Macromedia, and Macromedia is not
responsible for the content on any linked site. If you access a third-party Web site mentioned in this guide, then you do so at
your own risk. Macromedia provides these links only as a convenience, and the inclusion of the link does not imply that
Macromedia endorses or accepts any responsibility for the content on those third-party sites.
Apple Disclaimer
APPLE COMPUTER, INC. MAKES NO WARRANTIES, EITHER EXPRESS OR IMPLIED, REGARDING THE ENCLOSED
COMPUTER SOFTWARE PACKAGE, ITS MERCHANTABILITY OR ITS FITNESS FOR ANY PARTICULAR PURPOSE.
THE EXCLUSION OF IMPLIED WARRANTIES IS NOT PERMITTED BY SOME STATES. THE ABOVE EXCLUSION MAY
NOT APPLY TO YOU. THIS WARRANTY PROVIDES YOU WITH SPECIFIC LEGAL RIGHTS. THERE MAY BE OTHER
RIGHTS THAT YOU MAY HAVE WHICH VARY FROM STATE TO STATE.
Copyright © 1999 Macromedia, Inc. All rights reserved. This manual may not be copied, photocopied, reproduced, translated, or
converted to any electronic or machine-readable form in whole or in part without prior written approval of Macromedia, Inc.
Part Number ZCB30M100
Acknowledgments
Project Management: Sheila McGinn
Writing: Kim Diezel
Production: Chris Basmajian
First Edition: December1999
Macromedia, Inc.
600 Townsend St.
San Francisco, CA 94103
2
CONTENTS
INTRODUCTION
Getting Started . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 11
What you can do with CourseBuilder for Dreamweaver . . . . . . . . . . . .12
System requirements . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .13
Installing CourseBuilder for Dreamweaver . . . . . . . . . . . . . . . . . . . . . .13
Learning CourseBuilder for Dreamweaver. . . . . . . . . . . . . . . . . . . . . . .14
New user’s checklist. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .16
What’s new in CourseBuilder for Dreamweaver. . . . . . . . . . . . . . . . . . .18
CHAPTER 1
CourseBuilder for Dreamweaver Tutorial . . . . . . . . 21
Tutorial overview. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .21
Set up site structure for the tutorial . . . . . . . . . . . . . . . . . . . . . . . . . . . .22
Define a local site . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .23
Create an explore CourseBuilder Interaction . . . . . . . . . . . . . . . . . . . . .24
Define the hot areas. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .26
Create user feedback . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .31
Create a drag-and-drop interaction . . . . . . . . . . . . . . . . . . . . . . . . . . . .36
Create drag-and-drop pairs . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .40
Create a multiple-choice quiz . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .48
Create a Multiple-choice interaction . . . . . . . . . . . . . . . . . . . . . . . . . . .55
Define the multiple-choice interaction . . . . . . . . . . . . . . . . . . . . . . . . .57
Define the choices . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .59
Define the action. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .61
Test the interaction . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .66
3
CHAPTER 2
CourseBuilder for Dreamweaver basics. . . . . . . . . . 67
CourseBuilder Interaction compatibility with browsers . . . . . . . . . . . . .73
What’s new—step-by-step procedures . . . . . . . . . . . . . . . . . . . . . . . . . .74
Converting from previous versions . . . . . . . . . . . . . . . . . . . . . . . . . . . .75
What to put on the web server . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .76
Troubleshooting . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .76
CHAPTER 3
Multiple-Choice CourseBuilder Interactions. . . . . . 79
Multiple-choice interaction overview. . . . . . . . . . . . . . . . . . . . . . . . . . .79
The multiple-choice templates . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .80
The multiple-choice CourseBuilder Interaction tabs . . . . . . . . . . . . . . .81
Multiple-choice CourseBuilder Interactions—
step-by-step procedures . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .83
True/false questions. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .85
Creating a true/false question . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .86
Replacing “True” and “False” with different words . . . . . . . . . . . . . . . .88
Multiple-choice questions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .88
Creating a multiple-choice question . . . . . . . . . . . . . . . . . . . . . . . . . . .89
Graphic multiple-choice questions . . . . . . . . . . . . . . . . . . . . . . . . . . . .91
Using images instead of text as choices . . . . . . . . . . . . . . . . . . . . . . . . .92
All-that-apply questions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .94
Creating an all-that-apply question . . . . . . . . . . . . . . . . . . . . . . . . . . . .95
Changing the order of the choices . . . . . . . . . . . . . . . . . . . . . . . . . . . . .96
Adding or deleting a choice . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .97
Naming a choice . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .98
Adding an image to a text choice. . . . . . . . . . . . . . . . . . . . . . . . . . . . . .98
4
Contents
CHAPTER 4
Drag-and-Drop CourseBuilder Interactions . . . . . . 99
Drag-and-drop interaction overview . . . . . . . . . . . . . . . . . . . . . . . . . . .99
The drag-and-drop templates . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .100
The drag-and-drop CourseBuilder Interaction tabs . . . . . . . . . . . . . . .102
Drag-and-drop CourseBuilder Interactions—
step-by-step procedures . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .104
One-to-one matching . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .106
One-to-one matching, either way . . . . . . . . . . . . . . . . . . . . . . . . . . . .107
One-to-many matching. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .108
One-to-many matching, either way. . . . . . . . . . . . . . . . . . . . . . . . . . .109
Creating a matching exercise . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .110
The “Build your own” template. . . . . . . . . . . . . . . . . . . . . . . . . . . . . .112
Building your own matching exercise . . . . . . . . . . . . . . . . . . . . . . . . .113
Two-step procedure. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .116
Two-step procedure with a distractor. . . . . . . . . . . . . . . . . . . . . . . . . .117
Creating a procedure . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .118
Building your own procedure . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .120
Replacing placeholder graphics . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .122
Naming a drag-and-drop element . . . . . . . . . . . . . . . . . . . . . . . . . . . .123
Adding and deleting drag-and-drop elements . . . . . . . . . . . . . . . . . . .124
Adding and deleting drag-and-drop pairs . . . . . . . . . . . . . . . . . . . . . .125
A target’s active area . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .126
Setting how an element behaves when dropped. . . . . . . . . . . . . . . . . .127
Making an element a drag element or a target . . . . . . . . . . . . . . . . . . .128
CHAPTER 5
Explore CourseBuilder Interactions. . . . . . . . . . . . . 129
Explore interactions overview . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .129
The explore templates . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .130
The explore CourseBuilder Interaction tabs . . . . . . . . . . . . . . . . . . . .131
Explore CourseBuilder Interactions—step-by-step procedures. . . . . . .133
Random exploration . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .135
Creating a random exploration . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .136
Structured exploration. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .138
Creating a structured exploration . . . . . . . . . . . . . . . . . . . . . . . . . . . .139
Replacing placeholder graphics . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .141
Naming a hot area. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .141
Adding text to a hot area . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .142
Adding and deleting hot areas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .142
Contents
5
CHAPTER 6
Text Entry CourseBuilder Interactions . . . . . . . . . . 143
Text entry interaction overview . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .143
The text entry templates . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .144
The text entry CourseBuilder Interaction tabs. . . . . . . . . . . . . . . . . . .145
Text entry CourseBuilder Interactions—step-by-step procedures. . . . .147
Single-line text entries . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .149
Multiple-line text entries . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .150
Creating a text entry field . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .151
Adding default text to a field . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .153
Naming a response . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .153
Adding and deleting responses . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .154
Checking for correct capitalization . . . . . . . . . . . . . . . . . . . . . . . . . . .154
Checking for an exact match . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .155
Checking for key words or phrases . . . . . . . . . . . . . . . . . . . . . . . . . . .155
Checking for unanticipated responses . . . . . . . . . . . . . . . . . . . . . . . . .156
CHAPTER 7
Enhancements and Customization . . . . . . . . . . . . . 157
Enhancing and customizing CourseBuilder Interactions . . . . . . . . . . .157
Editing CourseBuilder Interactions . . . . . . . . . . . . . . . . . . . . . . . . . . .158
Cutting, copying, pasting, and clearing interactions . . . . . . . . . . . . . .158
Customizing feedback . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .159
Displaying feedback in a frame, layer, status bar, or text field . . . . . . .160
Limiting the number of tries . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .162
Putting a time limit on an interaction . . . . . . . . . . . . . . . . . . . . . . . . .163
Setting when a CourseBuilder Interaction is judged . . . . . . . . . . . . . .163
Changing the name of the Submit button . . . . . . . . . . . . . . . . . . . . . .164
Resetting a CourseBuilder Interaction . . . . . . . . . . . . . . . . . . . . . . . . .165
Inserting a CourseBuilder Interaction into a layer . . . . . . . . . . . . . . . .166
Setting preferences . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .167
Authorware integration . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .167
Using the Insert Authorware object . . . . . . . . . . . . . . . . . . . . . . . . . . .168
Managing CourseBuilder Interaction templates. . . . . . . . . . . . . . . . . .169
Working with Gallery files. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .170
6
Contents
CHAPTER 8
CourseBuilder Interaction Controls . . . . . . . . . . . . . 173
Button CourseBuilder Interactions . . . . . . . . . . . . . . . . . . . . . . . . . . .173
The button templates . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .174
The button CourseBuilder Interaction tabs . . . . . . . . . . . . . . . . . . . . .175
Button CourseBuilder Interactions—step-by-step procedures . . . . . . .176
Toggle switches . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .177
Push buttons . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .178
Creating a button . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .179
Choosing a look for a button . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .182
Highlighting a button . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .182
Changing the initial state of a button . . . . . . . . . . . . . . . . . . . . . . . . .183
Changing the type of button . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .183
Adding custom button graphics . . . . . . . . . . . . . . . . . . . . . . . . . . . . .184
Timer CourseBuilder Interaction . . . . . . . . . . . . . . . . . . . . . . . . . . . .185
The timer templates . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .185
The timer CourseBuilder Interaction tabs . . . . . . . . . . . . . . . . . . . . . .186
Timer CourseBuilder Interactions—step-by-step procedures. . . . . . . .187
Timers. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .189
Creating a timer . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .190
Timers with a warning . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .192
Creating a timer with a warning . . . . . . . . . . . . . . . . . . . . . . . . . . . . .193
Setting a timer. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .195
Setting a trigger. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .195
Choosing a look for a timer. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .196
Naming a trigger . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .196
Adding and deleting triggers . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .197
Judging a response before the first trigger is reached . . . . . . . . . . . . . .198
Adding custom timer graphics. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .198
Slider CourseBuilder Interaction . . . . . . . . . . . . . . . . . . . . . . . . . . . . .200
The slider templates . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .200
The slider CourseBuilder Interaction tabs . . . . . . . . . . . . . . . . . . . . .201
Slider CourseBuilder Interactions—step-by-step procedures . . . . . . . .202
Range sliders . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .204
Creating a range slider. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .205
Point sliders. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .207
Creating a point slider. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .208
Choosing a look for a slider. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .210
Setting a slider’s start and end values . . . . . . . . . . . . . . . . . . . . . . . . . .210
Setting a range. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .211
Contents
7
Naming a range. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .211
Adding and deleting ranges . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .212
Adding custom slider graphics. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .213
CHAPTER 9
Action Manager . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 215
Action Manager CourseBuilder Interactions . . . . . . . . . . . . . . . . . . . .215
Action Manager CourseBuilder Interactions—
step-by-step procedures . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .215
Action Manager pop-up menu . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .217
Adding a segment . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .218
Adding a condition . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .219
Creating expressions for a condition . . . . . . . . . . . . . . . . . . . . . . . . . .221
Adding an action. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .224
Renaming a segment, condition, or action . . . . . . . . . . . . . . . . . . . . .224
Expanding and collapsing a segment or condition . . . . . . . . . . . . . . . .225
Promoting and demoting a condition . . . . . . . . . . . . . . . . . . . . . . . . .225
Editing a segment, condition, or action. . . . . . . . . . . . . . . . . . . . . . . .225
Cutting, copying, and pasting a segment, condition, or action . . . . . .226
Where to create actions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .226
Learning-specific actions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .227
Setting interaction properties . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .238
CourseBuilder Interaction properties. . . . . . . . . . . . . . . . . . . . . . . . . .240
Setting Action Manager properties . . . . . . . . . . . . . . . . . . . . . . . . . . .247
Setting the JavaScript property . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .248
Adding a custom behavior. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .249
Action Manager CourseBuilder Interactions . . . . . . . . . . . . . . . . . . . .249
The Action Manager template. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .250
The Action Manager CourseBuilder Interaction tabs. . . . . . . . . . . . . .250
8
Contents
CHAPTER 10
Scoring and Data Tracking . . . . . . . . . . . . . . . . . . . . 251
Tracking user performance . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .251
Scoring and data tracking—step-by-step procedures . . . . . . . . . . . . . .252
Marking a response right or wrong . . . . . . . . . . . . . . . . . . . . . . . . . . .254
Scoring a response . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .255
Displaying feedback . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .256
Locating the CourseBuilder Interaction identifier in
HTML Source code . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .257
Scoring multiple interactions on the same HTML page . . . . . . . . . . .257
Scoring multiple interactions on different HTML pages . . . . . . . . . . .259
Tracking the time remaining . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .264
Tracking the number of tries . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .265
JavaScript variables for tracking performance . . . . . . . . . . . . . . . . . . .265
Recording performance . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .266
Using Knowledge Track. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .267
Using CourseBuilder for Dreamweaver with Lotus Pathware. . . . . . . .269
Connecting with databases . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .272
Creating the data source . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .273
Collecting data . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .274
Transferring data . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .276
Recording data using Cold Fusion. . . . . . . . . . . . . . . . . . . . . . . . . . . .278
Recording data using ASP . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .279
Recording data with other transport methods . . . . . . . . . . . . . . . . . . .280
Contents
9
CHAPTER 11
CourseBuilder Interaction Options . . . . . . . . . . . . . 281
General options. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .281
Tracking tab . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .287
Choices options. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .287
Drag-and-drop element options . . . . . . . . . . . . . . . . . . . . . . . . . . . . .289
Pairs options . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .289
Hot areas options . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .291
Responses options . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .292
Triggers options. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .293
Ranges options . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .294
Action Manager segments . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .295
Check Time segment. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .296
Correctness segment . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .296
Check Tries segment . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .296
Multiple-choice segments . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .297
One-to-one matching segments. . . . . . . . . . . . . . . . . . . . . . . . . . . . . .297
One-to-one matching (either way) segments . . . . . . . . . . . . . . . . . . . .297
One-to-many matching segments . . . . . . . . . . . . . . . . . . . . . . . . . . . .298
“Build your own” template segments. . . . . . . . . . . . . . . . . . . . . . . . . .298
Two-step procedure segments . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .299
Explore segments. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .300
Toggle-switch segment . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .300
Pushbutton segment . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .301
Text entry segments. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .301
Timer segment . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .301
Timer with warning segment. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .302
Range slider segment. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .302
Point slider segment . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .303
INDEX . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 305
10
Contents
INTRODUCTION
Getting Started
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Macromedia CourseBuilder is an extension application to Dreamweaver for
creating Web-based learning content and interactive Web pages. CourseBuilder
extends Dreamweaver with a set of easy to use templates and tools that simplify
and accelerate the development of online learning content. CourseBuilder for
Dreamweaver is the first visual authoring tool developed specifically for creating
Web-based learning. Learning interactions created with CourseBuilder are
100% Web-native, enabling cross-platform and cross-browser delivery without
plug-ins or applets.
All CourseBuilder Interactions require at least a version 3 browser. Because of the
capabilities of the browsers, some interactions—drag-and-drop, explore, timer,
and slider—work only with version 4 browsers. (See “CourseBuilder Interaction
compatibility with browsers” on page 73.)
11
What you can do with CourseBuilder
for Dreamweaver
CourseBuilder for Dreamweaver helps you quickly design compelling learning
interactions with step-by-step assistance. In minutes, you can:
Create true/false, multiple-choice, and all-that-apply quizzes
See “Multiple-choice CourseBuilder Interactions—step-by-step procedures” on
page 83
Create drag-and-drop matching exercises
See “Drag-and-drop CourseBuilder Interactions—step-by-step procedures” on
page 104
Create explore interactions
See “Explore CourseBuilder Interactions—step-by-step procedures” on
page 133
Create text-entry interactions
See “Text entry CourseBuilder Interactions—step-by-step procedures” on
page 147
Create buttons, timers, and sliders
See “Button CourseBuilder Interactions— step-by-step procedures” on
page 176
See “Timer CourseBuilder Interactions—step-by-step procedures” on page 187
See “Slider CourseBuilder Interactions— step-by-step procedures” on page 202
CourseBuilder for Dreamweaver lets you define a complete Web-based learning
interaction. Choose which type of interaction you want to create from the
CourseBuilder Interactions Gallery (see “CourseBuilder Interaction Gallery” on
page 71). You can edit the content of a CourseBuilder Interaction, so you don’t
have to start from scratch if you want to make changes. You can extend the
CourseBuilder Interaction’s built-in functionality by creating your own
interaction templates.
CourseBuilder includes both traditional learning interactions (multiple choice,
drag and drop, explore, text entry) and learning interactions that function
much like desktop controls (buttons, timers, and sliders). You can combine
CourseBuilder Interactions—for example, you can include a timer object with a
drag-and-drop object that records how long the user takes to complete the dragand-drop interaction. You can use an Action Manager CourseBuilder Interaction
to control conditions and actions for any or all other CourseBuilder Interactions
on the page.
12
Introduction
System requirements
The following hardware and software is required to run CourseBuilder for
Dreamweaver.
For Microsoft Windows™:
An Intel Pentium® 133-MHz or equivalent processor running Windows 95,
Windows 98, or Windows NT version 4.0 or later.
32 MB of random-access memory (RAM) plus 30 MB of available disk space.
A color monitor capable of 800 x 600 pixel resolution.
A CD-ROM drive.
For the Macintosh®:
A Power Macintosh, running Mac OS 8.1 or later.
32 MB of RAM with virtual memory set to 64 MB, plus 30 MB of available
disk space.
A color monitor capable of 800 x 600 pixel resolution.
A CD-ROM drive.
Installing CourseBuilder for Dreamweaver
Follow these steps to install CourseBuilder for Dreamweaver on either a Windows
or a Macintosh computer.
To install CourseBuilder for Dreamweaver:
1
Insert the CourseBuilder for Dreamweaver CD into the computer’s
CD-ROM drive.
2
Choose from the following options:
In Windows, choose Start > Run. Click Browse and choose the Setup.exe
file on the CourseBuilder for Dreamweaver CD. Click OK in the Run dialog
box to begin the installation.
On the Macintosh, double-click the CourseBuilder for Dreamweaver
Installer icon.
3
Follow the on-screen instructions.
4
If prompted, restart your computer.
Getting Started
13
Learning CourseBuilder for Dreamweaver
The CourseBuilder for Dreamweaver package contains a variety of resources to
help you learn the program quickly and become proficient in creating your own
Web page interactions. These resources include online HTML help pages that
appear in your browser, a tutorial, and a printed book. In addition, the
CourseBuilder for Dreamweaver Web site is updated regularly.
CourseBuilder for Dreamweaver Help
The CourseBuilder for Dreamweaver HTML help pages provide comprehensive
information about all CourseBuilder Interaction features. These browsers are
strongly recommended for viewing CourseBuilder for Dreamweaver Help:
In Windows: Netscape Navigator 4 and later or Microsoft Internet Explorer 4
and later
On the Macintosh: Netscape Navigator 4 and later
If you use a 3 browser, all the content is still accessible, but some features (such as
Search) will not work.
CourseBuilder for Dreamweaver Help makes extensive use of JavaScript. Make
sure that JavaScript is enabled in your browser. If you plan to use the search
feature, make sure that Java is enabled as well.
CourseBuilder for Dreamweaver Help includes the following components:
enables you to see all information organized by subject.
Click top-level entries to view subtopics.
The table of contents
like a traditional printed index, can be used to find important terms
and go to related topics.
The index,
allows you to find any character string in all topic text. The search feature
requires a version 4 browser with Java enabled.
Search
Note: After clicking Search, a Java security window may appear, asking for permission to
read files on your hard disk. You must grant this permission for the search to work. The
applet does not write anything to your hard disk, nor does it read any files outside the
HTML help pages.
To search for a phrase, simply type the phrase in the text field.
To search for files that contain two keywords (for example, text and entry),
separate the search terms with a plus (+) sign.
14
Introduction
Context-sensitive help provides a Help button in each dialog box, or a question
mark icon in inspectors, windows, and palettes, that opens a relevant help topic.
provides buttons you can click to move through topics.
The Previous and Next buttons move to the previous or next topic in a section
(following the topic order listed in the table of contents).
The Help navigation bar
CourseBuilder for Dreamweaver tutorial
The CourseBuilder for Dreamweaver tutorial is the best place to start if you don’t
have very much experience in developing Web-based learning interactions. By
working through the tutorial, you’ll learn how to create learning interactions with
some of CourseBuilder’s most useful and powerful features. The tutorial is in both
CourseBuilder for Dreamweaver Help and the Using CourseBuilder for
Dreamweaver book.
CourseBuilder for Dreamweaver user’s guide (printed book)
The Using CourseBuilder for Dreamweaver book provides a printed alternative to
CourseBuilder for Dreamweaver Help.
CourseBuilder for Dreamweaver Support Center
The CourseBuilder for Dreamweaver Support Center Web site is updated
regularly with the latest information on CourseBuilder for Dreamweaver, plus
advice from expert users, information on advanced topics, examples, tips, and
updates. Check the Web site often for the latest news on CourseBuilder for
Dreamweaver and how to get the most out of the program at
http://www.macromedia.com/support/coursebuilder.
Getting Started
15
New user’s checklist
CourseBuilder for Dreamweaver is a sophisticated tool that’s both powerful and
easy to use. You’ll learn the basics quickly. Other things will take you more time to
master. This checklist will help you find the resources you need to learn everything
you need to know about using CourseBuilder for Dreamweaver.
Work through the tutorial.
Read this book.
Using CourseBuilder for Dreamweaver is the ideal place to find the concepts
behind using CourseBuilder Interactions. Don’t overlook the lists of step-bystep procedures. They give you an overview of all the things you can do and tell
you where to find detailed instructions.
The material in this book is available online throughout CourseBuilder for
Dreamweaver Help. Choose Help > Using CourseBuilder for Dreamweaver.
The CourseBuilder for Dreamweaver Help Pages are always the quickest way to
find the answers to your questions. Use the index to search for the topic you’re
interested in.
Visit the CourseBuilder for Dreamweaver Support Center.
It’s a rich source of information about CourseBuilder for Dreamweaver that
includes articles by expert users on new features and common problems,
regular installments of new Show Me examples, and information about books
and Web sites, user groups and events, and tools and services you may need.
Click the What’s New button at the top of the Help Pages browser or visit
www.macromedia.com/support/courseBuilder.
Join the DWARE list.
The DWARE discussion list is an online forum for discussing CourseBuilder
for Dreamweaver. This list is maintained, not by Macromedia, but by
CourseBuilder for Dreamweaver developers worldwide. It’s a great way to share
your problems with and learn from expert users from around the globe.
To subscribe to the DWARE discussion list, send the following message to
[email protected]:
SUBSCRIBE DWA Your_First_Name Your_Last_Name
For example, SUBSCRIBE DWA Chris Chen
You can remove your name from the list any time by sending a SIGNOFF
DWA command to [email protected].
Check the CourseBuilder for Dreamweaver TechNotes when you have
a problem.
16
Introduction
If you’re having a problem, chances are that Technical Support has already
solved the problem for someone else.Check the CourseBuilder for
Dreamweaver Discussion Group.
If you’re having a problem, and you can’t find the answer in the TechNotes,
check the CourseBuilder Discussion Group. The discussion group is part of the
CourseBuilder for Dreamweaver Support Center. Visit www.macromedia.com/
support/coursebuilder.
Join a user group.
Other developers can help you over a lot of hurdles. The best place to meet
them is at a user group. For a list of user groups, visit www.macromedia.com/
support/coursebuilder.
Getting Started
17
What’s new in CourseBuilder for Dreamweaver
CourseBuilder for Dreamweaver is the new name for the product originally called
Dreamweaver Attain or Attain Objects for Dreamweaver.
CourseBuilder for Dreamweaver is fully compatible with Dreamweaver 3 allowing
you to expand on the flexibility and power of Dreamweaver as you create
interactive learning content.
If you’ve worked with Attain Objects for Dreamweaver, most of the changes you
see will be interface changes related to the new product name and enhanced
integration with Dreamweaver 3.
If you’ve worked with Dreamweaver Attain, you’ll see more significant changes
and new features: saving custom CourseBuilder Interactions to the Gallery,
creating Pathware framesets, and copying support files have all been streamlined.
Behind the scenes, CourseBuilder for Dreamweaver creates and manages code
differently, resulting in more compact HTML and eliminating code duplication.
Interface enhancements
allow you to easily select an interaction to make
edits to, copy, or cut. See CourseBuilder for Dreamweaver basics.
CourseBuilder Interaction icons
has been added to identify CourseBuilder
Interactions. When you select a CourseBuilder Interaction, <interaction> appears
in the tag selector. See CourseBuilder for Dreamweaver basics.
The new <interaction> tag
contains a list of all
the CourseBuilder Interactions on the page and an Edit button, which you can
use to reopen the CourseBuilder Interaction dialog box to make changes to a
selected interaction. See “Editing CourseBuilder Interactions” on page 158.
A custom Property inspector for CourseBuilder Interactions
Improved functionality
let you make changes in the CourseBuilder Interaction dialog box
appear immediately in the Document window. Live updating allows you to see
information as you enter it and changes as you make them.
Live updates
now undoes each single change rather than all of the changes
you make to one CourseBuilder Interaction. Often, the change you’re undoing
may not be apparent. For example, if you change the answer of a multiple-choice
question from true to false, and then undo it, you won’t see any change in the
Document window.
The Undo Command
is now prompted. When you add a CourseBuilder
Interaction from the Object palette, you’ll be prompted to copy the support files
to the folder that contains your document. Support files refers to the scripts and
images CourseBuilder for Dreamweaver adds to a page as it builds the
CourseBuilder Interaction. See “Copying support files” on page 68.
Copying support files
18
Introduction
Customizing CourseBuilder Interactions
places a CourseBuilder Interaction in its own layer,
thereby simplifying Netscape layer issues and allowing absolute placement of the
interaction on the page. Inserting the interaction into its own layer also
facilitates the use of various actions, such as Show-Hide layers. This feature is
available only in version 4 browser interactions. See “Inserting a CourseBuilder
Interaction into a layer” on page 166.
The Insert in Layer option
is now possible. You can edit the order of
the items listed on the Actions pop-up menu to fit the way you work. See “Action
Manager pop-up menu” on page 217.
Customizing the Actions pop-up menu
is now easier because the list of behaviors in the Action
Manager is now dynamically generated. Copy custom behaviors to the folder
Dreamweaver\Configuration\Behaviors\Actions, and they will be visible both at
the bottom of the Action Manager pop-up menu and in the Behavior window the
next time you launch CourseBuilder for Dreamweaver. For information about
custom behaviors, see “Adding a custom behavior” on page 249.
Adding custom behaviors
Action Manager changes
are now dialog boxes instead of tabs. The
Segment, Condition, or Action Editor appears when you add a segment,
condition, or action or when you click the Edit button to edit one, thereby
eliminating the confusion caused by switching between tabs to edit information.
Segment, Condition, and Action Editors
Edit and Rename buttons
are now available in the Action Manager tab:
The Edit button reopens the dialog box for a selected segment, condition, or
action, making it easier for you to make edits. See “Editing a segment,
condition, or action” on page 225.
The Rename button allows you to rename elements in the Action Manager. See
“Renaming a segment, condition, or action” on page 224.
Help buttons
now appear on every tab in the CourseBuilder Interaction
dialog box.
Getting Started
19
Menu changes
CourseBuilder Interaction commands can now be found on one of two menus—
the Insert menu and the Modify menu.
in the Insert menu displays the
CourseBuilder Interaction dialog box, from which you can insert a CourseBuilder
Interaction into your document.
The Insert CourseBuilder Interaction command
New Modify commands The CourseBuilder Interaction commands in the Modify
menu display a submenu of commands to specifically use with CourseBuilder for
Dreamweaver:
The Edit Interaction command brings up the CourseBuilder Interaction dialog
box from which you can edit a CourseBuilder Interaction.
The Add CourseBuilder Interaction to Gallery command saves custom
CourseBuilder Interactions for easy, reusable access in the CourseBuilder
Interaction Gallery. See “Adding a CourseBuilder Interaction template to the
Gallery” on page 169.
The Create Tracking Frameset and Create Pathware Frameset commands allow
you to create the frameset and results files needed for tracking student
performance either in Lotus Pathware or in another computer-managed
instruction (CMI) tracking system. See “Using Knowledge Track” on page 267.
The Copy Support Files command copies the support files (scripts and images)
to the same folder in which CourseBuilder for Dreamweaver document has
been saved. Without the support files, a CourseBuilder Interaction may not
work or may not be able to find the images it needs.
The Convert From Previous Version command converts pages made with the
previous version of Dreamweaver Attain so that they can be edited in
CourseBuilder for Dreamweaver. See “Converting from previous versions” on
page 75.
Improved integration
The Insert Authorware button lets you place a Web-packaged Authorware piece on
a Web page. See “Using the Insert Authorware object” on page 168.
20
Introduction
1
CHAPTER 1
CourseBuilder for Dreamweaver
Tutorial
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Tutorial overview
This tutorial shows you how to use CourseBuilder for Dreamweaver to create
three types of learning interactions.
As you develop a web-based sales training module for sales representatives of
Discovertoys.com, a fictitious company, you’ll create an explore interaction (where
a user clicks areas on a page to gain more information about an object), a
multiple-choice interaction (where a user selects a correct response from a set of
choices), and a drag-and-drop interaction (where a user demonstrates knowledge
by dragging one object on the screen to another object on the screen).
You need Netscape Navigator 4 or Microsoft Internet Explorer 4—or a later
version of either browser—to view the pages you create in this tutorial.
Along the way you’ll learn how to perform the following tasks:
Copy support files to a local site folder
Insert CourseBuilder Interactions in a document
Use the CourseBuilder Interaction dialog box to select an interaction template
Customize CourseBuilder Interaction templates
Use the Action Manager to attach actions to an interaction
Edit CourseBuilder Interactions
Test an interaction
21
Preview the completed Discover Toys interaction
Take a look at the completed CourseBuilder for Dreamweaver files to get an idea
of what you’re working toward. In the folder in which you installed CourseBuilder
for Dreamweaver, open the folder named cb_tutorial. Then locate the folder
named discover_comp, and double-click the file named discover_nav.htm.
The discover_nav page opens in your browser, click the buttons on this page to
navigate to other pages of the site.
Try all of the possible combinations of correct and incorrect responses on the quiz
pages to see how the interactions work. Click Refresh or Reload in the browser to
restart an interaction.
Close the browser when you’re finished looking at the files.
How the tutorial files are arranged
The cb_tutorial folder contains both the completed and partially completed
HTML files used in this tutorial.
The completed files are in the discover_comp folder. Images and other associated
files for the completed files are in folders within the discover_comp folder. The
partially completed files—which you’ll be working on—are in the cb_discover
folder. (The complete path to the discover_comp folder will vary, depending on
where you have CourseBuilder for Dreamweaver installed.)
Each file has a meaningful name—for example, the HTML file for the completed
module’s navigation page is named discover_nav.htm.The partially completed files
have names similar to their counterparts in the complete site, except they begin
with cb_; the partially completed version of discover_nav.htm, for example, is
called cb_nav.htm.
Set up site structure for the tutorial
Before you start the tutorial, create a new folder into which you’ll transfer the
CourseBuilder for Dreamweaver tutorial files.
If you completed the Dreamweaver tutorial and already created a Sites folder,
skip step 1.
22
Chapter 1
1
At the root level of your local disk, create a new folder and name it Sites—for
example, C:\Sites (Windows) or Hard Drive:Sites (Macintosh).
2
From the Dreamweaver\CourseBuilder\Tutorial folder, copy the entire
cb_tutorial folder to the Sites folder.
Define a local site
Set up a local site to develop a file structure for your site. A local site contains all
the files used within a specified site, such as HTML files, images, scripts, and
other asset files. For this tutorial, you’ll specify the cb_tutorial folder as the local
site folder.
1
Launch CourseBuilder for Dreamweaver.
A blank document opens.
2
Choose Site > New Site.
3
In the Site Definition dialog box, make sure Local Info is selected in the
Category list.
4
In the Site Name field, type my_course.
5
Click the folder icon to the right of the Local Root Folder field, navigate to
the Sites\cb_tutorial folder, and then click Select (Windows) or Choose
(Macintosh).
The Local Root Folder field updates to display the path to the local site.
Note: The complete path to the cb_tutorial folder may vary, depending on where you
have created your Sites folder.
6
Click OK.
CourseBuilder for Dreamweaver Tutorial
23
7
Click Create when asked if you’d like to create a cache file for the site.
Caching the files in the cb_tutorial folder creates a record of existing files
so Dreamweaver can quickly update links when you move, rename, or
delete a file.
The Site window now displays a list of the folders and files in the local site
my_course. The list also acts as a file manager, allowing you to copy, paste,
delete, move, and open files just as you would in the file finder or explorer on
your own computer.
8
Leave the Site window open.
9
Click the Document window to make it active.
Create an explore CourseBuilder Interaction
CourseBuilder Interactions cannot be added to an unsaved document. You
can either start with a new document, then save it, or you can open an existing
document.
In this tutorial, you’ll add CourseBuilder Interactions to existing partially
completed pages which contain the same elements—a background image and a
training department banner.
Now, you’ll create an explore interaction. In this interaction users click pictures of
the toy products to learn about them.
Open the file to which you’ll add an explore CourseBuilder Interaction.
24
Chapter 1
1
Choose File > Open.
2
In the dialog box that appears, navigate to Sites/cb_tutorial/cb_discover, then
select cb_explore.htm, and click Select (Windows) or Open (Macintosh) to
open the file.
Copy support files
CourseBuilder for Dreamweaver requires support files that contain images and
scripts; the support files enable CourseBuilder Interactions to function.
You’ll copy support files to the cb_discover folder.
1
Choose Modify > CourseBuilder > Copy Support Files.
A message appears advising where the support files will be copied.
2
Click OK to create the necessary folders and to copy the files.
The files are copied to the cb_discover folder.
Insert a CourseBuilder Interaction
1
If the Object palette isn’t already open, choose Window > Objects to open it.
2
In the Document window, click in the middle of the document to place the
insertion point after existing page elements.
3
In the Object palette’s Common panel, click the CourseBuilder Interaction
icon to open the CourseBuilder Interaction dialog box.
CourseBuilder Interaction icon
25
Select the type of interaction
1
In the CourseBuilder Interaction dialog box, under Target, 4.0+ Browsers
should already be selected. If it is not, select it.
2
Select Explore in the Category list.
The icons in the Gallery represent the explore CourseBuilder Interactions that
function in version 4 and later browsers.
3
Click the icon for the Explore_Areas template.
Define the hot areas
You don’t need to change the default settings that are in the General tab, so you’ll
begin by specifying the hot area elements of the explore interaction—graphic
images of the toys the users will click.
26
Chapter 1
Add graphics for the hot areas
1
Start by clicking the Hot Areas tab.
In the Hot Areas list, Hot Area1 is already selected.
2
In the Image field, click Browse. Then, in the Select Appearance dialog box,
navigate to the cb_graphics folder and select toy_racer.gif. Then click Select
(Windows) or Choose (Macintosh) to display the image.
Add three more hot area graphics
1
In the Hot Areas list, select HotArea2.
2
navigate to the cb_graphics folder and select toy_coldfusion.gif. Then click
Select (Windows) or Choose (Macintosh) to display the image.
3
4
navigate to the cb_graphics folder and select toy_satellite.gif. Then click Select
5
6
In the Image field, click Browse. Then in the Select Appearance dialog box,
navigate to the cb_graphics folder and select toy_waverider.gif. Then click
7
Click OK to close the CourseBuilder Interaction dialog box.
8
Save your file.
27
Arrange the hot areas in the document
Next, you’ll remove the text instructions on the page, and move the hot area layers
to make room for a new layer that you’ll use to provide feedback to users.
1
In the Document window, select the text “Click on a hot area” at the top of the
screen, then press Backspace (Windows) or Delete (Macintosh) to delete it.
2
In the Document window, click the border of a hot area layer to select the layer.
Handles appear around a selected layer:
Layer tab
Layer handle
3
Click the layer tab, on the upper left corner, then drag the layer where you want
to position it.
Move each hot area, as necessary, to position the layers like this:
4
28
Chapter 1
Save your changes.
Add a layer for user feedback
Next, you’ll create a layer where both instructions to the user and the product
information will appear in the page.
1
Click the Layer icon on the Object palette.
Image icon
Layer icon
2
Move the pointer to the Document window, then drag to draw a layer in the
right side of the document.
3
Click the border of the layer to select it. Then, in the Property inspector’s
LayerID field, replace the default text “Layer1” by typing ProductInfo.
4
In the Document window, click in the middle of the ProductInfo layer to set
the insertion point in the layer.
5
In the Object palette, click the Image icon to insert an image in the layer.
The Select Image Source dialog box appears.
29
6
In the dialog box, navigate to the cb_graphics folder, select text_any.jpg, and
click Select (Windows) or Choose (Macintosh) to insert the image in the layer.
The user instructions appear in the layer in the Document window.
Editing a CourseBuilder Interaction
The elements are set up; however, you still need to define what happens when a
user clicks one of the hot areas. To ensure that your interactions function correctly,
always make changes to the elements of a CourseBuilder Interaction in the
CourseBuilder Interaction dialog box. Reopen the CourseBuilder Interaction
dialog box.
1
In the Document window, do one of the following to select the CourseBuilder
Interaction:
Click the CourseBuilder Interaction icon in the Document window.
Click any of the hot area layers, then click <interaction> in the tag selector.
2
30
Chapter 1
In the Property inspector, click Edit to open the CourseBuilder Interaction
dialog box.
Create user feedback
When users clicks a hot area, they should learn about the product they selected.
You’ll set up a swap image to switch the image displayed in the ProductInfo layer
with an image that contains information about the product that was clicked.
Use the Action Manager to define what happens when a specific hot area is
clicked. You’ll remove the default Popup Message action feedback and add a Swap
Image action for each hot area.
View the Action Manager tab
Start by clicking the Action Manager tab.
The Action Manager tab displays default segments and conditions based on the
type of interaction selected. Segments preceded by a plus sign (+) are collapsed. To
view the conditions and actions of a selected collapsed segment, click Expand in
the Action Manager tab.
Action flows from the top of the list down until a defined condition is met—for
example, if a user clicks Hot Area 1. When a defined condition is met, action
flows to the next item within that segment—for example, if Hot Area 1 is clicked,
a Popup Message would be displayed.
Although segments are automatically added in the Action Manager to check the
time limit and tries limit, the actions for these segments aren’t triggered unless you
select these options in the General tab.
31
Add a swap image action for racer product information
1
In the Action Manager list under “if Hot Area1 Selected,” select Popup
Message, then click Cut.
2
Select “if Hot Area1 Selected,” then in the Actions pop-up menu choose Swap
Image, and click Add.
The Swap Image dialog box appears:
In the Swap Image dialog box, “unnamed <img>” is selected. This is the image
you inserted in the ProductInfo layer. You’ll swap this image for an image that
describes the image in Hot Area 1, the racer.
32
Chapter 1
3
In the “Set Source to” field, click Browse.
4
In the Select Image Source dialog box that appears, select text_racer.jpg, then
click Select (Windows) or Choose (Macintosh) to display the image.
5
Click OK to close the dialog box.
Add a swap image action for Cold Fusion product information
Replace the user instruction text with text describing the Cold Fusion Kit.
1
2
The Swap Image dialog box appears.
In the Swap Image dialog box’s Images list, “image ‘Image1’ in layer
‘ProductInfo’” is already selected, and the image is set to display text_racer.jpg.
You’ll set the image to display the correct text for Hot Area 2, the Cold Fusion
product.
3
In the “Set Source to” field, click Browse.
4
In the Select Image Source dialog box, select text_coldfusion.jpg, then click
5
33
Add a swap image action for satellite product information
Replace the user instruction text with text describing the satellite.
1
2
3
‘ProductInfo’” is already selected. Click Browse next to the “Set Source to” field
to select the replacement image.
4
In the Select Image Source dialog box, select text_satellite.jpg, then click Select
5
Add a swap image action for wave-rider product information
Now, you’ll replace the user instruction text with text describing the
wave-rider helmet.
34
Chapter 1
1
2
3
‘ProductInfo’” is already selected. Click Browse next to the “Set Source to” field
to select the replacement image.
4
In the Select Image Source dialog box, select text_waverider.jpg, then click
5
6
Create a link to the next page
Link this page to the next interaction page, the drag-and-drop quiz.
1
In the Object palette’s Common panel, click the Layer icon, then move the
pointer to the page, and drag to draw a layer in the space beneath the
ProductInfo layer.
2
Click the layer to select it, then move the layer if you need to position it.
Use the layer tab on the upper left corner of the layer to position the layer:
3
Click in the layer to place the insertion point in the layer. In the Object
palette, click the Image icon to insert an image in the layer.
4
In the Select Image Source dialog box, open the cb_graphics folder (if it’s not
already open), select Arrow_Sharp_Right.gif, and click Select (Windows) or
Choose (Macintosh).
An arrow appears in the layer.
5
In the Property inspector, click the folder icon next to the Link field. Then, in
the Select File dialog box, navigate to the cb_discover folder, select
cb_drag_drop.htm, and click Select (Windows) or Choose (Macintosh) to
select the file to open when the arrow is clicked.
6
Click the border of the layer to select it, then use one of the handles to resize
the layer to the size of the graphic.
7
Save your document.
35
Test the explore interaction
Test the page to see how the interaction works.
1
Choose File > Preview in Browser, and choose the browser you want to use.
The browser launches and displays the page.
2
Click each of the products and make sure the correct information appears.
3
Click the arrow to see if it goes to the “Know your target audience” page.
Create a drag-and-drop interaction
Now you’ll create a drag-and-drop matching quiz. Users will test their
knowledge of the products by dragging a toy to the target audience for which
the toy is designed.
1
Choose File > Open. In the dialog box that appears, navigate to
cb_drag_drop.htm, and click Select (Windows) or Open (Macintosh) to
open the file.
2
3
4
In the Object palette’s Common panel, click the CourseBuilder
Interaction icon.
The CourseBuilder Interaction dialog box appears.
36
Chapter 1
1
In the CourseBuilder Interaction dialog box, under Target, select 4.0+ Browsers
if it isn’t already selected.
2
Select Drag and Drop in the Category list.
3
Click the icon for the many-to-many matching template.
37
Define the General tab options
Use the tabs in the CourseBuilder Interaction dialog box to define this interaction.
As you select options in the tabs, you specify how the CourseBuilder Interaction
will perform.
The default settings of the CourseBuilder Interactions are designed for ease of
use. You’ll find that most of the options you’d select for your interactions are
the options that are set as the current defaults. You’ll only need to change a
few settings to customize the information for courses, surveys, or quizzes
you’re creating.
Use the options of the General tab to define how the interaction responds when a
user interacts with it.
1
Click the General tab.
2
Under Judge Interaction, select “when the user drops a drag element.”
This option causes feedback to display every time the user moves a toy image to
a target audience image—rather than waiting until the user has tried to match
every toy with a target audience.
3
Under Reset, accept the default setting “Create a Reset button for this
Interaction.”
4
Under Reaction, select “Snap back if incorrect.”
This returns the toy to its original position if the user drags it to the wrong
target audience.
38
Chapter 1
5
Under Reaction, accept the default setting “Snap back if not dropped
on target.”
This returns the toy to its original position if the user drags it somewhere other
than a target area.
6
Under Layer, select “Insert this Interaction in a layer” to place the question text
in a layer, making it easy for you to position the text in the document. (Each of
the drag-and-drop images is already in an individual layer.)
Your General tab should be set as the shown here:
39
Create drag-and-drop pairs
Now you’ll add the drag and drop elements to the interaction. You’ll add three
drag images and three target images.
Drag-and-drop matching exercises are made up of pairs of drag and target objects.
For example, the satellite is a drag object. Its target object is an image of its target
audience: kids with big imaginations. In this step, you replace the drag-and-drop
template’s placeholder graphics with the images you want to use for the drag and
target objects.
Add drag images
1
Click the Elements tab.
Drag1 is already selected in the Elements list.
40
Chapter 1
2
In the Name field, type satellite.
3
Click the Browse button next to the Image File box. In the cb_graphics folder,
select toy_satellite_mini.gif, then click Select (Windows) or Choose
(Macintosh) to display the image for this drag object.
4
In the Elements list, select Drag2; then in the Name field, type waverider.
5
Click the Browse button. In the cb_graphics folder, select
toy_waverider_mini.gif, then click Select (Windows) or Choose (Macintosh) to
display the image for this drag object.
6
In the Elements list, select Drag3; then in the Name field, type racer.
7
Click the Browse button. In the cb_graphics folder, select toy_racer_mini.gif,
then click Select (Windows) or Choose (Macintosh) to display the image for
this drag object.
Add target images
Next, add the target images that match the drag objects:
1
In the Elements list, select Target1; then in the Name field, type satellitematch.
2
Click the Browse button. In the cb_graphics folder, select kids_climbing.jpg,
then click Select (Windows) or Choose (Macintosh).
3
In the Elements list, select Target2; then in the Name field, type
waveridermatch.
4
Click the Browse button. In the cb_graphics folder, select kids_bike.jpg, then
click Select (Windows) or Choose (Macintosh).
5
In the Elements list, select Target3; then in the Name field, type racermatch.
6
Click the Browse button. In the cb_graphics folder, select kids_soccer.jpg, then
Your screen should look like this.
7
41
Position the images in the document
Now you’ll arrange the layers in the Document window to set up the interaction.
1
In the Document window, select a layer by clicking its border.
2
Use the layer tab to drag the layers in your document to match this
screen layout.
3
In the Document window, use the pointer to select the default text “Drag the
objects on the left to the correct targets on the right, then press the ‘Submit’
button to check the answer.” Replace the text by typing
Ready to sell? Drag each toy to its target customer.
42
Chapter 1
Set snap to settings
You’ve already set what happens when a match is incorrect: the toy snaps back to
its original position. But what happens when the match is correct? Where does the
toy land? In this step, you’ll precisely set the position of the toy when the toy is
dragged to the correct target audience.
You need to set up the snap behavior of the correct pairs only; the incorrect pairs
are already set.
1
Click one of the images in the drag-and-drop interaction, then click
<interaction> in the tag selector, and click Edit in the Property inspector.
2
Click the Pairs tab.
Notice that because you set matches for the Drag1 and Target1 elements, the
matching pairs are already set up: satellite and satellitematch are a correct
match, but satellite and waveridermatch are an incorrect match.
3
Select the “satellite:satellitematch” pair if it isn’t already selected.
43
4
Under Snap To, select “pixels down,” and in the pixel down field type 70. Then
“select pixels to right of the target element’s upper left corner,” and in this
field type 30.
Your screen should look like this.
When a match occurs, the drag element will move to these precise positions in
the target element.
44
Chapter 1
5
Select the “waverider:waveridermatch” pair.
6
Under Snap To, select “pixels down,” and in the “pixels down” field type 70.
Then select “pixels to the right of the target element’s upper left corner,” and in
this field type 30.
7
Select the “racer:racermatch” pair.
8
Under Snap To, select “pixels down,” and in the “pixels down” field type 70.
Then select “pixels to the right of the target element’s upper left corner,” and in
this field type 30.
Users get feedback only if they make a match that’s correct. If a match is wrong,
the toy snaps back to its original position so the user can try again. The entire
interaction is correct only when the user gets all three matches correct. For this
interaction there are two different types of feedback: one when a match is correct,
one when the entire interaction is correct.
Set feedback for a correct response
The “if Correct” condition controls what happens when the entire interaction
is correct.
1
Click the Action Manager tab.
2
Select the Popup Message action under “if Correct,” and click Edit.
The Popup Message dialog box appears.
3
In the dialog box’s Message field, change the default text, “Correct,” by typing
You’re ready to sell!
4
Delete default feedback for an incorrect or unknown response
You won’t set the next condition, “else if Incorrect,” because you aren’t providing
feedback to users when they make an incorrect match. Additionally, you won’t set
a response for “else if Unknown Response,” because it’s impossible for users to
respond in a way that you can’t identify.
1
Select “else if Incorrect,” and click Cut.
2
Select “else if Unknown Response,” and click Cut.
The conditions and their associated Popup Message actions are
automatically cut.
45
Add correct match feedback
Now you’ll add another condition to provide users with feedback when they make
a correct match while in the process of completing the interaction. Until the entire
interaction is complete with the “all correct and none incorrect” condition met,
correct matches receive this feedback.
1
In the Action Manager list, select the Popup Message action below “if Correct,”
choose Else from the Actions pop-up menu, and click Add.
Else is added to the Action Manager list.
2
With “-- else” selected, choose Popup Message in the Actions pop-up menu,
and click Add.
The Popup Message dialog box appears.
46
Chapter 1
3
In the Message field, type That’s right!.
4
5
6
Choose File > Save to save your document.
Create a link to the next interaction
Link this page to the final page of your course, the multiple-choice quiz.
1
In the Object palette, click the Layer icon, then move the pointer to the
Document window, and drag the pointer to draw a layer in the lower right area
of the document.
2
Select the layer, then position it using the layer tab to position the layer.
3
Click in the layer. In the Object palette, click the Image icon to insert an image
in the layer.
4
In the Select Image Source dialog box, navigate to the cb_graphics folder, select
Arrow_Sharp_Right.gif, and click Select (Windows) or Choose (Macintosh).
An arrow appears in the layer.
5
In the Property inspector, click the folder icon next to the Link field to select
the file to open when the arrow is clicked.
6
In the Select File dialog box, in the cb_discover folder, select cb_mc.htm, and
7
Click the border of the layer to select it, then use one of the layer handles to
resize it to fit the graphic.
Test the drag-and-drop interaction
Test the page to see how it works:
1
Choose File > Save, then choose File > Preview in Browser.
The browser launches and displays the page.
2
Drag the toys to the descriptions.
These are the correct matches:
Satellite and “Kids 12 to 14 with big imaginations”
Wave-rider helmet and “Kids 8 to 14 who bike to school”
Racer and “Preteen boys looking for a testosterone rush”
When you drag a toy to the wrong target, it should snap back to its
original position.
When you drag a toy to the right target, a message should appear saying,
“That’s right!”
When you match all the toys with their correct targets, a message should appear
saying, “You’re ready to sell!”
47
Create a multiple-choice quiz
In this part of the tutorial you’ll create a multiple-choice quiz. When the user
selects from a list of choices, feedback is provided based on the user’s correct or
incorrect response.
1
Choose File > Open. In the dialog box that appears, navigate to the cb_discover
folder and then to cb_mc.htm, and click Select (Windows) or Open
(Macintosh) to open the document.
2
3
4
In the Object palette’s Common panel, click the CourseBuilder Interaction
icon to open the CourseBuilder Interaction dialog box.
48
Chapter 1
1
2
Select Multiple Choice in the Category list.
3
Click the icon for the graphic multiple-choice template.
Define the multiple-choice interaction
1
2
In the Question Text field, delete the default text.
3
Under Judge Interaction, select “when the user clicks a choice,” if it isn’t
already selected.
4
In Correct When, accept the default setting Any Correct and None Incorrect.
5
In Tries Are and Time Is, accept the default settings, Unlimited.
6
Verify that the Reset option is not selected.
7
Select “Insert this Interaction in a layer,” to place the CourseBuilder Interaction
in a layer so you can easily position it in the document.
49
Define the correct choice
Use the Choices tab to define the interaction choices and to define whether a
choice is correct or incorrect.
1
Click the Choices tab.
In the Choices list, choice1 is already selected and marked as correct.
2
Under Choice Options, in the Name field, change the default text “choice1” by
typing waverider.
3
Delete the text in the Text field.
4
In the Image File field, click Browse.
5
In the Select Appearance dialog box, navigate to the cb_graphics folder,
then select toy_waverider_mini.gif, and click Select (Windows) or
Choose (Macintosh).
The Choices tab updates.
50
Chapter 1
Define incorrect choices
Now you’ll set images for the other incorrect interaction choices.
1
In the Choices list, select choice2.
Notice that “Choice Is” is marked incorrect.
2
typing coldfusion.
3
4
In the Image File field, click Browse. Then, in the Select Appearance dialog
box, navigate to the cb_graphics folder, select toy_coldfusion_mini.gif, and
5
6
typing racer.
7
8
box, navigate to the cb_graphics folder, select toy_racer_mini.gif, and click
Select (Windows) or Choose (Macintosh).
9
10
typing satellite.
11
12
box, navigate to the cb_graphics folder, select toy_satellite_mini.gif, and click
Select (Windows) or Choose (Macintosh).
13
51
Create a layer for user feedback
In the document, you’ll position the layer containing the interaction choices, then
create a layer in the document where both the quiz question and the user feedback
will appear.
52
Chapter 1
1
In the Document window, click the border of the interaction layer to
select the layer.
2
Click the layer tab then drag the layer until your document looks similar to the
screen below.
3
In the Object palette, click the Layer icon. Then move the pointer to the
Document window, and in the area to the left of the choices, drag the pointer
to draw a layer.
4
With the layer selected, in the Property inspector’s LayerID field, replace the
default text “Layer1” by typing Feedback.
5
In the Document window, click in the Feedback layer to position the insertion
point in the layer, then in the Object palette, click the Image icon to insert an
image in the layer.
6
In the Select Image Source dialog box, navigate to the cb_graphics folder,
and select text_mc_question.jpg, and click Select (Windows) or Choose
(Macintosh).
7
With the image selected, in the Property inspector’s Image field, name the
image feedback
8
Move the layer if you need to so it doesn’t overlap the layer containing
the choices.
When users make a choice, you’ll give them feedback using the same technique
you used to display product information earlier: you’ll have the Action Manager
swap the image of the question with an image containing the feedback.
Set up feedback for a correct response
1
Click anywhere in the layer containing the choices. Then, in the tag selector
click <interaction>, and in the Property inspector click Edit to open the
CourseBuilder Interaction dialog box.
2
3
In the Action Manager list under “if Correct,” select Popup Message,
and click Cut.
4
In the Action Manager list reselect “if Correct,” then choose Swap Image from
the Actions pop-up menu, and click Add.
5
In the Images list, select “image in the Feedback layer,” then click Browse.
6
In the Select Image Source dialog box, navigate to the cb_graphics folder, select
text_feedback_correct.jpg, and click Select (Windows) or Choose (Macintosh).
7
Click OK to close the Swap Image dialog box.
Set up feedback for wrong response
Next, you’ll set the feedback for an incorrect choice.
1
In the Action Manager list under “else if Incorrect,” select Popup Message,
then click Cut.
2
In the Action Manager list re-select “else if Incorrect,” then choose Swap Image
from the Actions pop-up menu, and click Add.
3
In the Images list, select “image in the Feedback layer,” then click Browse.
4
In the Select Image Source dialog box, navigate to the cb_graphics folder,
and select text_feedback_incorrect.jpg, and click Select (Windows) or
Choose (Macintosh).
5
Click OK to close the Swap Image dialog box.
6
53
Test the interaction
Now test the page to see how it works.
1
Choose File > Save, then press F12 to preview the page in a browser.
2
When the document opens try the interaction:
Click the first button, and you receive feedback that your choice is right.
Click the other three buttons, and you receive feedback that your choice
is wrong.
54
Chapter 1
Create a Multiple-choice interaction
You’re now ready to create a navigation page from which users can select how they
want to navigate your site. They can choose to learn about the products, test their
knowledge of the products, or take a sales incentives quiz.
Now you’ll see another way to use a multiple-choice interaction.
Open the file to which you’ll add a multiple-choice CourseBuilder Interaction.
1
Choose File > Open.
2
In the Open dialog box, navigate to the cb_discover folder, then select the file
named cb_nav.htm, and click Open.
1
2
You can’t see the invisible markers in the document because they are obscured
by the banner image.
3
In the Object palette’s Common panel, click the CourseBuilder
Interaction icon.
The CourseBuilder Interaction dialog box appears displaying the Gallery tab.
55
Use the options in the Gallery tab to select an interaction template. You can
choose a target browser to see a list of interactions that will work on the specified
browser version and you can use the Category list to select an interaction type.
The icons in the Gallery show which templates are available for a selected
interaction type.
1
2
In the Category list, select Multiple Choice.
The icons in the Gallery represent the multiple-choice CourseBuilder
Interactions that will function in version 4 and later browsers.
3
Click the icon for the graphic multiple-choice with radio buttons template.
Notice that as you place the pointer over the template icons, the template’s
name appears in the blank space below the Gallery.
The CourseBuilder Interaction dialog box displays additional tabs next to the
Gallery tab. Use these tabs to define the properties, elements, and actions of
the interaction.
The framework of the multiple-choice template is visible in the Document
window. To see the CourseBuilder Interaction in the Document window, drag the
CourseBuilder Interaction dialog box down or to the right, if necessary.
56
Chapter 1
Define the multiple-choice interaction
Select options on the General tab to define general properties that apply to the
overall multiple-choice interaction.
1
2
In the Question Text field, replace the text “Put your question text here”
by typing:
Here’s the latest on our new line of toys - specs, prices, and this quarter’s sales
incentives. Explore first, then test your knowledge with a couple of quizzes.
Click a button to choose:
The text instantly updates in the Document window when you click another
field on this tab.
3
Under Judge Interaction, accept the default setting, “when the user clicks
a choice.”
This option dictates that the interaction is instantly judged when a user makes
a selection.
4
In Correct When, accept the default setting, Any Correct and None Incorrect.
5
In Tries Are and Time Is, accept the default settings, Unlimited.
You aren’t limiting the number of tries, nor the amount of time the user has to
respond correctly to the question in this interaction.
6
Verify that the Reset option is not selected.
57
7
58
Chapter 1
Select “Insert this Interaction in a layer” to place the CourseBuilder Interaction
in a layer so you can easily position it in the document.
Define the choices
Use the Choices tab to define the user’s choices in the interaction. You’ll name
each choice so you can easily identify them in other tabs, add text to create the
user’s choices, and define how each choice is judged.
1
Start by clicking the Choices tab.
In the Choices list, “choice1(correct)” is already selected.
2
In the Name field, replace the default text “choice1” by typing Explore.
3
In the Text field, replace the default text “Text for choice1” by typing Explore
the new products.
This is the text the user sees on the screen.
59
4
In the Choice Is pop-up menu, select Not Judged.
This interaction guides navigation, so a user’s choice isn’t correct or incorrect.
5
In the Choices list, click “choice2” to select it.
Notice that the Name field changes; it now matches the selected choice in
the Choices list.
60
Chapter 1
6
In the Name field, replace the default text “choice2” by typing DD.
7
In the Text field, replace the default text “Text for choice2” by typing Know
your target customer.
8
9
In the Choices list, click “choice3” to select it.
10
In the Name field, replace the default text “choice3” by typing MC.
11
In the Text field, replace the default text “Text for choice3” by typing What’s in
it for you.
12
13
In the Choices list, select “choice4” then click Delete to remove this choice
from the interaction.
Define the action
Complete the interaction by defining the action that CourseBuilder executes in
response to the user’s choices. You’ll link each choice with a file to open when
clicked. Use the Action Manager to set up a Go To URL action for each choice.
If a user selects choice 1, the explore activity page is displayed
If a user selects choice 2, the drag-and-drop quiz page is displayed
If a user selects choice 3, the multiple-choice quiz page is displayed
While defining this interaction, you’ll change the default settings of the segments,
conditions, and actions to customize the feedback.
Select the Action Manager tab
Start by clicking the Action Manager tab.
The Action Manager tab displays three segments:
Segment: Check Time
Segment: Correctness
Segment: Check Tries
Although segments are automatically set up for a time limit and tries limit, they
aren’t triggered unless you select the time or tries limit options in the General tab.
Actions to provide users with feedback are already set for each default Action
Manager segment. You’ll change the default settings of the segments, conditions,
and actions to customize the feedback for your interaction.
Segments preceded by a plus sign (+) are collapsed. To view the conditions and
actions of collapsed segments, click Expand on the Action Manager tab.
61
Edit the segments
You’ll change the default segment name to a name that identifies what the
segment does.
1
In the Action Manager list, select Segment:Correctness to select this segment.
2
Click Edit.
The Segment Editor appears.
62
Chapter 1
3
In the Segment Name field, replace the default text, by typing Navigation.
4
Define the explore condition
1
In the Action Manager list, select the “if Correct” condition.
2
Click Edit.
The Condition Editor appears.
3
In the Condition Name field, type Explore selected to indicate which
condition is represented.
4
In the rightmost Interaction pop-up menu, which currently shows <none>,
select Button “Explore.”
5
In the bottommost Type pop-up menu, make sure True is selected.
6
63
Add a Go To URL action
Now add the action that takes the user to the correct URL when this choice is
selected. First you’ll delete the existing Popup Message action, then you’ll add a
Go To URL action.
1
In the Action Manager list, under “if Explore selected,” select Popup Message.
2
Click Cut to delete this action from the Action Manager list.
3
In the Action Manager, select “if Explore selected.”
4
In the Action Manager pop-up menu, choose Go To URL, then click Add.
The Go To URL dialog box appears.
5
In the URL field, click Browse.
6
In the dialog box that appears, navigate to the cb_discover folder, then to
cb_explore.htm, and click Select (Windows) or Choose (Macintosh) to select
the file to open when the choice is clicked.
The URL field updates.
7
Define the drag-and-drop condition
64
Chapter 1
1
In the Action Manager list, select the “else if Incorrect” condition.
2
Click Edit to open the Condition Editor.
3
In the Condition Name field, type Drag and Drop selected to indicate which
4
In the rightmost Interaction pop-up menu, select Button “DD.”
5
6
Add the action which takes the user to the drag-and-drop quiz when this choice is
selected. Delete the existing Popup Message action, then add a Go To URL action.
1
In the Action Manager list, under “else if Drag and Drop selected,” select
Popup Message.
2
3
In the Action Manager, select “else if Drag and Drop selected.”
4
5
In the Go To URL dialog box, in the URL field, click Browse. Then, in the
dialog box that appears, navigate to cb_drag_drop.htm in the tutorial folder,
and click Select (Windows) or Choose (Macintosh) to select the file to open
when the choice is clicked.
6
Define the multiple-choice condition
1
In the Action Manager list select the “else if Unknown Response” condition.
2
Click Edit to open the Condition Editor.
3
In the Condition Name field, type Multiple Choice selected to indicate which
4
In the rightmost Interaction pop-up menu, select Button “MC.”
5
6
65
Add the action that takes the user to the multiple-choice quiz page when
Choice 3 is selected. Delete the existing Popup Message action, then add a
Go To URL action.
1
In the Action Manager list, under “else if Multiple Choice selected,” select
Popup Message.
2
3
In the Action Manager, select “else if Multiple Choice selected.”
4
5
In the Go To URL dialog box, in the URL field click Browse. Then in the
dialog box that appears, navigate to cb_mc.htm in the cb_discover folder, and
click Select (Windows) or Choose (Macintosh) to select the file to open when
the choice is clicked.
6
Click OK to close the dialog box, then click OK to close the CourseBuilder
Interaction dialog box.
7
Choose File > Save to save your document.
Position the interaction in the document
You may need to change the size and position of the layer that contains the
multiple-choice interaction object.
1
Click the border of the layer to select it.
2
Then do the following to resize or move the layer:
Use the layer tab (on the upper left corner) to drag the layer to the desired
location.
Drag any of the layer handles to resize the layer.
3
Save your changes.
Test the interaction
1
Choose File > Preview in Browser.
Your browser opens and displays the interaction.
2
Click each of the buttons to test your site.
The other interaction pages you created appear.
3
66
Chapter 1
Close your browser when you are done testing your site.
2
CHAPTER 2
CourseBuilder for Dreamweaver basics
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Overview of CourseBuilderBasics
Whether you are familiar with using Dreamweaver or new to Dreamweaver, you
can easily get started using CourseBuilder for Dreamweaver. CourseBuilder for
Dreamweaver includes an easy to use interface which helps you to create webbased learning interactions.
About the CourseBuilder for Dreamweaver work area
After installing CourseBuilder for Dreamweaver you may not notice much
difference between Dreamweaver and CourseBuilder for Dreamweaver.
As with Dreamweaver, begin by creating a local site for your CourseBuilder for
Dreamweaver documents. For information about creating a local site, see the
“Sites and Documents” chapter in the Using Dreamweaver book.
CourseBuilder for Dreamweaver’s functionality is initiated when you insert a
CourseBuilder Interaction in a document. As you get started with CourseBuilder
for Dreamweaver you’ll notice the following work area components and
commands.
67
Copying support files
Use the Copy Support Files command to copy CourseBuilder for Dreamweaver
support files to the local site folder you’ve established for your site. Using this
command adds two folders to your site structure; the Scripts folder, a folder that
contains JavaScript files, and the Images folder, a folder which contains graphics
elements such as placeholder images, button images, slider images, and timer
images. CourseBuilder Interactions require these script and image support files in
order to function correctly.
Note: If your current file structure contains a folder named Images, CourseBuilder for
Dreamweaver will copy the image support files into that folder. If you want to keep
CourseBuilder support files separate from your graphic files, you may want to rename your
graphics file prior to copying the support files.
To copy support files, do one of the following:
1
You must have a saved document open. Do one of the following:
Open a new document, then save it to your local site folder.
Open an existing document from within your local site folder.
2
Choose Modify > CourseBuilder > Copy Support Files.
3
Select the options you want, then click OK.
The Copy Support Files command always copies the script files.
There are two options for copying the image files:
copies the image files from the Dreamweaver\CourseBuilder folder
to the folder where the document is located.
Copy images
overwrites the image files in the folder where the
document is located with the image files in the Dreamweaver\CourseBuilder
folder. Only files with names matching those in the Dreamweaver\CourseBuilder
folder are replaced. New files you’ve added to the folder are left untouched.
Files from the Dreamweaver\CourseBuilder folder that you’ve renamed are also
left untouched.
Overwrite existing image files
Note: It is important that you also transfer CourseBuilder for Dreamweaver support files to
your web server when publishing your web site. You can use the Dreamweaver Site
window to copy HTML pages and dependent files. CourseBuilder support files, however,
aren’t seen as dependent files and are not automatically copied to a remote server. (See also
“What to put on the web server” on page 76.)
68
Chapter 2
The CourseBuilder Interaction icon on the palette
The CourseBuilder Interaction icon appears on the Object palette’s
Common panel.
CourseBuilder Interaction icon
The CourseBuilder Interaction icon in the document
After inserting a CourseBuilder Interaction in a document, the CourseBuilder
Interaction icon appears in the document.
Use the CourseBuilder Interaction icon to select a CourseBuilder Interaction
when you want to cut, copy, clear, or edit a CourseBuilder Interaction.
The CourseBuilder Interaction icon remains visible even when View > Invisible
Elements is turned off.
The interaction tag
When a CourseBuilder Interaction is selected, the interaction tag, <interaction>,
appears in the tag selector.
If you can’t locate the CourseBuilder Interaction icon in a document (it may be
obscured by other elements in a document, such as a layer), use the interaction tag
to select the CourseBuilder Interaction.
69
The CourseBuilder Interaction Property inspector
When an interaction is selected, the CourseBuilder Interaction Property inspector
is displayed. Use the CourseBuilder Interaction Property inspector to make edits
to a selected CourseBuilder Interaction.
lists each CourseBuilder Interaction in the document. Use the pop-up
menu to select an interaction to edit.
Name
places a CourseBuilder Interaction into its own layer. See “Inserting a
CourseBuilder Interaction into a layer” on page 166.
Layer
displays the CourseBuilder Interaction dialog box. Click Edit to make
changes to the settings for the selected Interaction. See “Editing CourseBuilder
Interactions” on page 158.
Edit
Inserting a CourseBuilder Interaction
You must save the document before inserting a CourseBuilder Interaction. If you
attempt to insert a CourseBuilder Interaction prior to saving the document, you
are prompted to save your document.
To insert a CourseBuilder Interaction:
In the Document window, position the insertion point where you want the
Interaction to appear, then use one of the following methods to open the
CourseBuilder Interaction dialog box:
Click the CourseBuilder Interaction icon in the Object palette.
Drag the CourseBuilder Interaction icon from the Object palette to
the document.
Choose Insert > CourseBuilder Interaction.
The CourseBuilder Interaction Gallery appears.
70
Chapter 2
CourseBuilder Interaction Gallery
The CourseBuilder Interaction Gallery lists the categories of Interactions and
displays an icon representing each of the Interaction templates.
Use the Target option in the upper left corner to display only the templates that
work in the browser version you’re targeting. See “CourseBuilder Interaction
compatibility with browsers” on page 73 for an overview of compatibility issues.
Create custom templates and add them to the Gallery (see “Adding a
CourseBuilder Interaction template to the Gallery” on page 169). Add
new categories to the Interactions list to accommodate new classes of
custom templates.
For information about the templates and what you can do with them, see:
Multiple-choice Interactions
“The multiple-choice templates” on page 80
“Multiple-choice CourseBuilder Interactions—step-by-step procedures” on
page 83
Drag-and-drop Interactions
“The drag-and-drop templates” on page 100
“Drag-and-drop CourseBuilder Interactions—step-by-step procedures” on
page 104
Explore Interactions
“The explore templates” on page 130
“Explore CourseBuilder Interactions—step-by-step procedures” on page 133
71
Button Interactions
“The button templates” on page 174
“Button CourseBuilder Interactions— step-by-step procedures” on page 176
Text entry Interactions
“The text entry templates” on page 144
“Text entry CourseBuilder Interactions—step-by-step procedures” on page 147
Timer Interactions
“The timer templates” on page 185
“Timer CourseBuilder Interactions—step-by-step procedures” on page 187
Slider Interactions
“The slider templates” on page 200
“Slider CourseBuilder Interactions— step-by-step procedures” on page 202
Action Manager Interactions
“Action Manager CourseBuilder Interactions—step-by-step procedures” on
page 215
72
Chapter 2
CourseBuilder Interaction compatibility
with browsers
Different browsers—and different versions of the same browser—have different
capabilities. Browser limitations can limit what you can do with a CourseBuilder
Interaction. The following table provides an overview of what you can expect
of the Interaction templates when they run in Netscape Navigator and
Internet Explorer.
Template
Netscape 3
Netscape 4
Internet
Explorer 3 (Win)
Multiple choice
with form
elements
OK*; radio buttons
aren’t cleared by
Reset; both radio
buttons and check
boxes can be selected
even when disabled
OK*; radio buttons
aren’t cleared by
Reset; both radio
buttons and check
even when disabled
OK*; radio buttons
OK
aren’t cleared by
Reset; both radio
buttons and check
even when disabled
Multiple choice
with graphic
elements
OK; transparency in
images may cause
redraw problems
OK
Fails without error
Drag and drop
Fails without error
OK*; cannot insert in Fails without error
a layer
OK*
Explore
Fails without error
OK*; cannot insert in Fails without error
a layer
OK*
Button
OK; transparency in
images may cause
redraw problems
OK
Fails without error
OK
Text entry
OK*; accepts text
entry even when
disabled
OK*
OK*; accepts text
entry even when
disabled
OK
Timer
May have only one
running on each
page
May have only one
running on each
page
Fails without error
OK
Slider
Fails without error*
Only one per page*; Fails without error*
layers after the slider
won’t function
correctly; setting
background color on
the slider layer causes
a failure without
error
OK*
OK
OK
Action Manager OK
*
OK
Internet
Explorer 4
OK
Not grayed when disabled
73
What’s new—step-by-step procedures
What you can do
Convert Knowledge Objects created in “Converting from previous versions” on
an earlier version of Dreamweaver
page 75
Attain to Attain Objects
74
Chapter 2
Select the CourseBuilder Interaction
icon to edit an interaction
“Editing CourseBuilder Interactions” on
page 158
Copy the script and image files an
Interaction needs to the folder where
it’s located
“Copying support files” on page 68
Insert a CourseBuilder Interaction in
a layer
“Inserting a CourseBuilder Interaction
into a layer” on page 166
Edit a segment, condition, or action
“Editing a segment, condition, or action” on
page 225
Rename a segment, condition,
or action
“Renaming a segment, condition, or action”
on page 224
Cut, copy, paste, or clear an entire
CourseBuilder Interaction
“Cutting, copying, pasting, and clearing
interactions” on page 158
Change the order of the items on the
Action Manager pop-up menu
“Action Manager pop-up menu” on page 217
Add custom behavior to the Action
Manager pop-up menu
“Adding a custom behavior” on page 249
Add a custom object to the Gallery
“Adding a CourseBuilder Interaction template
to the Gallery” on page 169
Set up a page to track student
performance
“Creating the CMI activity” on page 269
Add a web-packaged Authorware
piece to a page
“Authorware integration” on page 167
Converting from previous versions
Knowledge Objects you’ve created in Dreamweaver 1.2 Attain or in Attain
Objects for Dreamweaver need to be converted before you can use them with
CourseBuilder for Dreamweaver.
The Convert From Previous Versions command both converts a Knowledge
Object to a CourseBuilder Interaction and creates a backup of the original HTML
page it’s part of. The backup has the same file name as the original followed by the
extension BAK (for example, the backup created for Myfile.htm is named
Myfile.htm.bak).
You can also convert a Knowledge Object on a page by selecting it, opening the
Property inspector, and clicking the Convert button.
To convert previous version files:
1
Copy all of the original Dreamweaver Attain files to a new folder and delete the
Scripts folder.
2
3
Open a document which was created in a previous version. Choose
File > Open.
4
Choose Modify > CourseBuilder > Copy Support Files to copy CourseBuilder
for Dreamweaver support files to the same folder as the document.
5
Choose Modify > CourseBuilder > Convert From Previous Versions to convert
the document to CourseBuilder for Dreamweaver.
A message appears saying that the file has been converted.
6
Do one of the following:
Click OK to close the message window.
Click View Log to see the conversion log, which opens in a separate browser
window; then close the browser window to return to your document.
7
Save the document.
Note: You must open and convert each document in the folder which contains a previous
version Knowledge Object in order to edit it using CourseBuilder for Dreamweaver.
75
What to put on the web server
When you’re transferring your completed CourseBuilder for Dreamweaver
documents to the web server, be sure to copy the following files:
Images for buttons and timers (in the Images folder)
Images called by the Swap Image action
The Scripts folder
Any custom scripts (JavaScript files) a page uses
Other external media, such as sounds, web-packaged Authorware pieces,
and so on
Troubleshooting
Here are some tips for avoiding problems when you’re working with
CourseBuilder Interactions.
Creating forms and form elements
Form elements can’t be added to CourseBuilder Interactions. To build multiplechoice or text entry interactions, insert a CourseBuilder Interaction on the page,
then add and name elements using the CourseBuilder Interaction dialog box.
Creating layers
Layers can’t be used as elements in a CourseBuilder Interaction. To build a dragand-drop or explore interaction, insert an interaction on the page, then add and
name elements using the CourseBuilder Interaction interface.
Naming elements
Directly changing the names of CourseBuilder Interaction page elements causes
problems. Page elements created using CourseBuilder are given unique names,
such as “G01Question.” Rename page elements only in the CourseBuilder
Cutting, copying, pasting, and clearing
Use the Cut, Copy, Paste, and Clear commands on the Edit menu to edit
CourseBuilder Interactions. Use the special Edit > Clear command to completely
remove all HTML code related to a selected CourseBuilder Interaction.
76
Chapter 2
Placing CourseBuilder Interactions in layers
Don’t drag or paste CourseBuilder Interactions into layers. To place an Interaction
in a layer, select the Insert in Layer option, either in the Property inspector or on
the General tab.
Nesting and coloring layers
Don’t nest layers or set the background color of a layer that contains an
Interaction if you’re targeting Netscape browsers.
Resizing hot area layers containing images
In Netscape browsers, layers shrink to fit their content. To resize a hot area layer,
resize the image first, then shrink the layer to the same size. When moving these
layers, take care not to drag the images out of the layers.
Inserting multiple CourseBuilder Interactions on a page
Don’t nest CourseBuilder Interactions. Before inserting a new Interaction, make
sure the insertion point isn’t inside an existing <interaction> tag.
Behaviors and custom scripts
Many page elements created by using CourseBuilder for Dreamweaver contain
custom scripts, which may show up in the Behavior inspector. Don’t delete or alter
these scripts, and avoid adding other actions to these elements. To add actions, use
the Action Manager.
77
78
Chapter 2
3
CHAPTER 3
Multiple-Choice CourseBuilder
Interactions
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Multiple-choice interaction overview
Use multiple-choice CourseBuilder Interactions to create surveys, drill and
practice learning activities, tests, and assessments. You can track quizzes to
determine if further instruction might be necessary, and you can collate
survey results.
You can combine several multiple-choice CourseBuilder Interactions with an
Action Manager CourseBuilder Interaction to track scores that a user receives for
each of the multiple-choice interactions, and then total the scores for an entire
test. You can also introduce feedback when a user chooses an incorrect answer.
A multiple-choice CourseBuilder Interaction presents users with a group of
images, text items, or both from which to choose; then it exhibits actions based on
which items the user selects.
79
The multiple-choice templates
You can choose from six multiple-choice CourseBuilder Interaction templates,
and then use the CourseBuilder Interaction dialog box to customize the
interaction (including the number and source files of the graphics, radio buttons,
and check boxes that the CourseBuilder Interaction contains):
MultCh_TrueFalse true/false question. Contains a block of text followed by
two radio buttons labeled True and False.
For details about how the template works, see “True/false questions” on
page 85.
For information about using the template, see “Creating a true/false
question” on page 86.
MultCh_Radios multiple-choice question (radio buttons). Contains a block of
text followed by four choices labeled with placeholder text. The choices are
preceded by standard form radio buttons.
For details about how the template works, see “Multiple-choice questions”
on page 88.
For information about using the template, see “Creating a multiple-choice
MultCh_ImageRadios multiple-choice question (graphic buttons), version 4
or later browsers only. Contains a block of text followed by four choices
labeled with placeholder text. The choices are preceded by graphic buttons.
For details about how the template works, see “Multiple-choice questions”
on page 88.
For information about using the template, see “Creating a multiple-choice
MultCh_ImageButton all-that-apply question (form check boxes). Contains
a block of text followed by four choices labeled with placeholder text. The
choices are preceded by standard form check boxes.
For details about how the template works, see “All-that-apply questions” on
page 94.
For information about using the template, see “Creating an all-that-apply
MultCh_Checkboxes all-that-apply question (graphic check boxes), version 4
or later browsers only. Contains a block of text followed by four choices
labeled with placeholder text. The choices are preceded by graphic check
boxes.
For details about how the template works, see “All-that-apply questions” on
page 94.
For information about using the template, see “Creating an all-that-apply
MultCh_ImageChkboxes graphic multiple-choice question (images), version
4 or later browsers only. Contains a block of text followed by four choices
represented by placeholder graphics.
For details about how the template works, see “Graphic multiple-choice
questions” on page 91.
For information about using the template, see “Using images instead of text
as choices” on page 92.
80
Chapter 3
The multiple-choice CourseBuilder
Interaction tabs
General tab
See “Multiple-choice General tab options” on page 283 for detailed information
about the options on this tab.
Here’s a brief overview of the options:
is the unique name of the interaction. This name is used to
identify a CourseBuilder Interaction in the Condition Editor and other
dialog boxes.
Interaction Name
Question Text
is the text of the question, statement, or instruction that precedes
the choices.
determines when CourseBuilder for Dreamweaver evaluates a
user’s response. See “Setting when a CourseBuilder Interaction is judged” on
page 163.
Judge Interaction
defines what qualifies as a correct response to the CourseBuilder
Interaction. See “Marking a response right or wrong” on page 254.
Correct When
sends information about a user’s performance to a computermanaged instruction system. See “Using Knowledge Track” on page 267.
Knowledge Track
limits the number of tries a user has to respond to the CourseBuilder
Interaction. See “Limiting the number of tries” on page 162.
Tries Are
limits the amount of time a user has to respond to the interaction. See
“Putting a time limit on an interaction” on page 163.
Time Is
creates a button that lets a user start over. See “Resetting a CourseBuilder
Interaction” on page 165.
Reset
places the CourseBuilder Interaction in a layer. See “Inserting a
Layer
Tracking tab
The Tracking tab appears only if you’ve selected the Knowledge Track option on
the General tab. See “Tracking tab” on page 287.
Multiple-Choice CourseBuilder Interactions
81
Choices tab
See “Choices options” on page 287 for detailed information about the options
on this tab.
lists all the choices in the CourseBuilder Interaction. Use the buttons to
add, delete, and rearrange choices. See “Adding or deleting a choice” on page 97.
Choices
is the name of the selected choice. It appears only in the CourseBuilder
Interaction dialog box. See “Naming a choice” on page 98.
Name
is the text of the selected choice—the text that appears on the page. See
“Replacing “True” and “False” with different words” on page 88, “Creating a
multiple-choice question” on page 89, and “Creating an all-that-apply question”
on page 95.
Text
is the name of an image file associated with the text of a choice. See
“Adding an image to a text choice” on page 98. Don’t use this option for graphic
buttons or check boxes or for graphics-only questions; use the Appearance
option instead.
Image File
is the name of the image file for a graphic button or check box (see
“Multiple-choice questions” on page 88 and “All-that-apply questions” on
page 94) and in a graphics-only question (see “Using images instead of text as
choices” on page 92). The template supplies a placeholder.
Appearance
determines whether a choice is right or wrong. See “Marking a response
right or wrong” on page 254.
Choice Is
Score
is the value assigned to the choice. See “Scoring a response” on page 255.
Action Manager tab
The Action Manager tab contains code segments set up as if...then conditions that
define how a CourseBuilder Interaction behaves if any of the following occurs:
A user reaches a time limit that you’ve set on the General tab (see “Check Time
segment” on page 296).
A user’s response is correct, incorrect, or unknown (see “Correctness segment”
on page 296).
A user reaches the tries limit that you’ve set on the General tab (see “Check
Tries segment” on page 296).
82
Chapter 3
Multiple-choice CourseBuilder Interactions—
step-by-step procedures
What you can do
For instructions, see
Create a true/false question
“Creating a true/false question” on page 86
Replace “True” and “False” with “Yes” “Replacing “True” and “False” with
and “No” or with words from another different words” on page 88
language
Create multiple-choice questions
“Creating a multiple-choice question” on
page 89
Create multiple-choice questions that
use images rather than words
“Using images instead of text as choices” on
page 92
Create all-that-apply questions
“Creating an all-that-apply question” on
page 95
Rearrange the order of the choices in
a question
“Changing the order of the choices” on
page 96
Use more or fewer choices than a
template provides
“Adding or deleting a choice” on page 97
Give a choice a descriptive name
“Naming a choice” on page 98
Use images to enhance the text of the “Adding an image to a text choice” on
choices in a question
page 98
Learn about the segments in the
Action Manager that control how a
CourseBuilder Interaction acts on a
user’s response
“Multiple-choice segments” on page 297
Make changes to a CourseBuilder
Interaction
page 158
Cut, copy, and paste an entire
page 158
Set which responses are right and
which are wrong
“Marking a response right or wrong” on
page 254
Customize the feedback that the
CourseBuilder Interaction gives
the user
“Customizing feedback” on page 159
Display feedback in a frame, layer,
status bar, or text field rather than in
a pop-up message
“Displaying feedback in a frame, layer, status
bar, or text field” on page 160
Limit the number of times a user can
try to respond correctly to an
interaction
“Limiting the number of tries” on page 162
83
What you can do
Limit the amount of time a user has to “Putting a time limit on an interaction” on
respond correctly
page 163
Set whether a CourseBuilder
“Setting when a CourseBuilder Interaction
Interaction evaluates a user’s response is judged” on page 163
as soon as the user responds, when
the user clicks a Submit button, or
when an event occurs
Assign a CourseBuilder Interaction a
value as part of a test
“Scoring a response” on page 255
Send information about users’
“Tracking user performance” on page 251
performance to a computer-managed
instruction system such as Lotus
Pathware
Give the Submit button a
different name
“Changing the name of the Submit button”
on page 164
Let users start an exercise over
“Resetting a CourseBuilder Interaction” on
page 165
Add a custom CourseBuilder
Interaction as a template
Place a CourseBuilder Interaction in a “Inserting a CourseBuilder Interaction
layer so you can hide it, position it, or into a layer” on page 166
manipulate it in some other way
84
Chapter 3
True/false questions
The true/false template contains a block of text (see Question Text on the General
tab) followed by two radio buttons labeled True and False (see the Text option on
the Choices tab).
True is correct (see the Choice Is option on the Choices tab).
The CourseBuilder Interaction judges a user’s response as soon as the user clicks a
choice (see the Judge Interaction option on the General tab).
The CourseBuilder Interaction displays feedback if the user answers correctly or
incorrectly. It also displays feedback if the user doesn’t select either radio button.
(See the Correctness segment in the Action Manager tab.)
For a step-by-step guide to using this template, see “Creating a true/false question”
on page 86.
For detailed information about the options on the tabs, see:
“General options” on page 281
“Choices options” on page 287
85
Creating a true/false question
See “The multiple-choice CourseBuilder Interaction tabs” on page 81 for an
overview of the tabs.
To create a true/false question:
1
Insert a CourseBuilder Interaction in the document by doing one of
the following:
Click the Insert CourseBuilder Interaction icon in the Object palette.
Click the Insert CourseBuilder Interaction icon, then drag it to the
document window.
2
In the CourseBuilder Interaction dialog box, select Multiple Choice from the
Category list.
3
Select the true/false question icon.
4
Click the General tab. In the Question Text box, replace the default text with
the text of your question.
If the correct answer is True:
Click OK.
If the correct answer is False:
86
Chapter 3
1
Click the Choices tab.
2
In the Choices list at the top of the tab, select choice1 (which corresponds to
true). Change the Choice Is setting at the bottom of the tab to Incorrect.
3
In the Choices list, select choice2 (which corresponds to false). Change the
Choice Is setting at the bottom of the tab to Correct.
4
Click OK.
Other things you can do
What you can do
Replace “True” and “False” with “Yes” “Replacing “True” and “False” with
and “No” or with words from another different words” on page 88
language
Add an image to each choice
“Adding an image to a text choice” on
page 98
Evaluate the answer when the user
clicks a Submit button
different name
on page 164
Assign an interaction a value as part
of a test
Track a user’s performance in a
computer-managed instruction
system, such as Lotus Pathware
Limit the number of tries a user has to “Limiting the number of tries” on page 162
complete the interaction correctly
complete the interaction
page 163
Change the feedback preprogrammed “Customizing feedback” on page 159
in the template
Allow users to click a button to answer “Resetting a CourseBuilder Interaction” on
the question again
page 165
Place the question in a layer so you
can hide it, position it, or manipulate
it in some other way as a layer
Save a custom true/false CourseBuilder “Adding a CourseBuilder Interaction template
87
Replacing “True” and “False” with
different words
1
In the CourseBuilder Interaction dialog box, click the Choices tab.
See “Editing CourseBuilder Interactions” on page 158 if you need help.
2
In the Choices list at the top of the tab, select choice1.
3
In Choice Options, in the Text (optional) field, replace True with the text you
want to use.
4
5
In Choice Options, in the Text (optional) field, replace False with the text you
want to use.
6
Multiple-choice questions
Multiple-choice (radio
buttons)
Multiple-choice (graphic buttons)
For version 4 and later browsers
The multiple-choice templates contain a block of text (see Question Text on the
General tab) followed by four choices labeled with placeholder text (see the Text
option on the Choices tab). In one multiple-choice template, the choices are
preceded by standard form radio buttons. In the other template, they’re preceded
by graphic buttons (see the Appearance option on the Choices tab).
The first choice is correct (see the Choice Is option on the Choices tab).
incorrectly. It also displays feedback if the user doesn’t select a radio button. (See
the Correctness segment in the Action Manager tab.)
For a step-by-step guide to using this template, see “Creating a multiple-choice
88
Chapter 3
Creating a multiple-choice question
Multiple-choice questions with graphic buttons work only in version 4 or later
browsers. (You can also use them in Netscape Navigator 3 if the images contain no
transparent pixels.)
To create a multiple-choice question:
1
the following:
document window.
2
In the CourseBuilder Interaction dialog box, select Multiple Choice from
the Category list, then select the icon for the multiple-choice template you
want to use.
Multiple-choice (radio
buttons)
Multiple-choice (graphic buttons)
3
4
Click the Choices tab. In the Choices list at the top of the tab, select the first
choice, and type the text of the correct answer in the Text field (you can change
the order of the answers later). Repeat for each of the wrong answers.
If the answers are neither right nor wrong, see “Marking a response right or
wrong” on page 254.
If you want to delete default choices or add additional choices, see “Adding or
deleting a choice” on page 97.
5
Arrange the order of the answers.
See “Changing the order of the choices” on page 96.
6
89
What you can do
page 98
is judged” on page 163
Give the Submit button a different
name
on page 164
Change which choice is correct
page 254
of a test
page 163
in the template
the question again
page 165
90
Chapter 3
Save a custom multiple-choice
CourseBuilder Interaction as a
template
Graphic multiple-choice questions
The graphic multiple-choice template contains a block of text (see Question Text
on the General tab) followed by four choices represented by placeholder graphics
(see the Appearance option on the Choices tab).
The first choice is correct (see the Choice Is option on the Choices tab).
incorrectly. It also displays feedback if the user doesn’t select anything. (See the
Correctness segment in the Action Manager tab.)
For a step-by-step guide to using this template, see “Using images instead of text
as choices” on page 92.
91
Using images instead of text as choices
Graphic multiple-choice questions work only in version 4 or later browsers.
(You can also use them in Netscape Navigator 3 if the images contain no
To create a graphic multiple-choice question:
1
the following:
document window.
2
In the CourseBuilder Interaction dialog box, under Target, select 4.0 Browsers;
then in the Category list select Multiple Choice to see the multiple-choice
templates.
3
Select the graphic multiple-choice icon.
4
5
Click the Choices tab. In the Choices list at the top of the tab, select a choice to
set an image for.
6
In the Appearance field click Browse and navigate to the image you want to
display for the selected choice. Repeat for each of the other choices in the
interaction.
If you want to delete default choices or add additional ones, see “Adding or
7
8
92
Chapter 3
What you can do
different name
on page 164
Change which choice is correct
page 254
of a test
page 163
in the template
the question again
page 165
Save a custom question CourseBuilder “Adding a CourseBuilder Interaction template
93
All-that-apply questions
All-that-apply (check boxes)
All-that-apply (graphic check boxes)
The all-that-apply templates contain a block of text (see Question Text on the
General tab) followed by four choices labeled with placeholder text (see the Text
option on the Choices tab). In one all-that-apply template, the choices are
preceded by standard form check boxes. In the other template, they’re preceded by
graphic check boxes (see the Appearance option on the Choices tab).
The first two choices are correct (see the Choice Is option on the Choices tab).
The CourseBuilder Interaction judges a user’s response when the user clicks a
Submit button (see the Judge Interaction option on the General tab).
The CourseBuilder Interaction has a Reset button that lets the user start over
either before or after clicking the Submit button (see the Reset option on the
General tab).
incorrectly. It also displays feedback if the user responds in a way that can’t be
evaluated (for example, if the user clicks the Submit button before selecting any
choices). (See the Correctness segment in the Action Manager tab.)
For a step-by-step guide to using this template, see “Creating an all-that-apply
94
Chapter 3
Creating an all-that-apply question
All-that-apply questions with graphic check boxes work only in version 4 or later
browsers. (You can also use them in Netscape Navigator 3 if the images contain no
To create an all-that-apply question:
1
the following:
document window.
2
In the CourseBuilder Interaction dialog box, in the Category list select
Multiple Choice, then select the icon for the all-that-apply template you
want to use.
All-that-apply (check boxes)
All-that-apply (graphic check boxes)
3
4
Click the Choices tab. In the Choices list at the top of the tab, select the first
choice, and type the text of the first correct answer in the Text field. Repeat for
the second correct answer and for each of the wrong answers.
If you want to change which choices are correct or incorrect, see “Marking a
response right or wrong” on page 254.
If you want to delete default choices or add additional ones, see “Adding or
5
6
95
What you can do
page 98
different name
on page 164
of a test
page 163
in the template
the question again
page 165
Save a custom all-that-apply
template
Changing the order of the choices
1
96
Chapter 3
2
In the Choices list at the top of the tab, select the name of the choice you
want to move.
3
Click Up or Down to change the order in which the choice displays in the
interaction.
Adding or deleting a choice
Go to the Choices tab:
To delete a choice:
In the Choices list at the top of the tab, select the name of the choice you want to
delete, then click Delete.
To add a choice:
1
In the Choices list at the top of the tab, select the name of the choice whose
properties are most like the one you want to add.
2
Click Add.
The choice is duplicated.
3
Name the choice.
See “Naming a choice” on page 98.
4
Change the properties that need changing.
See “Multiple-choice CourseBuilder Interactions—step-by-step procedures” on
page 83.
5
Arrange the choice’s position in the Choices list.
97
Naming a choice
The name of a choice is different from the text of the choice. The text of the choice
is what appears on the page; it’s what the user sees. The name of the choice
appears only in the CourseBuilder Interaction dialog box.
The templates assign default names (choice1, choice2, and so on) to each choice.
Change the default names to something more descriptive to make the choices
easier to work with. However, you should avoid naming choices in ways that
describe whether a choice is correct or incorrect. Because clever users can look at
the HTML, you don’t want them to be able to determine the answer based on the
names of the choices.
To change the name of a choice:
1
2
In the Choices list at the top of the tab, select the name of the choice you
want to change.
3
In the Name field, replace the default name with the name you want. The
name can consist only of letters and numbers. Invalid characters, including
spaces, are automatically deleted.
Adding an image to a text choice
Don’t confuse an image you add to a text choice with a graphic multiplechoice question. Adding an image to a text choice merely enhances it. If you
want to create a multiple-choice question that’s essentially graphic and that
needs no text, use the graphic multiple-choice question template (see “Graphic
multiple-choice questions” on page 91).
To add an image to a choice:
1
2
In the Choices list at the top of the tab, select the name of the choice you want
to add an image to.
3
In the Image File, click Browse, then navigate to the image you want to display
for the choice.
The “Place before text” option is selected by default. The image appears to the
left of the text of the choice.
To have the image appear to the right of the text of the choice:
Deselect the “Place before text” option.
98
Chapter 3
4
CHAPTER 4
Drag-and-Drop CourseBuilder
Interactions
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Drag-and-drop interaction overview
Drag-and-drop CourseBuilder Interactions offer users hands-on learning in which
they interact directly with a lesson by manipulating elements on-screen. Use the
drag-and-drop CourseBuilder Interaction to have students demonstrate that
they’ve mastered complex relationships between objects. For example, have users
assemble a piece of machinery from its parts or relate concepts spatially.
You can include guidance to demonstrate the consequences of using a complex
system incorrectly. Consider using feedback on incorrect or undesirable responses
to guide students and explain flaws in logic. To give a drag-and-drop interaction
depth and make it less predictable and more challenging, make sure that dragand-drop interactions are real enough to handle and give feedback on a wide
variety of gestures.
99
The drag-and-drop templates
You can choose from seven drag-and-drop CourseBuilder Interaction templates,
and then use the CourseBuilder Interaction dialog box to customize the drag-anddrop interaction.
Drag_ManyToMany one-to-one matching. Places three drag elements and
three target elements on the page. Each target element is the correct match
for only one drag element.
For details about how the template works, see “One-to-one matching” on
page 106.
For information about using the template, see “Creating a matching
exercise” on page 110.
Drag_2wayManyToMany one-to-one matching (either way). Places six drag
& target elements on the page. A drag & target element can be both a drag
element and a target element. Each drag & target element is the correct
match for only one other drag & target element.
For details about how the template works, see “One-to-one matching, either
way” on page 107.
Drag_1ToMany one-to-many matching. Places one drag element and three
target elements on the page. Only one of the target elements is the correct
match for the drag element.
For details about how the template works, see “One-to-many matching” on
page 108.
Drag_2way1ToMany one-to-many matching (either way). Places four drag &
target elements on the page. Only one pair of drag & target elements
constitute the correct match.
For details about how the template works, see “One-to-many matching,
either way” on page 109.
Drag_2way1To1 the “Build your own” template. Places two drag & target
elements on the page, each of which can be dragged and dropped onto
the other. Use this template as the starting point for your own custom
CourseBuilder Interaction.
For details about how the template works, see “The “Build your own”
template” on page 112.
For information about using the template, see “Building your own matching
100
Chapter 4
Drag_2StepInOrder two-step procedure. Places one drag element and two
target elements on the page. The first drag element should be dropped on
the first target element, and then on the other target element, in two
separate steps.
For details about how the template works, see “Two-step procedure” on
page 116.
For information about using the template, see “Creating a procedure” on
page 118.
Drag_2Steps1ToMany two-step procedure with distractor. Places one drag
element and three target elements on the page. The first drag element
should be dropped on one target element, and then on another target
element, in two separate steps. The third target element is part of an
incorrect drag-target pair; if the user drops the drag element onto the target,
the interaction displays a feedback message to alert the user that the
response was incorrect.
For details about how the template works, see “Two-step procedure with a
distractor” on page 117.
For information about using the template, see “Creating a procedure” on
page 118.
Drag-and-Drop CourseBuilder Interactions
101
The drag-and-drop CourseBuilder
Interaction tabs
General tab
See “General options” on page 281 for detailed information about the options
on this tab.
is the unique name of the interaction. It’s used to identify the
interaction in the Condition Editor and other dialog boxes.
Interaction Name
determines when the CourseBuilder Interaction evaluates a
page 163.
Judge Interaction
defines what qualifies as a correct response to the interaction. See
“Marking a response right or wrong” on page 254.
Correct When
sends information about a user’s performance to a computermanaged instruction system. See “Tracking user performance” on page 251.
Knowledge Track
limits the number of tries a user has to respond to the interaction. See
“Limiting the number of tries” on page 162.
Tries Are
Time Is
Reset
determines what happens to a drag element when a user drops it on or
near a target. See “Setting how an element behaves when dropped” on page 127.
Reaction
places the interaction’s question text, Submit button, and Reset button in a
layer. See “Inserting a CourseBuilder Interaction into a layer” on page 166.
Layer
Tracking tab
102
Chapter 4
Elements tab
See “Drag-and-drop element options” on page 289 for detailed information about
the options on this tab.
lists all of the elements in the CourseBuilder Interaction. Use the
buttons to add and delete elements. See “Adding and deleting drag-and-drop
elements” on page 124.
Elements
Name is the name of the selected element. See “Naming a drag-and-drop element”
on page 123.
is the name of the image file used for the selected element. The
template supplies a placeholder. See “Replacing placeholder graphics” on
page 122.
Image File
defines the selected element as a drag element, a target element, or a
drag & target element. See “Making an element a drag element or a target” on
page 128.
Element Is
Pairs tab
See “Pairs options” on page 289 for detailed information about the options
on this tab.
Pairs lists combinations of drag & target elements as matching pairs. Use the
buttons to add and delete pairs. See “Adding and deleting drag-and-drop pairs” on
page 125.
Snap If Within defines the active area around a target. See “Setting how an element
behaves when dropped” on page 127.
defines how an element behaves when it’s dropped on a target. See
“Setting how an element behaves when dropped” on page 127.
Snap To
determines whether matching a pair is right or wrong. See “Marking a
Choice Is
Score
is the value assigned to the pair. See “Scoring a response” on page 255.
103
Action Manager tab
define how a CourseBuilder Interaction behaves under specific conditions:
If a user reaches a time limit that you’ve set on the General tab (see “Check
Time segment” on page 296)
If a user’s response is correct, incorrect, or unknown (see “Correctness segment”
on page 296)
If a user reaches the number of tries that you’ve set on the General tab (see
“Check Tries segment” on page 296)
If a user drags a given drag element in a procedural exercise (see “Two-step
procedure segments” on page 299)
Drag-and-drop CourseBuilder Interactions—
What you can do
Create a one-to-one or one-to-many
matching exercise
“Creating a matching exercise” on page 110
Create a custom matching exercise
“Building your own matching exercise” on
page 113
Save a custom CourseBuilder
Create a step-by-step procedure
“Creating a procedure” on page 118
Create a custom procedure
“Building your own procedure” on page 120
Replace the placeholder graphics
“Replacing placeholder graphics” on page 122
Give a drag or target element a
descriptive name
“Naming a drag-and-drop element” on
page 123
Add or delete drag or target elements “Adding and deleting drag-and-drop
from an interaction
elements” on page 124
Add or delete drag & target pairs from “Adding and deleting drag-and-drop pairs” on
an interaction
page 125
104
Chapter 4
Set up what happens when a drag
element hits or misses a target
“Setting how an element behaves
when dropped” on page 127
Make an element a drag element, a
target, or both
“Making an element a drag element or a
target” on page 128
What you can do
Learn what the segments on the
Action Manager tab do
“One-to-one matching segments” on
page 297,
“One-to-one matching (either way) segments”
on page 297,
“One-to-many matching segments” on
page 298,
““Build your own” template segments” on
page 298,
“Two-step procedure segments” on page 299
Interaction
page 158
page 158
which are wrong
page 254
CourseBuilder Interaction gives the
user
Display feedback in a text field,
layer, or frame rather than in a popup message
interaction
“Limiting the number of tries” on page 162
respond correctly
page 163
as soon as the user drops a drag
element, when the user clicks a
Submit button, or when an event
occurs
of a test
instruction system, such as Pathware
different name
on page 164
page 165
manipulate in some other way
105
One-to-one matching
The one-to-one matching template contains three drag elements and three target
elements (see the Elements tab). Each target element is the correct match for only
one drag element (see the Pairs list on the Pairs tab).
When a user drops a drag element anywhere within 75 pixels of the center of a
target element, the center of the drag element snaps to the center of the target
element (see the Snap If Within and Snap To options on the Pairs tab). If a user
drops a drag element, but misses the target, the drag element snaps back to its
original position (see the Reaction option on the General tab).
Because this interaction contains several drag elements—rather than just one—
the CourseBuilder Interaction is set up to judge a user’s response when the user
clicks a Submit button (see the Judge Interaction option on the General tab).
(When there’s a single drag element, it’s more efficient to have the CourseBuilder
Interaction judge the interaction as soon as the user drops the element.) A user
must match all three drag elements with their correct target elements for the
CourseBuilder Interaction to judge the user’s response as correct (see the Correct
When option on the General tab).
General tab).
incorrectly. It also displays feedback if the user responds in an unknown way (for
example, if the user clicks the Submit button before matching any drag elements
with a target). (See the Correctness segment in the Action Manager tab.)
For a step-by-step guide to using this template, see “Creating a matching exercise”
on page 110.
“Drag-and-drop element options” on page 289
“Pairs options” on page 289
“One-to-one matching segments” on page 297 (Action Manager tab)
106
Chapter 4
One-to-one matching, either way
The one-to-one matching (either way) template contains six drag & target
elements (see the Elements tab). A drag & target element can be both a drag
element and a target element. Each drag & target element is the correct match for
only one other drag & target element (see the Pairs list on the Pairs tab).
When a user drops an element anywhere within 75 pixels of the center of another
element, the center of the dropped element snaps to the center of the target
element (see the Snap If Within and Snap To options on the Pairs tab).
Because this interaction contains several drag-target pairs—rather than just one—
the CourseBuilder Interaction is set up to judge a user’s response when the user
clicks a Submit button (see the Judge Interaction option on the General tab).
(When there’s a single drag-target pair, it’s more efficient to have the
CourseBuilder Interaction judge the interaction as soon as the user drops the
element.) A user must match all three pairs correctly for the CourseBuilder
Interaction to judge the user’s response as correct (see the Correct When option
on the General tab).
General tab).
incorrectly. It also displays feedback if the user responds in an unknown way (for
example, if the user clicks the Submit button before matching any drag elements
with a target). (See the Correctness segment in the Action Manager tab.)
on page 110.
“One-to-one matching (either way) segments” on page 297 (Action
Manager tab)
107
One-to-many matching
The one-to-many matching template contains one drag element and three target
elements (see the Elements tab). Only one of the target elements is the correct
match for the drag element (see the Pairs list on the Pairs tab).
When a user drops the drag element anywhere within 75 pixels of the center of a
target element, the center of the drag element snaps to the center of the target
element (see the Snap If Within and Snap To options on the Pairs tab). If a user
drops the drag element, but misses the target, the drag element snaps back to its
original position (see the Reaction option on the General tab).
The CourseBuilder Interaction judges the interaction as soon as the user drops the
element (see the Judge Interaction option on the General tab).
The CourseBuilder Interaction has a Reset button that lets the user start over (see
the Reset option on the General tab).
incorrectly. It also displays feedback if the user responds in a way that can’t be
evaluated (see the Correctness segment on the Action Manager tab.)
on page 110.
“One-to-many matching segments” on page 298 (Action Manager tab)
108
Chapter 4
One-to-many matching, either way
The one-to-many (either way) matching template contains four drag & target
elements (see the Elements tab). A drag & target element can be both a drag
element and a target element. Only one pair of drag & target elements is the
correct match (see the Pairs list on the Pairs tab).
When a user drops an element anywhere within 75 pixels of the center of a target
element, the center of the dropped element snaps to the center of the target
The CourseBuilder Interaction judges the interaction as soon as the user drops an
element (see the Judge Interaction option on the General tab).
The CourseBuilder Interaction has a Reset button that lets the user start over (see
the Reset option on the General tab).
incorrectly. It also displays feedback if the user responds in an unknown way. (See
the Correctness segment in the Action Manager tab.)
on page 110.
“One-to-many matching segments” on page 298 (Action Manager tab)
109
Creating a matching exercise
Drag-and-drop matching exercises work only in version 4 and later browsers.
See “The drag-and-drop CourseBuilder Interaction tabs” on page 102 for an
To create a matching exercise:
1
the following:
document window.
2
In the CourseBuilder Interaction dialog box, under Target select 4.0+ Browsers;
then in the Category list, select Drag and Drop.
3
In the template gallery, select the icon for the type of matching exercise you
want to create.
One-to-one matching. See “One-to-one matching” on page 106 for
information about how the template works.
One-to-one matching (either way). See “One-to-one matching, either way”
on page 107 for information about how the template works.
One-to-many matching. See “One-to-many matching” on page 108 for
information about how the template works.
One-to-many matching (either way). See “One-to-many matching, either
way” on page 109 for information about how the template works.
4
Replace the placeholder graphics with the images you want to use.
See “Replacing placeholder graphics” on page 122.
5
Click the Pairs tab, and set which pairs are correct and which are incorrect.
See “Marking a response right or wrong” on page 254.
110
Chapter 4
6
Click OK.
7
Replace the default text that appears above the interaction in the document.
Change the positions of the layers if you need to rearrange the graphics.
What you can do
Give a drag-and-drop element a
descriptive name
page 123
Add elements to the exercise
“Adding and deleting drag-and-drop
“Adding and deleting drag-and-drop pairs” on
page 125
Make an element you’ve added a drag “Making an element a drag element or a
element, a target element, or both
Change a drag element to a target
element, or vice versa; or change
either type of element to a drag &
target element
Delete elements from the exercise
page 125
Change the way an element behaves
when it hits or misses its target
Judge an interaction when a user
drops an element on a target, or judge is judged” on page 163
the interaction when the user clicks a
Submit button
different name
on page 164
of a test
system, such as Pathware
page 163
in the template
Allow users to click a button to start
the interaction over
page 165
Place the entire interaction in a layer
so you can hide it, position it, or
manipulate it in some other way as
a layer
111
What you can do
Create a custom matching exercise
“Building your own matching exercise” on
page 113
The “Build your own” template
The “Build your own” template is nothing more than a starting point that you can
use to build your own drag-and-drop CourseBuilder Interaction. You can use any
of the templates as the starting point for a custom CourseBuilder Interaction. The
virtue of this template is that it contains almost nothing, so you don’t need to
spend time deleting elements you aren’t going to use.
The “Build your own” template contains two drag & target elements (see the
Elements tab). A drag & target element can be both a drag element and a target
element. Neither method of matching the two elements—dragging the first to the
second or dragging the second to the first—is considered correct or incorrect;
both are unjudged (see the Pairs list on the Pairs tab).
When a user drops either of the elements anywhere within 75 pixels of the center
of the other, the center of the dropped element snaps to the center of the target
The CourseBuilder Interaction is set up to judge the interaction as soon as
the user drops one of the elements (see the Judge Interaction option on the
General tab).
after dragging one of the elements to the other (see the Reset option on the
General tab).
The CourseBuilder Interaction displays different feedback depending on whether
the user drags the first element to the second or the second element to the first.
(See the “Segment: DragTarget1 to DragTarget2 Feedback” and “Segment:
DragTarget2 to DragTarget1 Feedback” segments in the Action Manager tab.)
For a step-by-step guide to using this template, see “Building your own matching
112
Chapter 4
““Build your own” template segments” on page 298 (Action Manager tab)
Building your own matching exercise
The “Build your own” template works only in version 4 or later browsers.
Make sure you understand how a matching exercise works:
1
See “The “Build your own” template” on page 112 for information about how
it works.
2
3
Build something with the matching exercise templates. Study the results.
Change the settings to see what happens. Make sure you understand how the
Action Manager works.
Add the template to the document:
1
the following:
document window.
2
In the CourseBuilder Interaction dialog box, under Target, select 4.0+
Browsers; then in the Category list, select Drag and Drop.
3
In the template gallery, select the “Build your own” icon.
113
Check the settings on the General tab:
1
2
Select the Judge Interaction setting by doing one of the following:
If you want a user’s response to be judged after dragging a single element to a
target, select “when the user drops a drag element.”
If you want to judge a user’s response after two or more elements are dragged to
their targets, select “when the user clicks a button labeled Submit.”
See “Setting when a CourseBuilder Interaction is judged” on page 163.
See also “Changing the name of the Submit button” on page 164.
3
Decide what you want to happen when a user drops a drag element, and select
the appropriate Reaction options.
See “Setting how an element behaves when dropped” on page 127.
4
See “General options” on page 281 for details of the other options that
are available.
Add the elements you need:
1
2
Add the elements you need.
See “Adding and deleting drag-and-drop elements” on page 124.
3
4
Decide which elements you want to be drag elements, which you want to be
target elements, and which, if any, you want to be both.
See “Making an element a drag element or a target” on page 128.
114
Chapter 4
Set up the pairs of elements that match:
1
2
Add all the pairs of elements that are valid matches.
See “Adding and deleting drag-and-drop pairs” on page 125.
3
For each pair, set up the target’s active area and the position you want the drag
element to snap to when it’s dropped.
4
Mark each pair as correct, incorrect, or not judged.
5
If you’re tracking performance, assign each pair a score.
See “Scoring a response” on page 255.
Set up the Action Manager:
1
2
Make sure you understand how the default segments in the Action
Manager work.
See ““Build your own” template segments” on page 298.
3
Think through how you want the interaction to work, and translate that
behavior into conditions and actions.
For information about adding segments, conditions, and actions, see:
“Adding a segment” on page 218
“Adding a condition” on page 219
“Adding an action” on page 224
4
When you’re finished making changes, click OK.
Finish and test the exercise:
1
Change the positions of the layers if you need to rearrange the graphics.
2
Test the exercise thoroughly to make sure it works as you want.
See also “Adding a CourseBuilder Interaction template to the Gallery” on
page 169.
115
Two-step procedure
The two-step procedure template contains one drag element and two target
elements (see the Elements tab). When a user drops the drag element anywhere
within 75 pixels of the center of either target element, the center of the drag
element snaps to the center of the target element (see the Snap If Within and Snap
To options on the Pairs tab). If a user drops the drag element, but misses the
target, the drag element snaps back to its original position (see the Reaction
option on the General tab).
Because this interaction has two steps, the CourseBuilder Interaction is set up to
judge the interaction as soon as the user drops the drag element on one of the
targets (see the Judge Interaction option on the General tab). The user drags the
drag element twice—once for each step—so that the CourseBuilder Interaction
judges the interaction twice.
Neither target element is considered a correct or incorrect match; both pairings
are unjudged (see the Pairs list on the Pairs tab). The Action Manager, however,
is set up to make sure that a user completes step 1 (matching the drag element
with the first target element) before completing step 2 (matching the drag element
with the second target element). The Action Manager displays the appropriate
feedback at the end of each step, indicating whether the user performed the
steps in the correct sequence. (See the Two-Step Matching segment in the
Action Manager tab.)
The CourseBuilder Interaction has a Reset button that lets the user start
over during or after completing the procedure (see the Reset option on the
General tab).
For a step-by-step guide to using this template, see “Creating a procedure” on
page 118.
“Two-step procedure segments” on page 299 (Action Manager tab)
116
Chapter 4
Two-step procedure with a distractor
The template for a two-step procedure with a distractor contains one drag element
and three target elements (see the Elements tab). When a user drops the drag
element anywhere within 75 pixels of the center of any of the target elements, the
center of the drag element snaps to the center of the target element (see the Snap
If Within and Snap To options on the Pairs tab). If a user drops the drag element,
but misses the target, the drag element snaps back to its original position (see the
Reaction option on the General tab).
Because this interaction has two steps, the CourseBuilder Interaction is set up
to judge the interaction as soon as the user drops the drag element on one of the
targets (see the Judge Interaction option on the General tab). The CourseBuilder
Interaction judges the interaction each time the user drops the drag element
on a target.
None of the target elements is considered a correct or incorrect match; all three
pairings are unjudged (see the Pairs list on the Pairs tab). The Action Manager,
however, is set up to make sure that a user completes step 1 (matching the drag
element with the first target element) before completing step 2 (matching the drag
element with the second target element). It also makes sure that the user drops the
drag element on the correct target in step 2. The Action Manager displays the
appropriate feedback at the end of each step, indicating whether the user
performed the correct step and in the correct sequence. (See the Two-Step
Matching and Drag1 to Target3 Feedback segments in the Action Manager tab.)
The CourseBuilder Interaction has a Reset button that lets the user start
over during or after completing the procedure (see the Reset option on the
General tab).
For a step-by-step guide to using this template, see “Creating a procedure” on
page 118.
“Two-step procedure segments” on page 299 (Action Manager tab)
117
Creating a procedure
Drag-and-drop procedures work only in version 4 or later browsers.
To create a two-step procedure:
1
the following:
document window.
2
3
In the template gallery, select the icon for the type of procedure you want
to create.
Two-step procedure. See “Two-step procedure” on page 116 for information
about how the template works.
Two-step procedure with a distractor. See “Two-step procedure with a
distractor” on page 117 for information about how the template works.
4
5
Click OK.
6
Rearrange the positions of the graphics if you need to.
118
Chapter 4
What you can do
Give a drag-and-drop element a
descriptive name
page 123
Add elements to the exercise
page 125
What you can do
Make an element you’ve added a drag “Making an element a drag element or a
element, a target element, or both
Change a drag element to a target
element, or vice versa; or change
either type of element to a drag &
target element
Delete elements from the exercise
page 125
Change the way an element behaves
when it hits or misses its target
drops an element on a target, or judge is judged” on page 163
the interaction when the user clicks a
Submit button
different name
on page 164
which are wrong
page 254
of a test
page 163
in the template
Allow users to click a button to start
the interaction over
page 165
Place the entire interaction in a layer
a layer
119
Building your own procedure
Drag-and-drop procedures work only on version 4 or later browsers.
Make sure you understand how a procedure CourseBuilder Interaction works:
1
See “Two-step procedure” on page 116 and “Two-step procedure with a
distractor” on page 117 for information about how the procedure
templates work.
2
3
Build something with the procedure templates. Study the results. Change the
settings to see what happens. Make sure you understand how the Action
Manager works.
Add a two-step procedure template to the document:
1
the following:
document window.
2
3
In the template gallery, select one of the procedure templates and use it as the
starting point for your custom CourseBuilder Interaction.
Two-step procedure
120
Chapter 4
Two-step procedure with a distractor
Check the settings on the General tab:
1
2
Select a Judge Interaction setting by doing one of the following:
If you want a user’s response to be judged after dragging a single element to a
target, select “when the user drops a drag element.”
If you want to judge a user’s response after dragging two or more elements to
their targets, select “when the user clicks a button labeled Submit.”
See “Setting when a CourseBuilder Interaction is judged” on page 163.
See also “Changing the name of the Submit button” on page 164.
3
Decide what you want to happen when a user drops a drag element, and select
the appropriate Reaction options.
Add the elements you need:
1
2
Add the elements you need.
See “Adding and deleting drag-and-drop elements” on page 124.
3
4
Decide which elements you want to be drag elements, which you want to be
target elements, and which, if any, you want to be both.
See “Making an element a drag element or a target” on page 128.
Set up the pairs of elements that match:
1
2
Add all the pairs of elements that are valid matches.
3
For each pair, set up the target’s active area and the position you want the drag
element to snap to when it’s dropped.
4
Mark each pair as correct, incorrect, or not judged.
5
If you’re tracking performance, assign each pair a score.
See “Scoring a response” on page 255.
121
Set up the Action Manager:
1
2
Make sure you understand how the default segments in the Action
Manager work.
See “Two-step procedure segments” on page 299.
3
Think through how you want the interaction to work and translate that
behavior into conditions and actions.
For information about adding segments, conditions, and actions, see:
4
When you’re finished making changes, click OK.
Finish and test the procedure:
1
Rearrange the positions of the graphics if you need to.
2
Test the procedure thoroughly to make sure it works as you want.
See also “Adding a CourseBuilder Interaction template to the Gallery” on
page 169.
Replacing placeholder graphics
To use the CourseBuilder Interaction dialog box:
1
2
In the Elements list, select the element that’s associated with the placeholder
graphic you want to replace.
3
Click the Browse button (next to the Image File field), and select the image file
you want to use in place of the placeholder graphic.
To replace placeholder graphics directly in a document:
122
Chapter 4
1
Double-click the placeholder graphic.
2
In the dialog box that appears, locate the image file you want to use
and open it.
Naming a drag-and-drop element
The templates assign default names (drag1, target1, and so on) to each choice.
Giving an element a more descriptive name makes it easier to work with. The
name you give an element appears only in the CourseBuilder Interaction
dialog box.
To change the name of an element:
1
In the CourseBuilder Interaction dialog box, click the Elements tab.
2
In the Elements list at the top of the tab, select the name of the element you
want to change.
3
In the Name field, replace the default name with the name you want.
Names can contain only letters and numbers.
123
Adding and deleting drag-and-drop elements
Go to the Elements tab:
To delete an element:
In the Elements list at the top of the tab, select the name of the element you want
to delete; then click Delete.
The element is deleted from the Elements list. References to the element are also
deleted from the Pairs and Action Manager tabs.
To add an element:
1
In the Elements list at the top of the tab, select the name of the element whose
2
Click Add.
The element is duplicated.
3
Name the element.
See “Naming a drag-and-drop element” on page 123.
4
See “Drag-and-drop CourseBuilder Interactions—step-by-step procedures” on
page 104.
5
Add the pairs associated with the new element.
124
Chapter 4
Adding and deleting drag-and-drop pairs
Go to the Pairs tab:
In the CourseBuilder Interaction dialog box, click the Pairs tab.
To delete a pair:
In the Pairs list at the top of the tab, select the name of the pair you want to delete;
then click Delete.
The pair is deleted from the Pairs list. The pair is also deleted (from the Action
Manager tab) along with any feedback settings included for the pair.
To add a pair:
1
Choose an existing pair to duplicate by doing one of the following:
Select a pair in the Pairs pop-up menu.
Select a pair in the Pairs list.
2
Click Add.
A new pair is created which has the same pair options as the pair you selected.
3
Change any options that need changing. See:
“Setting how an element behaves when dropped” on page 127
“Marking a response right or wrong” on page 254
4
125
A target’s active area
A target element has an active area surrounding it that determines whether an
element dropped near it has hit the target. The Snap If Within setting on the Pairs
tab determines how large the active area is (see “Pairs options” on page 289). The
active area is a circle measured from the center of the layer the target element
occupies. Because the target area is measured from the center of the layer, rather
than the center of the graphic that represents the target element, the active
area may not correspond exactly to the graphic if the layer and the graphic are
different sizes.
A drag element is considered to be inside the active area if the center of the layer
the drag element occupies is inside the circle that defines the active area. (The
position of the pointer doesn’t matter; it can be inside or outside the active area.)
If the graphic that represents the drag element and the layer it occupies are
different sizes, their centers won’t correspond. If the center of the drag graphic is
inside the active area, but the center of the drag layer isn’t, then the drag element
hasn’t hit the target. On the other hand, if the center of the drag layer is inside the
active area, the drag element has hit the target—even if the center of the drag
graphic is outside the active area.
The active area of placeholder targets
The layer that each placeholder target occupies is 96 pixels square. The active area
of each placeholder target (set on the Pairs tab) has a radius of 75 pixels. That
means the active area extends 27 pixels beyond the left, right, top, and bottom
edges of the target layer.
Remember, the active area is measured from the center of the target layer, not the
center of the graphic that occupies the layer. If you replace the placeholder graphic
with an image that’s larger or smaller, you may need to adjust both the size of the
layer and the radius of the active area.
126
Chapter 4
Setting how an element behaves
when dropped
To set the size of a target’s active area:
1
In the CourseBuilder Interaction dialog box, click the Pairs tab.
2
In the Pairs tab, in the Snap If Within field, type the size (in pixels) of the circle
that defines the target element’s active area.
The CourseBuilder Interaction uses the number you type as the radius of the
circle—the distance from the circle’s center to its edge.
To set what happens when a dropped element misses the target:
1
2
Select a Reaction option:
To return the drag element to its original position, select “Snap back if not
dropped on target.”
To leave the drag element where the user has dropped it, deselect “Snap back if
not dropped on target.”
To set what happens when an element is dropped on the wrong target:
1
2
Select a Reaction option:
To return the drag element to its original position, select “Snap back
if incorrect.”
To snap the drag element to the target, deselect “Snap back if incorrect.”
To set where the dropped element snaps:
1
2
Select a Snap To option:
To center the dropped element over the target or to align it with the target’s
left, right, top, or bottom edge, select the first Snap To option and then
select the setting you want from the pop-up menu. For more information,
see “Pairs options” on page 289.
To position the dropped element more precisely, select the second Snap To
option and enter pixel values in the two fields. For more information,
see “Pairs options” on page 289.
127
Making an element a drag element or a target
To set an element as a drag or target element:
1
2
In the Element Is pop-up menu, select:
Drag Element to allow users to drag the element
Target Element to make the element a target
Both Drag and Target to allow users to drag the element and to allow the
element to work as a target as well
128
Chapter 4
5
CHAPTER 5
Explore CourseBuilder Interactions
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Explore interactions overview
Use the explore CourseBuilder Interaction to let users explore an on-screen object
by clicking its hot areas. For example, students can explore hot areas with
information on specific parts of a graphically represented object or concept.
The explore CourseBuilder Interaction contains one or more clickable hot areas—
HTML layers that initiate defined actions when clicked. The hot area layers can
contain images or text, or remain empty and invisible.
The explore CourseBuilder Interaction can also include a backdrop image file on
which the hot area layers sit.
129
The explore templates
You can choose from three explore CourseBuilder Interaction templates:
Explore_Transparent random exploration (transparent). Use to create
explore exercises of objects, processes, or concepts whose parts can
be examined in any order. Contains a background image and five
transparent hot areas.
For details about how the template works, see “Random exploration” on
page 135.
For information about using the template, see “Creating a random
exploration” on page 136.
Explore_Random random exploration. Use to create explore exercises
of objects, processes, or concepts whose parts can be examined in any
order. Contains a background image and five hot areas containing
placeholder graphics.
For details about how the template works, see “Random exploration” on
page 135.
For information about using the template, see “Creating a random
Explore_Areas structured exploration. Use to create explore exercises of
objects, processes, or concepts whose parts are best examined in a particular
order. Contains four hot areas containing placeholder graphics.
For details about how the template works, see “Structured exploration” on
page 138.
For information about using the template, see “Creating a structured
130
Chapter 5
The explore CourseBuilder Interaction tabs
General tab
on this tab.
CourseBuilder Interaction in the Condition Editor and other dialog boxes.
Interaction Name
page 163.
Judge Interaction
Correct When
Knowledge Track
Tries Are
Time Is
Reset
Background Image File is the name of the image used for the background. See
“Replacing placeholder graphics” on page 141.
places the CourseBuilder Interaction text and controls in a layer. See
“Inserting a CourseBuilder Interaction into a layer” on page 166.
Layer
Tracking tab
131
Hot Areas tab
See “Hot areas options” on page 291 for detailed information about the options
on this tab.
lists all of the hot areas in the CourseBuilder Interaction. Use the
buttons to add and delete hot areas. See “Adding and deleting hot areas” on
page 142.
Hot Areas
Name
is the name of the selected hot area. See “Naming a hot area” on page 141.
Text is text that’s displayed on the page with the selected hot area. See “Adding text
to a hot area” on page 142.
is the name of the image file that contains the selected hot area’s graphic.
Image
Hot Area Is determines whether choosing a hot area is the right or wrong response.
is the value assigned to choosing the hot area. See “Scoring a response” on
page 255.
Score
Action Manager tab
If a user clicks a given hot area (see “Explore segments” on page 300)
on page 296)
132
Chapter 5
Explore CourseBuilder Interactions—step-bystep procedures
What you can do
Create a random exploration
“Creating a random exploration” on page 136
Create a structured exploration
“Creating a structured exploration” on
page 139
Replace the placeholder graphics
“Replacing placeholder graphics” on page 141
Give a hot area a descriptive name
“Naming a hot area” on page 141
Add or delete hot areas from an
interaction
“Adding and deleting hot areas” on page 142
Add text to a hot area
“Adding text to a hot area” on page 142
Create invisible hot areas
“Creating a random exploration” on page 136
“Explore segments” on page 300
Interaction
page 158
page 158
which are wrong
page 254
the user
Display feedback in a text field,
layer, or frame rather than in a
pop-up message
respond correctly
page 163
as soon as the user clicks a hot area,
when the user clicks a Submit button,
or when some event occurs
of a test
133
What you can do
instruction system, such as Lotus
Pathware
different name
on page 164
page 165
134
Chapter 5
Random exploration
Random exploration (transparent)
Random exploration
The two random exploration templates are ideal for interactions that allow users
to explore the parts of objects, processes, or concepts in any order.
The random exploration templates contain a background image (see Background
Image File in the General tab options) and five hot areas containing placeholder
graphics (see the Image option oin the Hot Areas tab). The placeholder graphics
are transparent in one version of the template.
All of the hot areas are not judged (see the Hot Area Is option on the Hot
Areas tab).
The CourseBuilder Interaction judges a user’s response every time the user clicks a
hot area (see the Judge Interaction option on the General tab).
The CourseBuilder Interaction displays feedback for each hot area a user clicks.
(See the Hot Area Feedback segments in the Action Manager tab; see “Explore
segments” on page 300 for details.)
For a step-by-step guide to using this template, see “Creating a random
“Hot areas options” on page 291
“Explore segments” on page 300 (Action Manager tab)
135
Creating a random exploration
Explore interactions work only in version 4 or later browsers. (You can also use
them in Netscape Navigator 3 if the images contain no transparent pixels.)
See “The explore CourseBuilder Interaction tabs” on page 131 for an overview
of the tabs.
To create a random exploration:
1
Insert a CourseBuilder Interaction in the document by doing one of the
following:
document window.
2
Browsers; then in the Category list, select Explore.
3
In the template gallery, select the random exploration icon.
Random exploration (transparent).
For version 4 and later browsers.
4
Random exploration. For
version 4 and later browsers
5
Add more hot areas, or delete hot areas you don’t need.
See “Adding and deleting hot areas” on page 142.
136
Chapter 5
6
Click OK.
7
In the Dreamweaver document, align the hot area layers with the
background image.
8
Replace the default instructions that appear above the images.
What you can do
different name
on page 164
which are wrong
page 254
of a test
page 163
in the template
the question again
page 165
Save a custom true/false question
Coursebuilder Interaction as a
template
137
Structured exploration
The structured exploration template is ideal for creating explorations of objects,
processes, or concepts whose parts are best examined in a particular order.
The structured exploration template contains four hot areas containing
placeholder graphics (see the Image option on the Hot Areas tab).
All of the hot areas are not judged (see the Hot Area Is option on the Choices tab).
The CourseBuilder Interaction judges a user’s response every time the user clicks a
hot area (see the Judge Interaction option on the General tab).
The CourseBuilder Interaction displays feedback for each hot area a user clicks.
(See the Hot Area Feedback segments in the Action Manager tab.)
For a step-by-step guide to using this template, see “Creating a structured
“Hot areas options” on page 291
“Explore segments” on page 300 (Action Manager tab)
138
Chapter 5
Creating a structured exploration
Explore interactions work only in version 4 (or later) browsers. (You can also use
them in Netscape Navigator 3 if the images contain no transparent pixels.)
See “The explore CourseBuilder Interaction tabs” on page 131 for an overview of
the tabs.
To create a structured exploration:
1
the following:
document window.
2
Browsers; then in the Category list, select Explore.
3
In the template gallery, select the structured exploration icon.
4
5
Click OK.
6
In the Dreamweaver document, align the hot area layers.
7
Replace the default instructions that appear above the images.
139
What you can do
different name
on page 164
which are wrong
page 254
of a test
page 163
in the template
the question again
page 165
140
Chapter 5
Save a custom true/false question
template
Replacing placeholder graphics
To replace the background image in an explore interaction:
1
In the CourseBuilder Interaction dialog box, click the General tab.
2
In the Background Image File field, click Browse, then navigate to and select
the image file you want to use in place of the placeholder background graphic.
To replace the hot area graphics in an explore interaction:
1
Open the CourseBuilder Interaction dialog box, then click the Hot Areas tab.
2
In the Hot Areas list, select the hot area that’s associated with the placeholder
graphic you want to replace.
3
Click the Browse button (next to the Image field), and select the image file you
want to use in place of the placeholder graphic.
To replace any placeholder image directly in a document:
1
Double-click the placeholder graphic.
2
In the dialog box that appears, locate the image file you want to use
and open it.
Naming a hot area
The templates assign default names (HotArea1, HotArea2, and so on) to each
hot area. Giving a hot area a more descriptive name makes it easier to work with.
The name you give a hot area appears only in the CourseBuilder Interaction
dialog box.
To change the name of a hot area:
1
Open the CourseBuilder Interaction dialog box, then click the Hot Areas tab.
2
In the Hot Areas list at the top of the tab, select the name of the hot area you
want to change.
3
141
Adding text to a hot area
Add text to a hot area to identify for users what the hot area represents. The text
you add appears with the hot area on the page.
To add text to a hot area:
1
In the CourseBuilder Interaction dialog box, click the Hot Areas tab.
2
want to add text to.
3
In the Text field, type the text you want to add.
After you close the dialog box, use the commands on the Text menu to modify the
appearance of the text.
Adding and deleting hot areas
Go to the Hot Areas tab:
In the CourseBuilder Interaction dialog box, click the Hot Areas tab.
To delete a hot area:
want to delete; then click Delete.
To add a hot area:
1
In the Hot Areas list at the top of the tab, select the name of the hot area whose
2
Click Add.
CourseBuilder for Dreamweaver duplicates the hot area.
3
Name the hot area.
See “Naming a hot area” on page 141.
4
See “Explore CourseBuilder Interactions—step-by-step procedures” on
page 133.
5
Replace the placeholder image with the image you want to use.
142
Chapter 5
6
CHAPTER 6
Text Entry CourseBuilder Interactions
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Text entry interaction overview
These CourseBuilder Interactions gather brief text responses—either words or
phrases—from the user. For example, you could use this CourseBuilder
Interaction to create fill-in-the-blank exercises.
You can also use a text entry CourseBuilder Interaction to have the student show
mastery of subject matter. Text entry interactions are useful for determining
whether students are retaining the information from a tutorial or presentation
rather than just recalling a correct response from its remembered position.
The text entry CourseBuilder Interaction displays a single- or multiple-line
HTML text input box that accepts either plain or password-encrypted text. Text
that the user types in the box is compared against characters or strings (called
possible responses) defined for the CourseBuilder Interaction. When user input
matches one of the defined strings, actions occur—depending on whether you
have designated the string as correct, incorrect, or not judged.
143
The text entry templates
You can choose from two text entry CourseBuilder Interaction templates, and
then use the tabs on the CourseBuilder Interaction dialog box to customize the
text entry interaction:
Text_Singleline single-line text entry. Places an empty text field on the page,
along with a Submit button and a Reset button.
For details about how the template works, see “Single-line text entries” on
page 149.
For information about using the template, see “Creating a text entry field” on
page 151.
Text_Multiline multiple-line text entry. Places an empty text area on the
page.
For details about how the template works, see “Multiple-line text entries” on
page 150.
For information about using the template, see “Creating a text entry field” on
page 151.
144
Chapter 6
The text entry CourseBuilder Interaction tabs
General tab
on this tab.
Interaction Name
is default text that appears in the text entry field and that the user can
replace. See “Adding default text to a field” on page 153.
Initial Text
page 163.
Judge Interaction
Correct When
Knowledge Track
Tries Are
Time Is
Reset
places the entire CourseBuilder Interaction in a layer. See “Inserting a
Layer
Tracking tab
145
Responses tab
See “Responses options” on page 292 for detailed information about the options
on this tab.
Possible Responses lists all of the responses the CourseBuilder Interaction is set up
to evaluate individually. Use the buttons to add and delete responses. See “Adding
and deleting responses” on page 154.
Name
is the name of the selected response. See “Naming a response” on page 153.
is the text the CourseBuilder Interaction recognizes as a match for
the current response. See “Creating a text entry field” on page 151 and “Checking
for key words or phrases” on page 155.
Must Contain
requires that the user’s capitalization matches the capitalization in
the Must Contain field. See “Checking for correct capitalization” on page 154.
Case sensitive
Exact match required recognizes a match only if the user types exactly—no more
and no less than—what’s in the Must Contain field. If this setting is unselected, a
match is recognized even if the user’s response isn’t exact but contains the text in
the Must Contain field. See “Checking for an exact match” on page 155 and
“Checking for key words or phrases” on page 155 for more information.
determines whether a response is right or wrong. See “Marking a
Match Is
Score
is the value assigned to the response. See “Scoring a response” on page 255.
Any Other Response Is determines whether any response other than those
explicitly defined is right or wrong. See “Checking for unanticipated responses”
on page 156.
146
Chapter 6
Action Manager tab
The Action Manager tab contains logic segments set up as if...then conditions that
on page 296)
Text entry CourseBuilder Interactions—stepby-step procedures
What you can do
Create a single- or multiple-line text
entry field
“Creating a text entry field” on page 151
Give a response a descriptive name
“Naming a response” on page 153
Display preset text in the text field
“Adding default text to a field” on page 153
Consider text a match only if it’s
capitalized a certain way
“Checking for correct capitalization” on
page 154
Accept only an exact match as correct “Checking for an exact match” on page 155
Accept text containing a key word or
phrase as a match
“Checking for key words or phrases” on
page 155
Handle entries that don’t match any of “Checking for unanticipated responses” on
the possible responses you’ve defined page 156
Add or delete responses from an
interaction
“Adding and deleting responses” on page 154
“Text entry segments” on page 301
Interaction
page 158
page 158
which are wrong
page 254
147
What you can do
the user
Display feedback in a frame, layer,
status bar, or text field rather than in
a pop-up message
complete an interaction correctly
respond correctly
page 163
as soon as the user clicks outside the
text field, when the user clicks a
Submit button, or when some
event occurs
of a test
different name
on page 164
page 165
148
Chapter 6
Single-line text entries
The single-line text entry template places a text field on the page, along with a
Submit button and a Reset button.
The template is set up with three possible responses (see the Possible Responses
list on the Responses tab). The first response is correct; the other two responses
are incorrect (see the Match Is option). Capitalization is ignored (see the Case
Sensitive option), but otherwise the user must type exactly the text of the
response for the CourseBuilder Interaction to consider the user’s response a match
(see the Must Contain and the Exact Match Required options). Any response that
doesn’t match one of the three possible responses isn’t judged (see the Any Other
Response Is option).
The CourseBuilder Interaction judges a user’s response when the user clicks the
A user can clear the field either before or after clicking the Submit button by
clicking the Reset button (see the Reset option on the General tab).
incorrectly. It also displays feedback if the user types something other than one
of the three possible responses. See the Correctness segment in the Action
Manager tab.
For a step-by-step guide to using this template, see “Creating a text entry field” on
page 151.
“Responses options” on page 292
“Text entry segments” on page 301 (Action Manager tab)
149
Multiple-line text entries
The multiple-line text entry template places an empty text box on the page, along
with a Submit button and a Reset button.
The template is set up with three possible responses (see the Possible Responses
list on the Responses tab). The first response is correct; the other two responses are
incorrect (see the Match Is option). Capitalization is ignored (see the Case
Sensitive option). The CourseBuilder Interaction considers the user’s response a
match if it contains the text of one of the possible responses (see the Must Contain
and the Exact Match Required options). Any response that doesn’t match one of
the three possible responses isn’t judged (see the Any Other Response Is option).
The CourseBuilder Interaction judges a user’s response when the user clicks the
A user can clear the field either before or after clicking the Submit button by
clicking the Reset button (see the Reset option on the General tab).
incorrectly. It also displays feedback if the user types something other than one
of the three possible responses. See the Correctness segment in the Action
Manager tab.
For a step-by-step guide to using this template, see “Creating a text entry field” on
page 151.
“Responses options” on page 292
“Text entry segments” on page 301 (Action Manager tab)
150
Chapter 6
Creating a text entry field
See “The text entry CourseBuilder Interaction tabs” on page 145 for an overview
of the tabs.
To create a text entry field:
1
the following:
document window.
Choose Insert > CourseBuilder Interaction
2
Browsers; then in the Category list, select Text Entry.
3
In the template gallery, select the text entry icon you want to use.
Single line
4
Multiple line
Click the Responses tab. In the Possible Responses list at the top of the tab,
select the first response, and type the text of the correct answer in the Must
Contain field. Repeat for each of the wrong answers.
If you want to delete default responses or add additional ones, see “Adding and
deleting responses” on page 154.
5
Click OK.
6
Replace the placeholder text above the text field with a question or instructions.
151
What you can do
Give a response a descriptive name
“Naming a response” on page 153
Display default text in the text field
“Adding default text to a field” on page 153
Consider text a match only if it’s
capitalized a certain way
“Checking for correct capitalization” on
page 154
Accept only an exact match as correct “Checking for an exact match” on page 155
Accept text containing a key word or
phrase as a match
“Checking for key words or phrases” on
page 155
Handle entries that don’t match any of “Checking for unanticipated responses” on
the possible responses you’ve defined page 156
Judge a CourseBuilder Interaction
when a user tabs out of the field, or
judge it when the user clicks a Submit
button
different name
on page 164
of a test
answer correctly
answer correctly
page 163
in the template
Remove the Reset button
page 165
Place the entire CourseBuilder
Interaction in a layer so you can hide into a layer” on page 166
it, position it, or manipulate it in some
other way as a layer
152
Chapter 6
Adding default text to a field
If most users are going to supply the same information in a text field, provide that
information as the default. Or give users an example of the format in which they
should enter information. For example, display mm/dd/yyyy in a date field.
To add default text to a field:
1
Open the CourseBuilder Interaction dialog box, then click the General tab.
2
In the Initial Text field, type the text you want the CourseBuilder Interaction to
display in the text entry field.
Naming a response
The templates assign default names (Response1, Response2, and so on) to each
possible response. The name of a response is different from the text you expect
users to enter. The name of the choice appears only in the CourseBuilder
Interaction dialog box; it’s merely a way of labeling a response to make it easier
to work with.
To change the name of a response:
1
Open the CourseBuilder Interaction dialog box, then click the Responses tab.
2
In the Possible Responses list at the top of the tab, select the name of the
response you want to change.
3
153
Adding and deleting responses
Go to the Responses tab:
To delete a response:
In the Possible Responses list at the top of the tab, select the name of the response
you want to delete, then click Delete.
To add a response:
1
In the Possible Responses list at the top of the tab, select the name of the
response whose properties are most like the one you want to add.
2
Click Add.
CourseBuilder for Dreamweaver duplicates the response.
3
Name the response.
See “Naming a response” on page 153.
4
See “Text entry CourseBuilder Interactions—step-by-step procedures” on
page 147.
Checking for correct capitalization
Correct capitalization means that the text a user types is capitalized exactly as the
text in the Must Contain field.
To accept an entry as a match only if it’s capitalized correctly:
1
2
In the Possible Responses field, select the response you want to check for
correct capitalization.
3
Select the Case Sensitive option.
If you want to mark the response as correct, see “Marking a response right or
154
Chapter 6
Checking for an exact match
An exact match means that the text a user types must be the same as the text in the
Must Contain field—the same spelling, same spacing, and same punctuation.
Only the capitalization may vary. (To check for an exact match that’s also
capitalized correctly, see “Checking for correct capitalization” on page 154.)
To accept only an exact match:
1
2
In the Possible Responses field, select the response you want to accept only if
it’s matched exactly.
3
Select the Exact Match Required option.
Checking for key words or phrases
You may not care exactly what users type as long as what they type contains key
words and phrases.
To accept text with key words and phrases as a match:
1
2
In the Must Contain field, type a key word or phrase.
3
Deselect the Exact Match Required option if it’s selected.
4
Repeat steps 2 and 3 for each word or phrase you want to accept.
155
Checking for unanticipated responses
Some users may respond in ways you can’t anticipate. Expect the unanticipated,
and set up the CourseBuilder Interaction to handle it.
To handle unanticipated responses:
1
2
Select an Any Other Response Is setting for any text that fails to match one of
the responses you’ve defined:
Select Correct to treat unanticipated responses as correct.
The CourseBuilder Interaction displays the feedback triggered by the “if
Correct” condition in the Correctness segment.
Select Incorrect to treat unanticipated responses as incorrect.
The CourseBuilder Interaction displays the feedback triggered by the “else if
Incorrect” condition in the Correctness segment.
Select Unjudge to treat unanticipated responses as unknown.
The CourseBuilder Interaction displays the feedback triggered by the “else if
Unknown Response” condition in the Correctness segment.
See “Correctness segment” on page 296 for more information.
See also “Customizing feedback” on page 159.
156
Chapter 6
7
CHAPTER 7
Enhancements and Customization
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Enhancing and customizing CourseBuilder
Interactions
CourseBuilder for Dreamweaver offers many ways to enhance and customize web
based learning interactions:
Change the default feedback a CourseBuilder Interaction provides. Personalize
feedback for each student. See “Customizing feedback” on page 159.
Display feedback in a frame, layer, window status bar, or text field instead of in
a pop-up message. See “Displaying feedback in a frame, layer, status bar, or text
field” on page 160.
Limit the number of tries a user has to respond to an interaction correctly. See
Limit the amount of time a user has to respond to an interaction correctly. See
Control the event that starts the evaluation of the Action Manager. See “Setting
when a CourseBuilder Interaction is judged” on page 163.
Give the Submit button a different label. See “Changing the name of the
Submit button” on page 164.
Add a button to a CourseBuilder Interaction so that a user can start the
interaction over. See “Resetting a CourseBuilder Interaction” on page 165.
Insert a CourseBuilder Interaction into a layer. See “Inserting a CourseBuilder
Change the default scripts and images folder, the tries and time limits used in
the templates, the default labels on Submit and Reset buttons, and other
standard settings. See “Setting preferences” on page 167.
157
Add a web-packaged Authorware piece to a page. See “Authorware integration”
on page 167.
Save a CourseBuilder Interaction you’ve customized to the Gallery so you can
use it as a template. See “Adding a CourseBuilder Interaction template to the
Gallery” on page 169.
Editing CourseBuilder Interactions
To make edits to a CourseBuilder Interaction:
1
Select the CourseBuilder Interaction icon in the document.
2
Click Edit in the Property inspector. (See also “What you can do with
CourseBuilder for Dreamweaver” on page 12.)
The CourseBuilder Interaction dialog box appears.
3
Make whatever changes you want to the CourseBuilder Interaction, then
click OK.
Cutting, copying, pasting, and clearing
interactions
Use the Cut, Copy, Paste and Clear commands located on the Edit menu to affect
an entire CourseBuilder Interaction.
To edit an entire CourseBuilder Interaction:
Select the CourseBuilder Interaction icon in the document, then do one of
the following:
Choose Edit > Cut to cut a CourseBuilder Interaction from a document.
Choose Edit > Copy to copy a CourseBuilder Interaction.
Choose Edit > Paste to copy a CourseBuilder Interaction. If you copy the
CourseBuilder Interaction into the same document, the name of the new
interaction increments by one to avoid duplicating the name of the
original interaction.
Choose Edit > Clear to delete a CourseBuilder Interaction from a document as
well as to delete any HTML source code associated to the interaction.
158
Chapter 7
Customizing feedback
Many of the CourseBuilder Interaction templates have a correct response set
by default. The feedback that appears when a user responds is also provided
by default.
If you set a tries limit or a time limit, the feedback that appears when the limit is
reached is also provided by default.
When you customize feedback, you can embed JavaScript variables in the text of
the message to personalize the feedback for each student. See “JavaScript variables
for tracking performance” on page 265.
To change the default feedback for correct, incorrect, or unknown responses:
1
Open the CourseBuilder Interaction dialog box, then click the Action
Manager tab.
2
Go to the Correctness segment.
See “Correctness segment” on page 296 for a description of the segment.
3
Under the “if Correct” condition, select Popup Message; then click Edit.
4
In the Popup Message dialog box, type the text you want to appear when a
user’s response to the CourseBuilder Interaction is correct, and click OK.
See also “Displaying feedback in a frame, layer, status bar, or text field” on
page 160.
5
Under the “else if Incorrect” condition, select Popup Message; then click Edit.
6
user’s response to the CourseBuilder Interaction is incorrect, and click OK.
7
Under the “else if Unknown Response” condition, select Popup Message;
then click Edit.
8
user’s response to the CourseBuilder Interaction isn’t known, and click OK.
159
To change the default feedback for a time or tries limit:
1
Manager tab.
2
In the Check Time or Check Tries segment, select Popup Message, and
click Edit.
See “Check Time segment” on page 296 or “Check Tries segment” on page 296
for a description of the segment.
3
In the Popup Message dialog box, type the text you want to appear if a user
reaches the tries limit, and click OK.
See also “Displaying feedback in a frame, layer, status bar, or text field” on
page 160.
Displaying feedback in a frame, layer, status
bar, or text field
The default feedback provided by the templates appears in a pop-up message. You
can also display feedback in a frame, a layer, a status bar, or a text field.
Displaying feedback in a frame
For information about creating frames, see the “Using Frames” chapter in the
Using Dreamweaver book.
To display text in a frame instead of a pop-up message:
160
Chapter 7
1
Create a frame to use for feedback.
2
In the Frame Property inspector, in the FrameName field, type a name for
the frame.
3
Select the CourseBuilder Interaction for which you’re creating feedback.
4
In the CourseBuilder Interaction dialog box, click the Action Manager tab.
5
In the Action Manager list, select the action you want the feedback to follow.
6
In the Action pop-up menu, choose Set Text of Frame, then click Add.
7
In the Set Text of Frame dialog box, in the Frame pop-up menu, choose the
frame in which you want the text displayed.
8
In the New HTML field, type the feedback message you want displayed.
9
Displaying feedback in a layer
For information about creating layers, see the “Using Layers” chapter in the Using
Dreamweaver book.
To display text in a layer instead of a pop-up message:
1
Create a frame to use for feedback.
2
Position the layer in the Document window.
3
In the Layer Property inspector, in the Layer ID field, type a name for
the frame.
4
5
6
7
In the Action pop-up menu, choose Set Text of Layer, then click Add.
8
In the Set Text of Layer dialog box, in the Layer pop-up menu, choose the
frame in which you want the text displayed.
9
In the New HTML field, type the feedback message you want displayed.
10
Displaying feedback in a status bar
To display text in a status bar instead of a pop-up message:
1
2
3
4
In the Action pop-up menu, choose Set Text of Status Bar, then click Add.
5
In the Set Text of Status Bar dialog box, in the Message field, type the text of
the feedback message you want to display.
6
161
Displaying feedback in a text field
For information about creating forms, see the “Using Forms” chapter in the Using
Dreamweaver book.
To display text in a text field instead of a pop-up message:
1
Create a text field to use for feedback.
2
In the Text Field Property inspector, in the TextField field, type a name for the
text field.
3
4
5
6
In the Action pop-up menu, choose Set Text of Text Field, then click Add.
7
In the Set Text of Text Field dialog box, in the Text Field pop-up menu, choose
the text field in which the feedback will be displayed.
8
In the New Text field, type the feedback message you want displayed.
9
Limiting the number of tries
1
2
In the Tries Are field, type the number of tries you want to allow users.
The CourseBuilder Interaction template provides default feedback if a user
reaches the number of tries you’ve set as the limit. To provide different
feedback, see “Customizing feedback” on page 159.
Edit the preferences file to set a new default tries limit for all the templates. See
“Setting preferences” on page 167.
162
Chapter 7
Putting a time limit on an interaction
1
2
In the Time Is field, type the number of seconds you want to give users to
respond to the interaction.
The CourseBuilder Interaction template provides default feedback if time runs
out before a user responds. To provide different feedback, see “Customizing
feedback” on page 159.
Edit the preferences file to set a new default time limit for all the templates. See
“Setting preferences” on page 167.
Setting when a CourseBuilder Interaction
is judged
Judge has two meanings in CourseBuilder for Dreamweaver. One is the more
obvious instructional meaning: evaluating whether a user’s response is right or
wrong—or not judged at all. The other meaning is programmatic: judging an
interaction means executing the code in the Action Manager. Judging an
interaction may involve evaluating a student’s response as right or wrong, but
it doesn’t have to. On the other hand, evaluating a student’s response can
happen only when the CourseBuilder Interaction executes the code in the
Action Manager.
The Judge Interaction option on the General tab determines when the
CourseBuilder Interaction executes the code in the Action Manager. The
CourseBuilder Interaction may incidentally evaluate whether the user’s response is
right or wrong, but only if there’s code in the Action Manager that causes
something to happen based on whether the response was marked as right or
wrong. (See “Marking a response right or wrong” on page 254 and “Correctness
segment” on page 296.)
You can choose one of three types of events to trigger the execution of the code in
the Action Manager:
for example, a user
selects an answer in a multiple-choice question, or a user drags an element to a
target. Such actions produce immediate results: as soon as a user selects an answer
in a multiple-choice question, the CourseBuilder Interaction immediately
executes the code in the Action Manager—perhaps to provide feedback, perhaps
(for example, in an online survey) merely to record the answer and to go to the
next question.
A user action characteristic of the CourseBuilder Interaction:
163
in an all-that-apply question or in a drag-anddrop matching exercise with several matching pairs, the CourseBuilder Interaction
has no way of knowing when the user is finished responding except through a
mechanism that’s not part of the interaction. Clicking a Submit button instructs
the CourseBuilder Interaction to start executing the code in the Action Manager.
A user clicking a Submit button:
An event entirely outside the CourseBuilder Interaction: imagine a series of pages
with a CourseBuilder Interaction on each page and a Next button that takes the
user to the next page. Attached to the BODY tag of the page is a behavior consisting
of an onUnload event and a Judge action. When a user clicks the Next button, it
triggers the onUnload event, which in turn triggers the Judge action, which
executes the code in the Action Manager.
Setting a tries or time limit for an interaction is another way of choosing an event
that can trigger the execution of the Action Manager.
To set when a CourseBuilder Interaction is judged:
1
2
Choose the appropriate setting for the Judge Interaction option:
When the user clicks a button labeled Submit
When the user performs an action characteristic of the interaction
On a specific event
Changing the name of the Submit button
1
2
Find the Judge Interaction section.
The first option is “when the user clicks a button labeled Submit.”
3
Replace Submit with the text you want to appear on the button.
Edit the preferences file to set a new default label for the Submit button in all of
the templates. See “Setting preferences” on page 167.
164
Chapter 7
Resetting a CourseBuilder Interaction
Resetting clears any input a user has made during an interaction and returns all
the properties of the interaction to their initial settings. Clicking a Reset button
doesn’t, however, deselect any selected radio buttons in a multiple-choice
interaction. Some CourseBuilder Interactions, such as all-that-apply questions, are
set up by default to allow users to reset them.
Edit the preferences file to change the label on the Reset button in all of the
templates. See “Setting preferences” on page 167.
To allow users to reset a CourseBuilder Interaction:
1
2
Select the Reset option.
To prevent users from resetting a CourseBuilder Interaction:
1
2
Deselect the Reset option.
165
Inserting a CourseBuilder Interaction
into a layer
The “Insert this Interaction in a layer” option on the General tab places a
CourseBuilder Interaction in its own layer. Inserting a CourseBuilder Interaction
into a layer allows absolute placement of the CourseBuilder Interaction on the
page and simplifies Netscape layer issues.
You’re likely to encounter problems in Netscape Navigator 4 if you’re using layers.
The main problem you’ll discover is that layers can’t be nested. If you nest layers,
any other layers on the page won’t function. Netscape Navigator also has problems
with tags that are required by CourseBuilder Interactions. The “Insert this
Interaction in a layer” option inserts only the relevant HTML tags in a layer and
avoids nesting layers. For drag-and-drop, explore, and slider CourseBuilder
Interactions, which are already in layers, only the question text and controls are
placed in the layer. After you select the “Insert this Interaction in a layer” option,
you need to manually position all of the layers that are part of the CourseBuilder
Interaction. If you want to show and hide the CourseBuilder Interaction, you also
need to show and hide each of the layers that are part of it.
Inserting a CourseBuilder Interaction into its own layer also facilitates the use of
various actions, such as Show-Hide Layers.
This feature works only in version 4 and later browsers.
Multiple-choice, button, text entry, and timer CourseBuilder Interactions
are
placed in a layer in their entirety.
Drag-and-drop, explore, and slider CourseBuilder Interactions already contain
elements in layers. Only the text part of the CourseBuilder Interaction and the
Submit and Reset buttons are placed in a layer.
To insert a CourseBuilder Interaction into a layer, do either of the following:
Open the CourseBuilder Interaction dialog box, click the General tab, then
select “Insert this Interaction in a layer.”
Select the CourseBuilder Interaction icon in the document, then select “Insert
this Interaction in a layer” in the Property inspector.
166
Chapter 7
Setting preferences
Edit Preferences.txt to set, among other things:
The default names of the script and image folders
The default tries and time limits used in all of the templates
The default labels on Submit and Reset buttons
For information about all of the defaults you can set, see Preferences.txt. This file
is located in Dreamweaver\CourseBuilder\Config.
Authorware integration
The Authorware object for Dreamweaver allows you to incorporate Authorware
pieces into web pages created with CourseBuilder for Dreamweaver.
Before you add an Authorware piece to a web page:
1
Package the piece for the web.
For more information about creating and packaging Authorware pieces for the
web, see Authorware Attain Help.
2
Configure your web server to serve web-packaged Authorware pieces.
See Configuring Your Server for Web-packaged Pieces at http://
www.macromedia.com/support/authorware/attain/how/expert/awconfig/
awconfigcontents.html/ for more information.
For a step-by-step guide to adding an Authorware piece to a web page, see “Using
the Insert Authorware object” on page 168.
You can also set up your web page to automatically install the Authorware Web
Player for the user’s browser. Users then don’t need to leave your web site to
download the player. See Authorware Web Player AutoInstall at http://
www.macromedia.com/support/authorware/attain/how/web/resources/a5autoin/
a5autoin.html for more information.
167
Using the Insert Authorware object
1
Save your document before you start.
2
In the Object palette, click the Authorware object.
Authorware object
3
In the Insert Authorware dialog box, click Browse, then navigate to the map file
for the web-packaged Authorware piece you want to insert.
Authorware map files have the AAM file extension.
4
Click OK.
A box representing the web-packaged Authorware piece is inserted into
your document.
168
Chapter 7
5
Drag the corners of the box to resize the bounding rectangle for the webpackaged Authorware piece.
6
Choose File > Preview in Browser to run the web-packaged Authorware piece.
Managing CourseBuilder Interaction templates
Once you’ve customized a CourseBuilder Interaction, you can save it as a
template. Your new templates will be available for you to select in the
CourseBuilder Interaction Gallery. Adding templates to the CourseBuilder
Interaction Gallery lets you easily generate multiple instances of a custom
CourseBuilder Interaction without redefining an object from scratch each time.
You can add your CourseBuilder Interaction template to an existing category of
CourseBuilder Interactions or create new categories for organizing templates.
Adding a CourseBuilder Interaction template to the Gallery
Once you’ve customized a CourseBuilder Interaction, use the Add Interaction To
Gallery command to save the interaction as a template so you can use it again.
Add the CourseBuilder Interaction template to an existing category of
CourseBuilder Interactions, or create a new category.
To save a CourseBuilder Interaction as a template:
1
In the Document window, select the CourseBuilder Interaction icon.
2
Choose Modify > CourseBuilder > Add Interaction To Gallery.
3
In the Add Interaction To Gallery dialog box, select or create a Gallery
Category.
saves the template in the category selected from the pop-up menu to
the right. Select the appropriate category.
Existing
New saves the template in a new category. Use the field to give the category
a name.
4
Select the lowest version browser that supports the template.
4.0 browsers displays the template in the 4.0 Gallery only. Select this option
when the template uses features available only in version 4 or later browsers.
3.0 browsers displays the template in both the 3.0 and 4.0 browser views of the
Gallery. Select this option when the template uses features available both in
version 3 and version 4 browsers.
5
Name the template.
replaces an existing template. Template files that are locked or that are
set to “read only” can’t be replaced.
Existing
New
6
creates a template with a new name.
Click Select Icon to select an icon for the template.
The icon represents the template in the Gallery. To create a custom icon, see
“Creating a custom icon for a template” on page 170.
7
Click OK.
169
Creating a custom icon for a template
Create custom icons to make customized CourseBuilder Interaction templates
easier to identify in the Gallery.
Use a graphics tool to develop a custom GIF image. The recommended size of the
image is 80 x 80 pixels. (The image can be any size, but CourseBuilder for
Dreamweaver stretches or shrinks it to 80 x 80 pixels.)
Place the image in Dreamweaver\CourseBuilder\SupportFiles\Images.
Working with Gallery files
All of the CourseBuilder Interaction templates are located in category folders in
Dreamweaver\CourseBuilder\Gallery.
Each CourseBuilder Interaction category corresponds to an individual folder
preceded by a number. The number determines the sequence in which the
categories are displayed in the Category list in the CourseBuilder Interaction
dialog box. For example, the Multiple Choice category (folder name
010_MultipleChoice) precedes the Drag and Drop category (folder name
020_Drag and Drop).
In each category folder are template files. The templates are also ordered
numerically. Each template is composed of two files with the same file name:
a template file with the extension AGT and the template icon with the
extension GIF.
Arrange the categories and templates in the CourseBuilder Interaction Gallery to
reflect the way you use CourseBuilder for Dreamweaver.
To change category order in the Category list:
1
In the Gallery folder, locate the folder for the category you want to change.
2
Select the category folder, and change its number to reposition the interaction
type in the Category list.
Replace the number with a lower number to move the icon toward the top of
the list or with a higher number to move it toward the bottom of the list.
170
Chapter 7
To change placement of a template in the Gallery:
1
Locate the appropriate CourseBuilder Interaction category folder in the
Gallery folder.
2
Select the template’s GIF file, and change its number to reposition the template
icon in the Gallery.
Replace the number with a lower number to move the icon forward in the
display or with a higher number to move the icon back in the display.
3
Select the template’s AGT file.
4
Replace the number with the same number you gave the template’s GIF file.
To delete a template:
1
Locate the appropriate CourseBuilder Interaction category folder in the
Gallery folder.
2
Select the template’s GIF file, and delete it.
3
Select the template’s AGT file, and delete it.
171
172
Chapter 7
8
CHAPTER 8
CourseBuilder Interaction Controls
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Button CourseBuilder Interactions
Use button CourseBuilder Interactions as web page navigation controls or as part
of a complex interaction, such as a simulation of airplane cockpit controls. (You
can also use the multiple-choice templates to create certain types of button
interactions; see The multiple-choice templates.)
The button templates are easy to use, but unlike most of the other templates,
the CourseBuilder Interaction they place on a page—simple push buttons or
toggle switches—don’t do anything particularly useful by themselves. To use a
button effectively, you need to set it up as a component of some larger interaction.
Doing so requires an understanding of how an Action Manager works, the actions
that are available in CourseBuilder Interactions, and what each action does. See
Creating a button for more information.
Several different button images are available for you to choose from. You can also
use button images you’ve created (see Adding custom button graphics).
173
The button templates
Choose either of two button templates. The template icons represent the
function of each button, not its appearance. To choose the way a button looks, see
Choosing a look for a button. Or use graphics you’ve created yourself (see Adding
custom button graphics).
Button_Toggle toggle switch. Remains in a given position once set.
For details about how the template works, see Toggle switches.
For information about using the template, see Creating a button.
Button_Push push button. Returns to its deselected state right after it’s
clicked.
For details about how the template works, see Push buttons.
For information about using the template, see Creating a button.
174
Chapter 8
The button CourseBuilder Interaction tabs
General tab
See General options for detailed information about the options on this tab.
Interaction Name
is the name of the image file used for the button graphic. See
Choosing a look for a button.
Appearance
defines the button as a push button or a toggle button. See Changing the
type of button.
Type
Highlight on mouse over
highlights the button when the mouse is over it. See
Highlighting a button.
sets the state of the button before the user interacts with it. See
Changing the initial state of a button.
Initial State
user’s response. See Managing CourseBuilder Interaction templates.
Judge Interaction
defines what qualifies as a correct response. See Marking a response
right or wrong.
Correct When
Score
is the value assigned to the button. See Scoring a response.
sends information about a user’s performance to a computermanaged instruction system. See Tracking user performance.
Knowledge Track
limits the number of tries a user has to respond. See Limiting the
number of tries.
Tries Are
limits the amount of time a user has to respond. See Putting a time limit
on an interaction.
Time Is
places the button in a layer. See Managing CourseBuilder Interaction
templates.
Layer
Tracking tab
the General tab. See Tracking tab.
175
Action Manager tab
If a user selects or deselects a toggle switch (see Toggle-switch segment)
If a user clicks a push button (see Pushbutton segment)
If a user reaches a time limit that you’ve set on the General tab (see Check
Tries segment)
Check Tries segment)
Button CourseBuilder Interactions—
What you can do
Turn off the highlight that appears
“Highlighting a button” on page 182
when a user positions the pointer over
the button
Change whether the button is selected “Changing the initial state of a button” on
or deselected, and enabled or
page 183
disabled, when it appears
Change from a toggle switch to a
“Changing the type of button” on page 183
push button or from a push button to
a toggle switch
when a user clicks the button, or when is judged” on page 163
some other event takes place
Assign the button a value as part
of a test
Select a different image for the button “Choosing a look for a button” on page 182
176
Chapter 8
Use custom graphics for a button
“Adding custom button graphics” on
page 184
“Toggle-switch segment” on page 300
“Pushbutton segment” on page 301
Interaction
page 158
page 158
What you can do
the user
Display feedback in a frame,
layer, status bar, or text field rather
than in a pop-up message
respond correctly to an interaction
respond correctly
page 163
Place a button in a layer so you can
hide it, position it, or manipulate in
some other way
Save a custom button as a template
Toggle switches
For version 4 and later browsers only
A toggle switch—unlike a push button—remains in a given position once set.
Switch it on, it remains on; switch it off, it remains off.
The toggle switch template is set so it’s initially deselected, but enabled (see the
Initial State option on the General tab).
The CourseBuilder Interaction is set up to judge a user’s response as soon as the
user clicks the button (see the Judge Interaction option on the General tab).
The CourseBuilder Interaction displays feedback when the user clicks the button,
displaying a pop-up message that says whether the button is currently selected or
deselected. (See the Button Selected segment on the Action Manager tab; see
Toggle-switch segment for details.)
For a step-by-step guide to using this template, see Creating a button.
“Action Manager segments” on page 295
177
Push buttons
A push button—unlike a toggle switch—returns to its deselected state right after
it’s clicked.
The push button template is set so it’s initially deselected, but enabled (see the
Initial State option on the General tab).
The CourseBuilder Interaction is set up to judge a user’s response as soon as the
user clicks the button (see the Judge Interaction option on the General tab).
The CourseBuilder Interaction displays feedback when the user clicks the button,
displaying a pop-up message that says simply that the button has been pushed.
(See the Button Selected segment in the Action Manager tab; see Pushbutton
segment for details.)
For a step-by-step guide to using this template, see Creating a button.
178
Chapter 8
Creating a button
Buttons work only in version 4 and later browsers. (You can also use them in
Netscape Navigator 3 if the button images contain no transparent pixels.)
What a button does is determined by the actions you set up in the button
CourseBuilder Interaction’s Action Manager. In the templates, selecting either
state of a toggle switch or clicking a push button produces the same results: a
Popup Message action displays a message telling the user either which state a
toggle switch is in or simply that a button has been pushed. To change what a
button does, replace the Popup Message action with a different action.
You might replace the Popup Message action with an action that’s equally simple,
such as Go To URL. If the button is part of a complex interaction—such as a
simulation of airplane cockpit controls—you might replace the Popup Message
action with a Judge Interaction action, which triggers the evaluation of an entire
Action Manager. You might replace the Popup Message action with several actions
or even with conditions that trigger different actions, depending on the current
state of other parts of the interaction.
The procedure that follows describes merely how to add a button to a page.
Getting the button to work the way you want requires an understanding of
how an Action Manager works, the actions that are available, and what each
action does.
For information about
See
The Action Manager
“Action Manager CourseBuilder Interactions—
step-by-step procedures” on page 215
Actions and what they do
“Learning-specific actions” on page 227
Using the behavior actions that ship with
Dreamweaver
Deleting an existing action
“Cutting, copying, and pasting a segment,
condition, or action” on page 226
Adding a new action
179
To create a button:
1
Open the CourseBuilder Interaction dialog box.
2
Under Target, select 4.0 Browsers; then select Button from the Category list.
3
Select a button template. (The template icons represent the function of each
button, not its appearance.)
Toggle switch. See Toggle switches for information about how the
template works.
Push button. See Push buttons for information about how the template
works.
4
A thumbnail of the button appears in the upper right corner of the General tab.
To choose a different look, see Choosing a look for a button.
5
180
Chapter 8
Click OK.
What you can do
Turn off the highlight that appears
“Highlighting a button” on page 182
when a user positions the pointer over
the button
Change whether the button is selected “Changing the initial state of a button” on
or deselected, and enabled or disabled page 183
when it appears
Change from a toggle switch to a
“Changing the type of button” on page 183
push button or from a push button to
a toggle switch
Use custom graphics for a button
“Adding custom button graphics” on
page 184
clicks the button, or when some other into a layer” on page 166
event takes place
Assign the button a value as part
of a test
page 163
in the template
Place the button in a layer so you can
hide it, position it, or manipulate it in
some other way as a layer
Save a custom button as a template
181
Choosing a look for a button
CourseBuilder for Dreamweaver comes with several looks you can choose
from. You can also create your own button graphics (see Adding custom
button graphics).
To select a different look for a button:
1
2
Select the look you want from the Appearance pop-up menu.
If the image you want doesn’t appear on the list, click the Browse button to
locate the image file. (See Adding custom button graphics for information
about creating custom button graphics and where to put them.)
A preview of the image appears to the right of the Browse button.
Highlighting a button
The option to highlight a button when a user positions the pointer over it is
available only if a highlighted image exists.
To highlight a button when the pointer is over it:
1
2
Select the “Highlight on mouse over” option.
To have no highlight when the pointer is over a button:
1
2
182
Chapter 8
Deselect the “Highlight on mouse over” option.
Changing the initial state of a button
The initial state of buttons you create with the toggle switch and push button
templates is deselected and enabled.
To change the initial state of a button:
1
2
Select the settings you want from the Initial State pop-up menus:
Deselected
the button is in its off (toggle switch) or up (push button) state.
Selected
the button is in its on (toggle switch) or down (push button) state.
Enabled
the button responds if clicked.
the button can’t be clicked. (Use the Set Interaction Properties action
to enable a button during an interaction; see “Setting interaction properties” on
page 238.)
Disabled
Changing the type of button
1
2
Select the Type option you want:
Push
creates a push button.
Toggle
creates a toggle switch.
183
Adding custom button graphics
A button object must contain at least two GIF images: the default button and a
thumbnail. The thumbnail appears as a graphic preview in the CourseBuilder
Interaction dialog box. The thumbnail is displayed in a fixed area of 100 by 100
pixels and is resized to fill this area if the thumbnail is a different size.
You can include other graphics to represent the button in its various states, giving
the user a visual indication of what state the button is in and what action results
from clicking it. (If you don’t include a highlighted image, you can’t select the
“Highlight on mouse over” option.)
Don’t confuse the button graphics with the icons that represent the button
templates in the Gallery. See “Managing CourseBuilder Interaction templates” on
page 169 for information on adding images associated with object templates.
To create a custom button:
1
Use a graphics tool to create a GIF image for the default button and any
additional graphics to represent the button in its various states.
2
Name the GIFs representing various button states as follows (appearancename is
the label used in the Appearance pop-up menu):
appearancename.gif
The default button graphic, showing the button as
enabled and deselected.
appearancename_tnail.gif
The 100 by 100 pixel thumbnail button graphic,
displayed as a preview on the General tab.
appearancename_hlt.gif
The button graphic representing a highlighted button
(how the button appears when the pointer is over it).
appearancename_sel.gif
The button graphic representing a selected button (how
the button appears when “pushed down”).
appearancename_dis.gif
The button graphic representing a disabled button.
appearancename_sel_hlt.gif
The button graphic representing a toggle button when
it’s both selected (“pushed down”) and highlighted
(when the pointer is over it).
appearancename_sel_dis.gif
The button graphic representing a button when it’s both
selected (“pushed down”) and disabled.
3
Save all of the button object GIFs in the following directory:
\Dreamweaver\CourseBuilder\SupportFiles\Images\Buttons\
Before you use custom graphics in a CourseBuilder Interactions document, use
the Copy Support Files command to copy the custom graphics to the folder where
the CourseBuilder Interactions document is located. See “Copying support files”
on page 68.
184
Chapter 8
Timer CourseBuilder Interaction
A timer shows time passing as users complete an interaction.
You can use the timer to keep users focused, motivate them (for example, by
adding or removing scoring points as users progress through an interaction), or
monitor their progress and notify them of whether they’ve achieved certain tasks
within a time limit. Often, time is integral to whether a user has mastered a
subject. For example, a paramedic must be able to identify the correct procedures
for triage without trying to recall them from class or a textbook.
The timer templates
Choose from two timer CourseBuilder Interaction templates. The template icons
represent the function of each timer, not its appearance. To choose the way a timer
looks, see Choosing a look for a timer. Or use graphics you’ve created yourself (see
Adding custom timer graphics).
Timer_Forward1Trig timer. Gives users feedback after 30 seconds.
For details about how the template works, see Timers.
For information about using the template, see Creating a timer.
Timer_Forward2Trigs timer with warning. Gives users feedback after 15 and
30 seconds.
For details about how the template works, see Timers with a warning.
For information about using the template, see Creating a timer with a
warning.
185
The timer CourseBuilder Interaction tabs
General tab
on this tab.
Interaction Name
is the name of the image files used for the timer graphic. See
“Choosing a look for a timer” on page 196.
Appearance
Duration
is the total time on the timer. See “Setting a timer” on page 195.
reverses the order in which the timer images are
displayed (for example, the timer may appear to count down). See “Choosing a
look for a timer” on page 196.
Display images in reverse order
page 163.
Judge Interaction
Correct When
Knowledge Track
Tries Are
Time Is
Reset
places the entire interaction in a layer. See “Inserting a CourseBuilder
Layer
Tracking tab
the General tab.
186
Chapter 8
Triggers tab
See “Triggers options” on page 293 for detailed information about the options
on this tab.
lists all of the triggers in the CourseBuilder Interaction. Use the buttons
to add and delete triggers. See “Adding and deleting triggers” on page 197.
Triggers
Name
is the name of the selected trigger. See “Naming a trigger” on page 196.
Trigger One After __ seconds sets the point at which the timer is triggered. See
“Setting a trigger” on page 195.
determines whether a user’s response is considered right or wrong
if the timer reaches the current trigger. See “Marking a response right or wrong”
on page 254.
Trigger Is
Score
is the value assigned to the trigger. See “Scoring a response” on page 255.
determines whether a user’s
response is considered right or wrong if the timer doesn’t reach the first trigger. See
“Judging a response before the first trigger is reached” on page 198.
Interaction Is __ before timer reaches first trigger
Action Manager tab
define how a CourseBuilder Interaction behaves if the timer reaches a trigger
you’ve set on the Triggers tab (see “Timer segment” on page 301 and “Timer with
warning segment” on page 302).
Timer CourseBuilder Interactions—step-bystep procedures
What you can do
Create a timer
“Creating a timer” on page 190
Create a timer with a warning
“Creating a timer with a warning” on
page 193
Set the total time on a timer
“Setting a timer” on page 195
Give a descriptive name to a trigger
“Naming a trigger” on page 196
Add or delete a trigger
“Adding and deleting triggers” on page 197
Set a trigger on a timer
“Setting a trigger” on page 195
187
What you can do
Judge the interaction when the timer “Inserting a CourseBuilder Interaction
reaches a trigger value, or when some into a layer” on page 166
other event takes place
Set whether a user’s response is right
or wrong depending on whether
the timer has or hasn’t reached a
trigger value
“Judging a response before the first trigger
is reached” on page 198
Assign the timer a value as part
of a test
Select a different image for the timer
“Choosing a look for a timer” on page 196
“Adding custom timer graphics” on page 198
Display a timer’s images in reverse
order (for example, to make the timer
appear to be counting down)
Use custom graphics for a timer
“Timer segment” on page 301
“Timer with warning segment” on page 302
Interaction
page 158
Cut, copy, paste, and clear an entire
page 158
the user
188
Chapter 8
Place the timer in a layer so you can
some other way
Set a new default time limit for the
timer templates
“Setting preferences” on page 167
Save a custom timer as a template
Timers
The timer template gives users feedback after 30 seconds (see the Duration option
on the General tab and the Trigger Once After option on the Triggers tab).
The template places the image of an hourglass on the page (see the Appearance
option on the General tab).
Both the trigger when the timer runs out of time and the period leading up to it
are unjudged (see the Trigger Is and the “Interaction Is __ before timer reaches
first trigger” options on the “Triggers options” on page 293).
The CourseBuilder Interaction executes the Action Manager only if the timer
reaches the trigger (see the Judge Interaction option on the General tab). If the
timer reaches the trigger, the Action Manager displays a message in a pop-up
window (see the Trigger1 Feedback segment on the Action Manager tab; see
“Timer segment” on page 301 for details).
The CourseBuilder Interaction has a Reset button that lets the user restart the
timer either while it’s running or after it’s run out of time (see the Reset option on
the General tab).
For a step-by-step guide to using this template, see “Creating a timer” on
page 190.
For detailed information about all the options on the tabs, see:
“Triggers options” on page 293
189
Creating a timer
Timers work only in version 4 and later browsers. (You can also use them in
Netscape Navigator 3 if the timer image contains no transparent pixels.)
For an overview of the template, see “The timer templates” on page 185.
To create a simple timer:
1
2
Under Target, select 4.0 Browsers; then select Timer from the Category list.
3
Select the timer template icon. (The template icon represents the function of
the timer, not its appearance.)
For detailed information about all of the options on the tabs, see:
4
Click the General tab. Use the Duration option to set the amount of time
on the timer.
A thumbnail of the timer appears in the upper right corner of the General tab.
To choose a different look, see “Choosing a look for a timer” on page 196.
190
Chapter 8
5
Click the Triggers tab. Change the Trigger Once After setting to match the
Duration setting.
6
Click OK.
What you can do
Give a trigger a descriptive name
Add triggers to the timer
Delete triggers from the timer
when the timer reaches a target, or
judge it when some other action
occurs
Judge a user’s response as right
or wrong when the timer reaches
a trigger
page 254
Set whether a user’s response is
right or wrong depending on whether is reached” on page 198
trigger value
Assign a trigger a value as part
of a test
Track the results of the timer
interaction in a computer-managed
in the template
Remove the button that allows users
to start the timer over
page 165
191
Timers with a warning
The timer with a warning template gives users feedback after 15 and 30 seconds
(see the Duration setting on the General tab and the Trigger Once After setting on
the Triggers tab).
The CourseBuilder Interaction displays a horizontal gradient bar as the timer ticks
off the seconds (see Appearance on the General tab).
The period leading up to the warning trigger at 15 seconds, the warning trigger
itself, and the final trigger at 30 seconds are all unjudged (the Trigger Is and the
“Interaction Is __ before timer reaches first trigger” options on the General tab).
The CourseBuilder Interaction executes the Action Manager only when the timer
reaches a trigger (see the Judge Interaction option on the General tab). When the
timer reaches a trigger, the Action Manager displays a message in a pop-up
window (see the Trigger1 Feedback and Trigger2 Feedback segments on the
Action Manager tab; see “Timer with warning segment” on page 302 for details).
The CourseBuilder Interaction has a Reset button that lets the user restart the
timer either while it’s running or after it’s run out of time (see the Reset option on
the General tab).
For a step-by-step guide to using this template, see Creating a timer with a
warning.
192
Chapter 8
Creating a timer with a warning
Timers work only in version 4 and later browsers. (You can also use them in
Netscape Navigator 3 if the timer image contains no transparent pixels.)
For an overview of the template, see “Timers with a warning” on page 192.
To create a timer with a warning:
1
2
Under Target, select 4.0 Browsers; then select Timer from the Category list.
3
Select the icon for the timer with a warning template. (The template icon
represents the function of the timer, not its appearance.)
4
To choose a different look, see “General options” on page 281
“Action Manager segments” on page 295.
5
Use the Duration option to set the amount of time on the timer.
6
Click the Triggers tab. In the Triggers list, select Trigger1 and set Trigger Once
After to the time you want the warning to appear.
7
In the Triggers list, select Trigger2 and set Trigger Once After to match the
Duration setting.
To change the messages that appear when the timer reaches the triggers, use the
Action Manager. See “Timer with warning segment” on page 302.
8
Click OK.
193
What you can do
Give a trigger a descriptive name
Add triggers to the timer
Delete triggers from the timer
when the timer reaches a target, or
judge it when some other action
occurs
Judge a user’s response as right
or wrong when the timer reaches
a trigger
page 254
Set whether a user’s response is
right or wrong depending on whether is reached” on page 198
trigger value
Assign a trigger a value as part
of a test
Track the results of the timer
interaction in a computer-managed
in the template
194
Chapter 8
to start the timer over
Setting a timer
To change the total time set on a timer:
1
2
In the Duration field, type the number of seconds you want the timer to run.
Setting a trigger
1
Open the CourseBuilder Interaction dialog box, then click the Triggers tab.
2
In the Triggers list, select the name of the trigger you want to set.
3
Set Trigger Once After to the time you want the trigger to occur.
4
If you want to judge a user’s response as correct or incorrect when the timer
reaches the trigger, set the Trigger Is option.
5
If you want to change the feedback that appears when the timer reaches the
trigger, use the Action Manager.
See “Customizing feedback” on page 159.
195
Choosing a look for a timer
CourseBuilder for Dreamweaver comes with several looks you can choose from.
You can also create your own timer graphics (see “Adding custom timer graphics”
on page 198).
You can have the CourseBuilder Interaction display the timer images in reverse
order (to create, for example, the effect of a timer counting down rather than up).
To select a different look for a timer:
1
2
locate the image file. (See “Adding custom timer graphics” on page 198 for
information about creating custom timer graphics and where to put them.)
To display the timer images in reverse order, select the “Display images in reverse
order” option.
Naming a trigger
The templates assign default names (Trigger1, Trigger2, and so on) to each trigger.
Giving a trigger a more descriptive name (such as “Warning”) makes it easier
to work with. The name you give a trigger appears only in the CourseBuilder
To change the name of a trigger:
1
196
Chapter 8
2
In the Triggers list at the top of the tab, select the name of the trigger you want
to change.
3
Adding and deleting triggers
Go to the Triggers tab:
To delete a trigger:
In the Triggers list at the top of the tab, select the name of the trigger you want to
delete; then click Delete.
To add a trigger:
1
In the Triggers list at the top of the tab, select the name of the trigger whose
2
Click Add.
CourseBuilder for Dreamweaver duplicates the trigger.
3
Name the trigger.
See “Naming a trigger” on page 196.
4
See “Timer CourseBuilder Interaction” on page 185.
197
Judging a response before the first trigger
is reached
If a user responds to an interaction before the timer reaches the first trigger, you
may want to mark the response as right or wrong. If you want to assign a score to
such a response, create a trigger that happens as soon as the timer starts and assign
it the score for the response.
To judge a response before a trigger is reached:
1
2
Choose a setting for the “Interaction Is __ before timer reaches first
timer” option.
To assign a score to a response before a timer is reached:
1
In the Triggers list at the top of the tab, select the first trigger; then click Add.
2
Type a name for the new trigger in the Name field.
3
Set Trigger Once After to 1 second.
4
Set Trigger Is to Correct or Incorrect.
5
Enter the value you want in the Score field.
Adding custom timer graphics
Each timer object is made up of a series of GIF images. What the user sees as a
single timer is actually a series of graphics, each representing a different point in
time, displayed one after the other to give the illusion of elapsing time.
In addition to the timer images, a timer object includes a thumbnail. The
thumbnail appears as a graphic preview in the CourseBuilder Interaction dialog
box. The thumbnail is displayed in a fixed area of 100 by 100 pixels and is resized
to fill this area if the thumbnail is a different size.
Don’t confuse the timer graphics with the GIFs that represent the CourseBuilder
Interaction template files in the Gallery. See “Managing CourseBuilder
Interaction templates” on page 169 for information on adding images associated
with object templates.
198
Chapter 8
To create a custom timer:
1
Use a graphics tool to create the GIF images that represent the timer.
For example, if your timer counts for 30 seconds, the object can include 30
GIFs (each representing one elapsed second), 15 GIFs (each representing two
elapsed seconds), or any other number of GIFs representing equal divisions of
the time interval.
2
Name the GIF images in numerical order.
The GIF images replace each other in order. For example, gradient_01.gif is
swapped for gradient_02.gif, which is then swapped for gradient_03.gif, and so
on, until the time limit is reached and all GIFs have been displayed.
Use the following file name format:
appearancename_##.gif
Appearancename
##
is the label used on the Appearance pop-up menu.
designates the position the graphic occupies in the swap order.
For example, the file name gradient_01.gif would be the first graphic displayed
for a timer object listed on the Appearance pop-up menu as gradient.
3
Save the timer GIFs in the directory:
\Dreamweaver\CourseBuilder\SupportFiles\Images\Timers\
4
Create a 100 by 100 pixel GIF for the thumbnail and name it
appearancename_tnail.gif.
is the same root name used for the thumbnail’s
corresponding timer graphics.
Appearancename
5
Save the thumbnail graphic in the same directory as the other timer
object graphics:
\Dreamweaver\CourseBuilder\SupportFiles\Images\Timers\
on page 68.
199
Slider CourseBuilder Interaction
A slider gives users a way to select a choice or range of choices on a linear
scale of values.
You can use a slider to represent a control, such as a dimmer switch in a home or
an airplane’s flap lever. You can set up a slider to select a broad range—for
example, a temperature or pH range—or a discrete value—for example, a page,
topic, chapter, or exercise.
The slider templates
Choose either of two slider templates. The template icons represent the
function of each slider, not its appearance. To choose the way a slider looks, see
“Choosing a look for a slider” on page 210. Or use graphics you’ve created
yourself (see “Adding custom slider graphics” on page 213).
Slider_2Ranges range slider. Has an overall range of 0 to 100, and two
active ranges: one from 0 to 49, the other from 50 to 100.
For details about how the template works, see Range sliders.
For information about using the template, see Creating a range slider.
Slider_Correct Range point slider. Has an overall range of 0 to 100, and
three active ranges: the first from 0 to 48, the second from 49 to 51, and the
third from 52 to 100.
For details about how the template works, see Point sliders.
For information about using the template, see Creating a point slider.
200
Chapter 8
The slider CourseBuilder Interaction tabs
General tab
on this tab.
Interaction Name
is the name of the image files used for the slider graphic. See
“Choosing a look for a slider” on page 210.
Appearance
Range defines the upper and lower limits of the slider. See “Setting a slider’s start
and end values” on page 210.
Initial Value sets the initial position of the slider thumb. See “Setting a slider’s start
and end values” on page 210.
page 163.
Judge Interaction
Correct When
Knowledge Track
Tries Are
Time Is
Reset
places the slider in a layer. See “Inserting a CourseBuilder Interaction
into a layer” on page 166.
Layer
Tracking tab
the General tab.
201
Ranges tab
See Ranges options for detailed information about the options on this tab.
Ranges lists all of the active ranges on the slider. Use the buttons to add and delete
ranges. See “Adding and deleting ranges” on page 212.
Name
is the name of the selected range. See “Naming a range” on page 211.
Range
defines the limits of the current range. See “Setting a range” on page 211.
determines whether a range is right or wrong. See “Marking a response
right or wrong” on page 254.
Choice Is
Score
is the value assigned to a range. See “Scoring a response” on page 255.
Action Manager tab
If a user drags the slider thumb to an active range on the slider (see “Range
slider segment” on page 302 and “Point slider segment” on page 303)
Slider CourseBuilder Interactions—
202
Chapter 8
What you can do
Create a slider with ranges
“Creating a range slider” on page 205
Create a slider with a discrete point
“Creating a point slider” on page 208
Set the overall range of a slider
“Setting a slider’s start and end values” on
page 210
Set a range on a slider
“Setting a range” on page 211
Give a range a descriptive name
“Naming a range” on page 211
Add or delete a range
“Adding and deleting ranges” on page 212
What you can do
when a user releases the slider thumb is judged” on page 163
or clicks a Submit button, or when
some other event takes place
Assign a range a value as part of a test “Scoring a response” on page 255
Select a different image for a slider
“Choosing a look for a slider” on page 210
Use custom graphics for a slider
“Adding custom slider graphics” on page 213
“Range slider segment” on page 302
“Point slider segment” on page 303
different name
on page 164
Interaction
page 158
Cut, copy, paste, and clear an entire
page 158
the user
respond correctly
page 163
Place a slider interaction in a layer so
you can hide it, position it, or
Save a custom slider as a template
203
Range sliders
The range slider template places an image of a slider on the page. The slider has an
overall range of 0 to 100 (see the Range option on the General tab). There are two
active ranges providing feedback: one from 0 to 49, the other from 50 to 100 (see
the Ranges tab).
Both ranges are not judged (see the Range Is option on the Ranges tab).
The CourseBuilder Interaction executes the Action Manager when the user
releases the slider thumb (see the Judge Interaction option on the General tab).
The feedback for each of the ranges is different (see the Range1 Feedback and the
Range2 Feedback segments on the Action Manager tab; see “Range slider
segment” on page 302 for details).
The CourseBuilder Interaction has a Reset button that lets the user reset the slider
after releasing the slider thumb (see the Reset option on the General tab).
For a step-by-step guide to using this template, see “Creating a range slider” on
page 205.
“Ranges options” on page 294
204
Chapter 8
Creating a range slider
Sliders work only in version 4 and later browsers.
For an overview of the template, see “Range sliders” on page 204.
To create a range slider:
1
2
Under Target, select 4.0 Browsers; then select Slider from the Category list.
3
Select the range slider template icon. (The template icon represents the
function of the slider, not its appearance.)
4
Click the General tab. Set the slider’s start and end values in the Range fields.
5
Set the initial position of the slider thumb in the Initial field.
To choose a different look, see “Choosing a look for a slider” on page 210.
6
Click the Ranges tab. In the Ranges list, select Range1 and set the start and end
values of the range in the Range fields. Do the same for Range2.
To change the messages that appear when the slider’s thumb is in a given range,
use the Action Manager. See “Range slider segment” on page 302.
7
Click OK.
205
What you can do
Add a range to the slider
Delete a range from the slider
when the user releases the slider
thumb or clicks a Submit button,
or judge it when some other action
occurs
Judge the range a user chooses as
right or wrong
page 254
respond correctly
page 163
in the template
206
Chapter 8
to reset the slider
page 165
Place the slider interaction in a layer
a layer
different name
on page 164
Point sliders
The point slider template places an image of a vertical gray slider on the page. The
slider has an overall range of 0 to 100 (see the Range option on the General tab).
There are three active ranges providing feedback: the first from 0 to 48, the second
from 49 to 51, and the third from 52 to 100 (see the Range option on the Ranges
tab). The “point” thus actually covers three units, from 49 to 51.
Only the single-point range (from 49 to 51) is correct; the other two ranges are
incorrect. (See the Range Is option on the Ranges tab).
The CourseBuilder Interaction executes the Action Manager when the user
releases the slider thumb (see the Judge Interaction option on the General tab).
The feedback for each of the ranges is different (see the Range1 Feedback, the
Range3 Feedback, and the Correctness segments on the Action Manager tab;
see “Point slider segment” on page 303 and “Correctness segment” on page 296
for details).
The CourseBuilder Interaction has a Reset button that lets the user reset the slider
after releasing the slider thumb (see the Reset option on the General tab).
For a step-by-step guide to using this template, see “Creating a point slider” on
page 208.
For detailed information about all the options on the tabs, see:
207
Creating a point slider
Sliders work only in version 4 and later browsers. (You can also use them in
Netscape Navigator 3 if the slider images contain no transparent pixels.)
For an overview of the template, see “Point sliders” on page 207.
To create a timer with a warning:
1
2
Under Target, select 4.0 Browsers; then select Slider from the Category list.
3
Select the point slider template icon. (The template icon represents the
function of the slider, not its appearance.)
4
Click the General tab. Set the slider’s start and end values in the Range fields.
5
Set the initial position of the slider thumb in the Initial field.
To choose a different look, see “Choosing a look for a slider” on page 210.
6
Click the Ranges tab. In the Ranges list, select Range1 and set the start and end
values of the range in the Range fields. Do the same for Range2 and Range3.
Remember that Range2 is correct; Range1 and Range3 are incorrect.
To change the messages that appear when the slider’s thumb is in a given range,
use the Action Manager. See “Point slider segment” on page 303 and
“Correctness segment” on page 296.
7
208
Chapter 8
Click OK.
What you can do
Add a range to the slider
Delete a range from the slider
when the user releases the slider
thumb or clicks a submit button,
or judge it when some other action
occurs
Judge the range a user chooses as
right or wrong
page 254
respond correctly
page 163
in the template
to reset the slider
page 165
Place the slider interaction in a layer
a layer
different name
on page 164
209
Choosing a look for a slider
CourseBuilder for Dreamweaver comes with several looks you can choose from.
You can also create your own slider graphics (see “Adding custom slider graphics”
on page 213).
To select a different look for a slider:
1
2
Each look is designed to operate either horizontally or vertically, indicated by
hor or vert in the file name.
locate the image file. (See “Adding custom slider graphics” on page 213 for
information about creating custom slider graphics and where to put them.)
Setting a slider’s start and end values
A slider’s start and end values determine the overall range that appears on
the slider. The default settings are 0 and 100. The slider’s thumb, by default,
appears at 0.
To set the overall range of a slider:
1
2
In the Range fields, type the slider’s start and end values.
Enter decimal numbers to display decimal values on the slider (for example, 1.0
to 2.5). The range can be low to high (1 to 10) or high to low (10 to 1). Enter
both negative and positive numbers (-10 to 10). Positive numbers may be ten
digits long; negative numbers, nine digits.
To set the initial position of the slider’s thumb, type the value that corresponds to
the position in the Initial field. The value can be no less than nor greater than the
values in the Range fields.
210
Chapter 8
Setting a range
1
Open the CourseBuilder Interaction dialog box, then click the Ranges tab.
2
In the Ranges list, select the name of the range you want to set.
3
In the Range fields, type the start and end values of the range.
4
If you want to judge a user’s response as correct or incorrect when the slider’s
thumb is in the range, set the Range Is option.
See “Marking a response right or wrong” on page 254. If you want to assign
a correct or incorrect answer a value as part of a test, see “Scoring a response”
on page 255.
5
If you want to change the feedback that appears when the slider’s thumb is in
the range, use the Action Manager.
See “Customizing feedback” on page 159.
Naming a range
The templates assign default names (Range1, Range2, and so on) to each range.
Giving a range a more descriptive name makes it easier to work with. The name
you give a range appears only in the CourseBuilder Interaction dialog box.
To change the name of a range:
1
Open the CourseBuilder Interaction dialog box, then click the Ranges tab.
2
In the Ranges list at the top of the tab, select the name of the range you want
to change.
3
211
Adding and deleting ranges
Go to the Ranges tab:
1
Open the CourseBuilder Interaction dialog box,
2
Then, click the Ranges tab.
See Editing CourseBuilder Interactions if you need help.
To delete a range:
1
In the Ranges list at the top of the tab, select the name of the range you want
to delete.
2
Then, click Delete.
To add a range:
1
In the Range list at the top of the tab, select the name of the range whose
2
Click Add.
CourseBuilder for Dreamweaver duplicates the range.
3
Name the range.
See “Naming a range” on page 211.
4
See “Slider CourseBuilder Interactions— step-by-step procedures” on
page 202.
212
Chapter 8
Adding custom slider graphics
Each slider contains two GIF images: one each for the thumb and the track. A
slider also includes a thumbnail. The thumbnail appears as a graphic preview in
the CourseBuilder Interaction dialog box. The thumbnail is displayed in a fixed
area of 100 by 100 pixels and is resized to fill this area if the thumbnail is a
different size.
Don’t confuse the slider graphics with the GIFs that represent the CourseBuilder
Interaction template files in the Gallery. See “Managing CourseBuilder
Interaction templates” on page 169 for information on adding images associated
with object templates.
To create a custom slider:
1
Create or select the three GIF images for the slider thumb and track.
2
Name the GIFs, using the following file name format:
appearancename_[hor/ver]_[thm/trk].gif
Appearancename
Hor
is the label used in the Appearance pop-up menu.
or ver indicates that the slider is horizontal or vertical.
Thm
(thumb) and trk (track) designate the function of the graphic.
For example, the file name modern_ver_thm.gif is the thumb of a vertical slider
whose appearance is modern.
3
Save the GIF images in the following directory:
\Dreamweaver\CourseBuilder\SupportFiles\Images\Sliders\
4
Create a 100 by 100 pixel GIF for the thumbnail and name it:
appearancename_tnail.gif
is the same root name used for the thumbnail’s
corresponding slider graphics.
Appearancename
5
Save the thumbnail graphic in the same directory as the other slider
object graphics:
\Dreamweaver\CourseBuilder\SupportFiles\Images\Sliders\
on page 68.
213
214
Chapter 8
9
CHAPTER 9
Action Manager
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Action Manager CourseBuilder Interactions
The Action Manager tab lists all of the conditions and actions that apply to a
CourseBuilder Interaction. These conditions and actions, organized into
segments, define how a CourseBuilder Interaction interacts with the user at run
time. Use the Action Manager tab to create new segments, define new conditions,
and set the properties of actions in the list.
See also:
“Action Manager CourseBuilder Interactions—step-by-step procedures” on
page 215
Action Manager CourseBuilder Interactions—
What you can do
Add a segment, condition, or action
Track changes in the state of an
interaction
Edit a segment, condition, or action
“Editing a segment, condition, or action” on
page 225
Cut, copy, or paste a segment,
condition, or action
“Cutting, copying, and pasting a segment,
condition, or action” on page 226
215
What you can do
Rename a segment, condition,
or action
“Renaming a segment, condition, or action”
on page 224
Create expressions for a condition
“Creating expressions for a condition” on
page 221
Change the level of a condition
“Promoting and demoting a condition” on
page 225
Show or hide parts of the Action
Manager list
“Expanding and collapsing a segment
or condition” on page 225
Enable the Knowledge Track options
“Knowledge Track actions” on page 234
Send information about an interaction “Send Score” on page 238
to a CMI application, such as Pathware “Send Lesson Status” on page 236
“Send Lesson Time” on page 237
“Send Objective Info” on page 237
“Send Interaction Info” on page 235
Set up a Judge Interaction action
“Judge Interaction” on page 227
Set interaction and element properties “Setting interaction properties” on page 238
Reset an interaction or its elements
“Reset Interaction” on page 228
Replace the contents of a frame, layer, “Set Text of Frame” on page 231
or text field
“Set Text of Layer” on page 232
“Set Text of Text Field” on page 233
Display a JavaScript dialog box
“Popup Message” on page 230
Set an Action Manager property
“Setting Action Manager properties” on
page 247
Set the JavaScript property
“Setting the JavaScript property” on page 248
Edit the order of items on the Action “Action Manager pop-up menu” on page 217
Manager pop-up menu to make items
you use often more accessible
Add a custom behavior
216
Chapter 9
“Adding a custom behavior” on page 249
Action Manager pop-up menu
The items in the Action Manager pop-up menu are grouped into six categories,
divided by dashed lines. You can edit the order of the items in the menu and the
names of the segments in the ActionMenu.htm file. For example, you can move
the items you use most often to the top of the list.
The first category contains the built-in Action Manager items. This is the
one section in the list that you cannot change and is not part of the
ActionMenu.htm file.
Segment
Condition
Else
Stop
The second category contains CourseBuilder actions.
Judge Interaction
Reset Interaction
Set Interaction Properties
The third category contains behaviors that ship with Dreamweaver.
Call JavaScript
Change Property
Check Browser
Check Plugin
Control Shockwave or Flash
Control Sound
Drag Layer
Display Status Message
Go To URL
Open Browser Window
Popup Message
Preload Images
Show-Hide Layers
Swap Image
Swap Image Restore
Validate Form
Action Manager
217
The fourth category contains feedback actions.
Set Text of Frame
Set Text of Layer
Set Text of Status Bar
Set Text of Text Field
The fifth category contains Timeline actions
Go To Timeline Frame
Play Timeline
Stop Timeline
The sixth category contains the Knowledge Track actions.
Send Interaction Info
Send Lesson Status
Send Lesson Time
Send Objective Info
Send Score
Any items not defined in ActionMenu.htm appear in the final category.
To rearrange the Action Manager pop-up menu items:
1
Open the file ActionMenu.htm located in
Dreamweaver\CourseBuilder\Config.
2
Edit the items to reflect the naming and order you prefer.
3
Save your changes to the file.
Adding a segment
Conditions and actions in a CourseBuilder Interaction are grouped into segments.
In addition to providing an organizational framework for the conditions and
actions in a CourseBuilder Interaction, a segment defines when the conditions
and actions it contains are evaluated during the CourseBuilder Interaction
execution. Some segments are pre-set for a CourseBuilder Interaction, based on
the CourseBuilder Interaction template you are using; you can edit these segments
or add new ones to the interaction, as needed.
Use the Edit button to change the name of a segment and define when the
conditions it contains are evaluated.
218
Chapter 9
To create a new segment:
1
Manager tab.
2
Select the segment, condition, or action the new segment will follow.
If the new segment is to appear first in the list, click the first segment in the list
and use the up arrow to reposition the segment after you’ve created it.
3
Choose Segment from the pop-up menu and click Add.
The Segment Editor opens.
4
In the Segment Name field, type a unique name for the segment.
5
Select a Segment Evaluation option, then click OK.
The Segment Evaluation options work like this:
When the Action Manager judges a CourseBuilder Interaction, it always evaluates
segments set to Always evaluate from the beginning starting with the first line in
the segment.
The first time the Action Manager encounters a segment set to State transition,
it starts evaluating the conditions in the segment from the first line in the
segment. Upon encountering a condition that is not met, the Action Manager
skips to the next segment. The next time the Action Manager judges the
CourseBuilder Interaction, it skips any conditions in the segment that have
previously been met and then resumes checking the remaining conditions in that
segment from that point forward.
Adding a condition
Conditions in a CourseBuilder Interaction define when the object provides
feedback during an interaction—when an expression is true, the condition is met
and any actions within the condition are executed. Most of the CourseBuilder
Interaction templates contain pre-set conditions. Based on the type of template
you are using, you will see a variety of preconfigured conditions. You can edit,
delete, or add conditions as needed.
Action Manager
219
The Action Manager evaluates conditions in the order they appear, from top to
bottom; the order in which you list conditions therefore determines the order
in which the Action Manager executes the actions at run time. You can always
move a condition up or down in the list by selecting it and clicking the Up or
Down arrows.
Use the Condition Editor to create custom conditions and edit existing
conditions. The content of the Condition Editor varies, depending on the
nature of the items you are comparing to each other in the condition.
To create a new condition:
1
Manager tab.
2
Select the segment, condition, or action the new condition will follow.
3
Choose Condition from the pop-up menu and click Add.
The Condition Editor opens. The Condition Editor options change,
depending on your selections in each field.
4
In the Condition Name field, type a name for the condition.
If you don’t specify a name, CourseBuilder for Dreamweaver will name it using
the expression as the name.
5
Define the expressions that determine if the condition is met.
For more information on defining expressions, see “Creating expressions for a
condition” on page 221.
6
220
Chapter 9
Click OK.
Creating expressions for a condition
An expression is a logical statement that compares a property of an interaction or
object with another object, interaction, or value. All expressions are formatted as
“x comparison y”.
Conditions can contain more than one expression. You can string expressions
together to make a condition more specific—for instance, you can create a single
condition that checks whether the user clicked an object and, at the same time,
makes sure that the user has enough tries remaining when clicking that choice.
Near the top of the Condition Editor is an Expressions list. The Expressions list
displays statements that must be true for the condition to be met.
All of the fields underneath the Expressions list define pieces of an expression.The
fields above the “equals/does not equal” pop-up menu define the first half of an
expression, while the fields below the pop-up menu define how the first half of the
expression must be evaluated.
Action Manager
221
To create an expression:
1
In the Type field, select what type of object is being compared.
The available types include Interaction, Action Manager, Document Tag, or
JavaScript. See “Type field settings” on page 223.
2
If you’ve selected Document Tag as the type, you’ll next choose the name of the
object you want to compare. If you’ve selected one of the other types, you’ll
next choose the name of the CourseBuilder Interaction you want to compare.
3
In the Property pop-up menu, select the property that the expression compares
for the object.
4
In the “equals/does not equal” pop-up menu, select the type of comparison the
expression makes.
The choices available in this pop-up menu change based on your selections in
the Type and Property pop-up menus.
5
Select the type for the second half of the expression.
As in the first part of the expression, the types you can select from vary with the
object. They include Interaction, Action Manager, Document Tag, JavaScript,
Select, True/False, Number, and Text. See “Type field settings” on page 223.
6
Based on the type you’ve selected for the second half of the expression, choose
the object, interaction, property, or value that the expression compares.
If you are joining two or more expressions together, use the And/Or pop-up
menu in the lower right corner. Select And if both expressions must be true.
Select Or if either expression can be true.
7
222
Chapter 9
Click OK.
Type field settings
The Type field settings in the Condition Editor work like this:
compares interactive elements of a CourseBuilder Interaction. The
first of the two Interaction pop-up menus determines the interaction, and the
second pop-up menu specifies which element in that interaction (a drag item or
drop target, a hot area, a choice in a multiple-choice interaction, and so forth) the
expression evaluates.
Interaction
compares entire segments of a CourseBuilder Interaction. The
first of the two Interaction pop-up menus determines the interaction, and the
second pop-up menu specifies which segment in that interaction to evaluate.
Action Manager
compares a tag in the HTML source code for the page. The
first of the two Interaction pop-up menus determines the type of HTML tag in
the condition, and the second pop-up menu specifies the specific HTML tag
to evaluate.
Document Tag
provides a field in which to type your custom JavaScript code
or condition.
JavaScript
determines whether the interaction, segment, or HTML tag in the first
half of the expression is true (met) or false (unmet).
True/False
compares the property in the first half of the expression with the value
you enter in the Number field.
Number
compares the property in the first half of the expression with the string you
enter in the Text field.
Text
Select compares the property in the first half of the expression with a value of Not
Judged, Correct, or Incorrect.
Action Manager
223
Adding an action
Actions make things happen. When you add an action, you must define
specifically what it acts upon—a Control Sound action, for example, must have an
associated audio file, and a Go To URL action must have an associated URL to
take the user to.
To add a new action:
1
Open the CourseBuilder dialog box, then click the Action Manager tab.
2
Select the segment, condition, or action the new action will follow.
3
Choose the new action from the pop-up menu and click Add.
An editor window appears. The editor for each action varies, depending on the
properties of the action. See “Learning-specific actions” on page 227 for details,
or click the Help button in the editor window for more information on
each action.
4
Define the properties of the action.
5
Click OK.
Renaming a segment, condition, or action
1
Manager tab.
2
Select the segment, condition, or action in the Action Manager list.
3
Click the Rename button.
The Name Editor appears.
4
224
Chapter 9
Edit the name, then click OK.
Expanding and collapsing a segment
or condition
A segment, condition, or else statement that’s preceded by a plus sign (+) has
nested conditions or actions that are hidden. A segment, condition, or else
statement that’s preceded by a dash (--) is fully expanded.
To show the hidden statements in a collapsed segment, condition, or else
statement, select the statement or condition; then click the Expand button.
To hide the statements nested under a segment, condition, or else statement,
select the statement or condition; then click the Collapse button.
Promoting and demoting a condition
When adding a condition, it can stand alone or be part of another condition. It is
possible for one condition to be nested inside another, so that the first condition
must be true before the nested condition is evaluated. It is also possible for a
condition to be an else...if condition. As an else...if condition, if the first condition
is false the else...if condition is evaluated. If the first condition is true, the else...if
condition is not evaluated. Changing the relationship between conditions is called
promoting or demoting a condition.
To promote a condition, select the condition; then click the left arrow button.
To demote a condition, select the condition; then click the right arrow button.
Editing a segment, condition, or action
1
Manager tab.
2
Select the segment, condition, or action you want to edit; then click the
Edit button.
3
Edit the segment, condition, or action.
The options in the editor windows vary:
Segment Editor window:
see “Adding a segment” on page 218.
Condition Editor window:
Action Editor windows:
4
see “Adding a condition” on page 219.
see “Learning-specific actions” on page 227.
Click OK.
Action Manager
225
Cutting, copying, and pasting a segment,
condition, or action
Use the Cut, Copy, and Paste buttons at the top of the Action Manager tab to cut,
copy, and paste a segment, condition, or action.
If you select a segment, CourseBuilder for Dreamweaver automatically includes
everything inside that segment when you cut, copy, or paste.
If you select a condition, CourseBuilder for Dreamweaver automatically includes
everything inside that condition—including nested conditions—when you cut,
copy, or paste.
Where to create actions
The actions you apply to CourseBuilder Interactions can be actions that ship with
Dreamweaver as well as the learning-specific actions that ship with CourseBuilder
for Dreamweaver. Use either the Dreamweaver Behavior inspector or the Action
Manager tab of the CourseBuilder Interaction dialog box to create actions for
CourseBuilder Interactions.
Whether you use the Behavior inspector or the Action Manager tab determines
when an action is called:
If you use the Behavior inspector to define actions, the actions exist entirely
outside the CourseBuilder Interaction—even if they apply to CourseBuilder
Interactions on the page. Actions are called from an event in HTML
or JavaScript.
If you use the Action Manager tab to define actions, the actions exist
entirely inside a CourseBuilder Interaction. Actions are called from the
Action Manager.
Use the Behavior inspector to execute actions on any event on an HTML
page, including some events that affect a specific CourseBuilder Interaction.
For example, you could set the Control Sound action to execute on the
onFocus event as soon as a user clicks inside the text entry field of a text entry
Use the Action Manager tab to execute actions that occur on specific events
defined within a CourseBuilder Interaction—when a specific drag item is dropped
on a specific target within a drag-and-drop CourseBuilder Interaction, for
example. The Action Manager tab can include both independent actions (which
occur whenever the object is judged, regardless of the state the object is in) and
condition-dependent actions (which occur only when certain conditions set for
the object are met). The Action Manager tab can also be used to set conditions
and actions for more than one interaction—or for an entire page; see “Action
Manager CourseBuilder Interactions—step-by-step procedures” on page 215.
226
Chapter 9
Learning-specific actions
A behavior is a combination of events and actions. When you create a behavior,
you specify an event that triggers an action. You can associate several actions with
a single event.
You can use the following learning-specific actions to expand the capabilities of
CourseBuilder for Dreamweaver: Judge Interaction, Reset Interaction, Set
Interaction Properties, Set Text of Frame, Set Text of Layer, Set Text of Text Field,
Send Interaction Info, Send Lesson Status, Send Lesson Time, Send Objective
Info, and Send Score.
Actions can be triggered in several ways:
When the user clicks a button
When the user clicks a choice
By an event in the Action Manager
By an event on a timeline
Judge Interaction
The Judge Interaction action evaluates the list of statements in the Action
Manager tab for the CourseBuilder Interaction and can execute actions based
on the results.
The Judge Interaction action allows you to choose which interaction or event
triggers the Action Manager, thereby channeling the flow of control.
To add a Judge Interaction action:
1
Attach a behavior to a CourseBuilder Interaction or add an action to the
Action Manager.
See “Adding an action” on page 224 in the Using CourseBuilder for
Dreamweaver book.
2
In the Judge Interaction dialog box, choose the CourseBuilder Interaction that
you want to judge from the Interaction pop-up menu.
You can set up the button to judge several CourseBuilder Interactions by
adding additional Judge Interaction actions and specifying each intended
interaction.
Action Manager
227
Reset Interaction
The Reset Interaction action clears user input during the interaction. This action
primarily controls the visual elements of the interaction. Use the Reset Interaction
action to reset elements of drag-and-drop interactions, as well as swapped layers.
This action can apply to:
The entire object interaction
Elements within an object interaction or individual drag-and-drop elements
Action Manager segments that track state transitions
Reset Interaction doesn’t reenable items that have been disabled. To reenable an
item, use the Set Interaction Properties action in the Action Manager.
Radio buttons are an exception to the Reset Interaction action: they aren’t cleared.
To add a Reset Interaction action:
1
In the CourseBuilder Interaction dialog box, click the General tab.
2
In the General tab, deselect “Create a Reset button for this Interaction.”
3
In the Action Manager tab, select the segment, condition, or action you want
the Reset Interaction action to follow.
4
Select Reset Interaction from the pop-up menu, and click Add.
5
In the Reset Interaction dialog box, select Entire Interaction from the Reset
pop-up menu.
6
In the Interaction pop-up menu, select the CourseBuilder Interaction you
want to reset.
To reset interaction elements:
Only the drag-and-drop CourseBuilder Interactions have elements that you can
reset individually.
228
Chapter 9
1
On the General tab, deselect “Create a Reset button for this Interaction.”
2
On the Action Manager tab, select the segment, condition, or action you want
3
4
In the Reset Interaction dialog box, in the Reset pop-up , select
“Elements only.”
5
From the Interaction pop-up menu, select the CourseBuilder Interaction that
contains the elements you want to reset.
6
Choose an element from the Element pop-up menu.
7
Click OK to close the Reset Interaction dialog box.
To reset the Action Manager:
You can reset the entire Action Manager or individual segments that track
state transitions.
1
On the Action Manager tab, select the segment, condition, or action you want
2
3
In the Reset Interaction dialog box, in the Reset pop-up menu, select “Action
Manager only.”
4
From the Interaction pop-up menu, select the CourseBuilder Interaction that
contains the Action Manager you want to reset.
5
Choose a segment from the Segment pop-up menu.
6
Click OK to close the Reset Interaction dialog box.
Set Interaction Properties
The Set Interaction Properties action is the key to fine-tuning your interaction,
allowing you to dynamically change properties you’ve already set in the
CourseBuilder Interaction dialog box. There are three types of properties:
Interaction, Action Manager, and JavaScript.
For information about each of the properties and how to use them, see “Setting
interaction properties” on page 238.
Action Manager
229
Popup Message
The Popup Message action displays a JavaScript alert dialog box with the message
you specify. Because JavaScript alert dialog boxes have only one button (OK), use
this action to provide information, not to present the user with a choice.
You can embed any valid JavaScript function call, property, global variable, or
other expression in the text. To embed a JavaScript expression, place it inside
braces ({}). To display a brace as part of the text, precede it with a backslash,
like this: \{.
Example
You got {G01.totalCorrect} out of {G01.possCorrect}.
Your score is {G01.score}!
The URL for this page is {window.location}, and today is {new Date()}.
For more information on CourseBuilder Interaction variables, see “JavaScript
variables for tracking performance” on page 265.
To add a Popup Message action:
230
Chapter 9
1
In the CourseBuilder document, select the CourseBuilder Interaction for
which you are creating the feedback.
2
In the CourseBuilder Interaction Property inspector, click Edit.
3
4
Select the segment, condition, or action that the Popup Message action
will follow.
5
Choose Popup Message from the Action Manager pop-up menu, then
click Add.
6
In the Popup Message dialog box, enter a message in the Message field; then
click OK.
Set Text of Frame
The Set Text of Frame action replaces the content and formatting of a frame with
the content you specify. The content can include any valid HTML. Use this
action to dynamically display information.
Although the Set Text of Frame action replaces the formatting of a frame, you
can select Preserve Background Color to preserve the page background and text
color attributes.
like this: \{.
Example
Create a frameset:
1
Do one of the following to create a frameset:
Choose Modify > Frameset > Split Frame Left, Right, Up, or Down.
In the Object palette, in the Frames panel, select a predefined frameset.
2
Name the frame so you can identify it as the frame to set text to.
To add a Set Text of Frame action:
1
2
3
4
Select the segment, condition, or action the Set Text of Frame action
will follow.
5
Choose Set Text of Frame from the Action Manager pop-up menu, then
click Add.
6
In the Set Text of Frame dialog box, in the Target pop-up menu, select the
target frame.
7
Click the Get Current HTML button to copy the frame HTML content
and formatting.
8
Enter a message in the New HTML field, then click OK.
Action Manager
231
Set Text of Layer
The Set Text of Layer action replaces the content and formatting of a layer with
the content you specify. The content can include any valid HTML.
Set Text of Layer replaces the content and formatting of the layer, but retains
layer attributes, including color. Format the content by including HTML tags in
the text field.
like this: \{.
Example
Create a layer:
1
Choose Insert > Layer.
For more information on creating layers, see “Creating layers” in the Using
Dreamweaver book.
2
Decide which layer to write to.
To add a Set Text of Layer action:
232
Chapter 9
1
2
3
4
Select the segment, condition, or action that the Set Text of Layer action
will follow.
5
Choose Set Text of Layer from the Action Manager pop-up menu, then
click Add.
6
In the Set Text of Layer dialog box, select the target layer from the Layer menu.
7
Enter a message in the New HTML field, then click OK.
Set Text of Text Field
The Set Text of Text Field action replaces the content of a form text field with the
content you specify. Use this action to dynamically display information.
like this: \{.
Example
Create a named text field:
1
Choose Insert > Form Object > Text Field.
For more information, see “Creating forms” in the Using Dreamweaver book.
2
Name the text field.
To add a Set Text of Text Field action:
1
2
3
4
Select the segment, condition, or action that the Set Text of Text Field action
will follow.
5
Choose Set Text of Text Field from the Action Manager pop-up menu, then
click Add.
6
In the Set Text of Text Field dialog box, in the Text Field pop-up menu, select
the text field you want the text to display in.
7
In the New Text field, type the text you want displayed, then click OK to close
the Set Text of Text Field dialog box.
Action Manager
233
Knowledge Track actions
The actions associated with Knowledge Track can be linked with an event in the
browser or a condition or command in the Action Manager. The following steps
are important to enable the Knowledge Track actions.
1
In the General tab of the CourseBuilder Interaction dialog box, select
Knowledge Track.
The Tracking tab appears to the right of the General tab.
2
Click the Tracking tab and define the interaction ID, objective ID, and weight
for the entire object interaction.
Interaction ID assigns a unique value to the interaction. This value can be
accessed through JavaScript or the CMI system.
assigns an objective ID to the CourseBuilder Interaction. Each
CourseBuilder Interaction can be tied to a specific learning objective as defined
by the content author.
Objective ID
defines the relative importance of the CourseBuilder Interaction’s
scoring within the overall group of interactions of which it is part. The CMI
server uses the weight to calculate a score for the entire course. When using
Pathware, Pathware ignores this setting and uses the weight setting from the
Pathmaker file.
Weight
Knowledge Track doesn’t record an actual score for individual object interactions.
Use the “Send Score” on page 238 action in the Action Manager to define how
objects (or groups of objects) are scored.
Selecting the Knowledge Track option sends the user response information to the
server—including correct responses defined for the object, the user’s actual
response and whether or not it was correct, and when and how long it took the
user to complete the interaction.
For more information about using Knowledge Track actions, see “Tracking user
performance” on page 251.
234
Chapter 9
Send Interaction Info passes information about a single CourseBuilder Interaction
to a CMI application. Send Interaction Info customizes the information sent by
the default tracking.
To add a Send Interaction Info action:
1
2
Select the statement that you want to trigger the Send Interaction Info action.
3
Select Send Interaction Info from the Action Manager pop-up menu, and
click Add.
The Send Interaction Info dialog box appears.
4
Type in optional Interaction and Objective IDs.
5
Choose an Interaction type from the Interaction Type pop-up menu.
6
Type the appropriate information in the following fields: List Correct
Responses, List Student Responses, List Results, Weight, and Latency.
7
Click OK.
Action Manager
235
Send Lesson Status
Send Lesson Status passes information about the status of a lesson, or group of
interactions, to a CMI application.
To add a Send Lesson Status action:
1
2
Select the statement that you want to trigger the Send Lesson Status action.
3
Select Send Lesson Status from the Action Manager pop-up menu, and
click Add.
4
In the Send Lesson Status dialog box, choose the lesson status from the Lesson
Status pop-up menu.
Choices in the Lesson Status pop-up menu are as follows:
Passed means the user has achieved whatever parameters have been established
as passing.
Completed
means the user has finished the activity.
means the has not achieved whatever parameters have been established
as passing.
Failed
Incomplete
means the user has started but not finished the activity.
means the user has accessed the pages but not necessarily completed
the activity.
Browsed
Not attempted
5
236
Chapter 9
Click OK.
means the user has not accessed the pages of the activity.
Send Lesson Time
Send Lesson Time passes information about how long the user took to complete a
lesson, or group of interactions, to a CMI application.
To add a Send Lesson Time action:
1
2
Select the statement that you want to trigger the Send Lesson Time action.
3
Select Send Lesson Time from the Action Manager pop-up menu, and
click Add.
4
In the Send Lesson Time dialog box, choose the CourseBuilder Interaction for
which you are sending the score from the Interaction pop-up list.
To override the lesson time that was previously associated with the element,
choose <custom> from the Interaction pop-up list and type a new lesson time
in the Lesson Time field.
5
Click OK.
Send Objective Info
Send Objective Info passes information about the object or lesson objective, as
defined in the Tracking tab of the CourseBuilder Interaction dialog box, to a CMI
application. See “Tracking tab” on page 287.
To add a Send Objective Info action:
1
2
Select the statement that you want to trigger the Send Objective Info action.
3
Select Send Objective Info from the Action Manager pop-up menu and
click Add.
4
In the Send Objective Info dialog box, choose the CourseBuilder Interaction
for which you are sending the objective ID from the Interaction pop-up menu.
To override the objective ID, score, and lesson status that you previously
associated with the element on the Tracking tab:
Choose <custom> from the Interaction pop-up menu and type a new objective
ID in the Objective ID field.
Type an objective score in the Score field.
Choose an objective lesson status from the Lesson Status pop-up menu.
5
Click OK to close the Send Objective Info dialog box.
Action Manager
237
Send Score
Send Score passes information about the user’s score for a single CourseBuilder
Interaction or for a lesson (a group of CourseBuilder Interactions) to a CMI
application.
To add a Send Score action:
1
2
Select the statement that you want to trigger the Send Score action.
3
Select Send Score from the Action Manager pop-up menu, and click Add.
4
In the Send Score dialog box, choose the CourseBuilder Interaction for which
you’re sending the score from the Interaction pop-up menu.
To override the score you previously associated with the element in the
CourseBuilder Interaction dialog box’s score field, choose <custom> from the
Interaction pop-up list and type a new score in the Score field.
5
Click OK.
Setting interaction properties
The Set Interaction Properties action is the key to fine-tuning your interaction,
allowing you to dynamically change properties you’ve already set in the
CourseBuilder Interaction dialog box. Using the Set Interaction Properties action,
you can override a previously set property to respond to a certain condition. For
example, use the Set Interaction Properties action with the Disabled property to
disable a question after the time limit expires.
You can set up the Set Interaction Properties action to be triggered:
When the user clicks a button
When the user clicks a choice
When playback reaches a specific frame on the timeline
By an event you specify in the Action Manager
There are three types of properties: Interaction, Action Manager, and JavaScript.
CourseBuilder Interaction properties can affect the entire interaction, such as
resetting the score, or they can affect a single element of the interaction, such as
resetting correctness. Action Manager properties affect the entire Action Manager
or specified segments. The JavaScript property allows you to write JavaScript
expressions—or just to examine the underlying JavaScript.
238
Chapter 9
Setting properties of CourseBuilder Interactions
To choose the CourseBuilder Interaction and the property you want to set:
1
Attach a behavior to an object or add an action to the Action Manager.
See the “Using Behaviors” in the Using Dreamweaver book, or “Adding an
action” in the Using Coursebuilder for Dreamweaver book.
2
In the Set Interaction Properties dialog box, from the Set pop-up menu,
choose Interaction.
3
From the Interaction pop-up menu, choose the CourseBuilder Interaction you
want to set a property for:
If you’re setting a property for the entire interaction, choose <none> from the
menu to the right.
If you’re setting a property for an element of the interaction, choose the
element from the menu to the right.
4
From the Property pop-up menu, choose the property you want to set.
See “CourseBuilder Interaction properties” on page 240.
Set the property:
To set a Boolean property using a constant:
Choose True/False from the Type pop-up menu; then choose True or False from
the Value pop-up menu.
To set a numeric property using a constant:
Choose Number from the Type pop-up menu; then enter a number in the
Number field.
To set a text property using a constant:
Choose Text from the Type pop-up menu; then enter a text string in the Text field.
To set a property using JavaScript:
Choose JavaScript from the Type pop-up menu; then enter an expression in the
JavaScript field.
To set the Correct State property:
Choose Select from the Type pop-up menu; then choose Not Judged, Correct, or
Incorrect from the Value pop-up menu.
Action Manager
239
CourseBuilder Interaction properties
You can apply many interaction properties either to an entire interaction or to an
individual element of an interaction. Some properties, however, apply only to
interaction elements. Properties limited to elements are noted below.
Alignment
Type
Description
Select list
Where, in relation to the target, the drag object snaps. Choose from: center,
left, right, top, bottom, or top left. Drag-and-drop CourseBuilder Interaction
element property only.
All That Apply
Type
Description
Boolean
TRUE. The
user needs to select all of the correct answers for the CourseBuilder
Interaction to be judged correct.
FALSE. The
user can select any correct answer for the CourseBuilder Interaction to
be judged correct.
The CourseBuilder Interaction must be reset or interacted with before the
Correctness property of the CourseBuilder Interaction will reflect this setting.
Allow Multiple Selections
Type
Description
Boolean
TRUE.
Can select multiple choices in the CourseBuilder Interaction.
FALSE.
Can only select one choice in a given try.
Allow Multiple Selections has no effect on radio buttons.
Correctness
Type
Description
240
Chapter 9
Select list
Choose correct, incorrect, or not judged to indicate how the Action Manager
evaluates a choice. Setting Correctness will not update Possible Correct or Total
Elements. You must update them manually and reset the CourseBuilder
Interaction. CourseBuilder Interaction element property only.
Correct State
Type
Description
Select list
Sets the correct state of the entire CourseBuilder Interaction, overriding
individual judging.
The Correct State property is reset every time the CourseBuilder Interaction is
touched, and so the set property is valid only with the current flow of action.
Disabled
Type
Description
Boolean
TRUE. The
choice designated is disabled.
FALSE. The
choice designated is enabled.
Expected Value
Type
Description
Select list, True/False, Text, Number
The Expected Value is compared to the Value property that a user enters to
determine if this choice is designated as selected. For example in a text entry
CourseBuilder Interaction, if the Expected Value is the text string “Red” and the
value that the user input is “Red,” then Selected is true. CourseBuilder Interaction
Initial Value
Type
Description
Select list, True/False, Text, Number
The Initial Value indicates what the choice value is set to before the user makes a
choice. If you change the value, you must reset the CourseBuilder Interaction
before the change is reflected in the element. CourseBuilder Interaction element
property only.
Is Toggle
Type
Description
Boolean
TRUE. The
button element works like a toggle switch.
FALSE. The
button element works like a push button.
Button CourseBuilder Interaction element property only.
Action Manager
241
Judge On Selection
Type
Description
Boolean
TRUE. Triggers
the Action Manager to evaluate the conditions when the item
is selected.
FALSE.
Allows some other event to trigger the evaluation of the conditions in the
Action Manager.
Knowledge Track
Type
Description
Boolean
TRUE.
Sends tracking information to a computer-managed instruction (CMI)
application. You must select the Knowledge Track option on the General tab in
the CourseBuilder Interaction dialog box for this to work.
FALSE.
Disables the sending of itemization data to the CMI application. Actions
that send progress data, such as Send Score, can still send data.
Known Response
Type
Description
Boolean
TRUE.
A response has been selected.
FALSE.
A response has not been selected.
The Known Response property is reset when the user selects a choice.
Match Case
Type
Description
Boolean
TRUE. The
text entry input must match the case of the expected answer to be
judged correct.
FALSE. The
text entry input doesn’t need to match the case of the expected answer
to be judged correct.
You must reset the CourseBuilder Interaction or the CourseBuilder Interaction
must be touched for this to take effect. Text entry CourseBuilder Interaction
242
Chapter 9
Match Entire Word
Type
Description
Boolean
TRUE. The
text entry input must match the entire word of the expected answer to
be judged correct.
FALSE. The
text entry input does not need to match the entire word of the
expected answer to be judged correct.
You must reset the CourseBuilder Interaction or the CourseBuilder Interaction
must be touched for this to take effect. Text entry CourseBuilder Interaction
Original X Position
Type
Description
Numeric
The original x-axis position of the drag element. This is the x position the drag
element is set to if it’s reset. Drag-and-drop CourseBuilder Interaction element
property only.
Original Y Position
Type
Description
Numeric
The original y-axis position of the drag element. This is the y position the drag
element is set to if it’s reset. Drag-and-drop CourseBuilder Interaction element
property only.
Possible Correct
Type
Description
Numeric
The number of possible correct choices for the CourseBuilder Interaction. If
you’ve set the All That Apply property to true, changing the Possible Correct
property affects whether a CourseBuilder Interaction is judged correct or
incorrect. You must reset the CourseBuilder Interaction or the CourseBuilder
Interaction must be touched for this to take effect.
Possible Incorrect
Type
Description
Numeric
The number of possible incorrect choices for the CourseBuilder Interaction.
Changing the Possible Incorrect property doesn’t affect the judging of a
Action Manager
243
Score
Type
Description
Numeric
The designated numeric score for the CourseBuilder Interaction. A possible use
for the Score action is granting bonus points to a CourseBuilder Interaction under
certain conditions. The Score property resets when the user makes a selection.
Selected
Type
Description
Boolean
TRUE. The
element is selected.
FALSE. The
element is unselected.
CourseBuilder Interaction element property only.
Snap Back on Incorrect
Type
Description
Boolean
TRUE. The
drag element snaps back to the starting point when an incorrect
target is hit.
FALSE. The
drag element doesn’t snap to the starting point when an incorrect
target is hit.
The Action Manager is not evaluated when the drag element snaps back. Dragand-drop CourseBuilder Interaction element property only.
Snap Back on Miss
Type
Description
Boolean
TRUE. The
drag element snaps back to the starting point if no target is hit.
FALSE. The
drag element doesn’t snap back to the starting point if no target is hit.
The Action Manager is not evaluated when the drag element snaps back. Dragand-drop CourseBuilder Interaction element property only.
Snaps to
Type
Description
Boolean
TRUE. The
drag object snaps to the target object.
FALSE. The
drag object does not snap to the target object.
Drag-and-drop CourseBuilder Interaction pair property only.
244
Chapter 9
Time
Type
Description
Numeric
The time, measured in seconds, that the user spends in the CourseBuilder
Interaction.
Time Limit
Type
Description
Numeric
The number of seconds allocated as the time limit of a CourseBuilder Interaction.
Tolerance
Type
Description
Numeric
The area around a target, measured in pixels, that causes the drag object to snap to
the target object. Use the Tolerance property to increase or decrease the drop area
of a drag-and-drop interaction. Drag-and-drop CourseBuilder Interaction pair
property only.
Total Correct
Type
Description
Numeric
The total number of correct choices for a CourseBuilder Interaction.
This property is reset when the user selects a choice.
Total Elements
Type
Description
Numeric
The total number of elements in a CourseBuilder Interaction. For example, the
number of choices in a multiple-choice question.
Total Incorrect
Type
Description
Numeric
The total number of incorrect choices for a CourseBuilder Interaction.
Tracking Interaction ID
Type
Description
Text
The tracking interaction ID for the interaction.
Action Manager
245
Tracking Objective ID
Type
Description
Text
The tracking objective ID for the interaction.
Tracking Question Type
Type
Description
Text
The tracking question type for the interaction.
Tracking Weight
Type
Description
Numeric
The tracking weight for the interaction.
Tries
Type
Description
Numeric
The number of tries the user has taken in the interaction. Remember, a try is
equivalent to a single evaluation of the Action Manager.
Tries Limit
Type
Description
Numeric
The number of times a user can try the interaction. Use the Tries Limit property
to allow users to try the interaction more than one time under certain conditions.
Unknown Correctness
Type
Description
Select list
The default correctness value the Action Manager uses if the user doesn’t select
any response for the interaction. Once the page is loaded, changing this property
has no effect until the interaction is reset.
Value
Type
Description
246
Chapter 9
Select list
Sets the value for the specified element. For example, in a text field, the value is
the text; for a multiple-choice element, it’s true or false depending on whether the
choice has been selected or not; and for a timer, it’s the current time displayed.
CourseBuilder Interaction element property only.
X Offset
Type
Description
Numeric
The number of pixels added to or subtracted from the drag-and-drop snap-to
location. Use X Offset to fine-tune the alignment of the snap-to location. Dragand-drop CourseBuilder Interaction pair property only.
Y Offset
Type
Description
Numeric
The number of pixels added to or subtracted from the drag-and-drop snap-to
location. Use Y Offset to fine-tune the alignment of the snap-to location. Dragand-drop CourseBuilder Interaction pair property only.
Setting Action Manager properties
Action Manager properties can apply to the entire interaction or to any of the
segments in an interaction.
To set an Action Manager property:
1
Attach a Set Interaction Properties behavior to an object or add an action to the
Action Manager.
See “Using Behaviors” in the Using Dreamweaver book, or “Adding an action”
on page 224 in the Using CourseBuilder for Dreamweaver book.
2
In the Set Interaction Properties dialog box, from the Set pop-up menu, choose
Interaction.
3
From the Interaction pop-up menu, choose the CourseBuilder Interaction you
want to set a property for. From the pop-up menu to the right, choose <none>
to affect the entire Action Manager or select one of the segments from the
Segment pop-up menu.
4
From the Property pop-up menu, choose one of the two following properties.
Action Manager
247
Current Node
Type
Description
Select list
The starting evaluation point for state transition segments:
Reset
places the current node at the start of the segment.
places the current node at the end of the segment, so that the segment will
no longer be evaluated.
Done
The other option is to set Current Node to a specific condition name. This
resets the evaluation of a state transition segment to a higher node. For example,
to create a condition that checks if a user has made a mistake, add an action that
would give the user some feedback and then set the current node back to the
condition. The segment is then ready to check if the user makes that same
error again.
Disabled
Type
Description
Boolean
TRUE. The
Action Manager or segment is disabled.
FALSE. The
Action Manager or segment is enabled.
Setting the JavaScript property
Use the JavaScript property field to customize the setting of a property in a way
that’s not possible in the standard CourseBuilder Interactions user interface. The
information that appears in the JavaScript field corresponds with the actions and
behaviors that have been set. This field is a good way to understand the scripting
behind the actions and behaviors that CourseBuilder for Dreamweaver creates.
To set the JavaScript property:
1
Attach a CourseBuilder Interaction property behavior to an object or add an
action to the Action Manager.
See “Using Behaviors” in the Using Dreamweaver book, or “Adding an action”
on page 224 in the Using CourseBuilder for Dreamweaver book.
248
Chapter 9
2
In the Set Interaction Properties dialog box, choose JavaScript from the Set
pop-up menu.
3
Enter a JavaScript expression in the field provided.
Adding a custom behavior
The list of behaviors in the Action Manager is dynamically generated, making it
easy to use custom behaviors.
To add a custom behavior:
1
Create your custom behavior.
2
Copy the JavaScript and HTML files to
Dreamweaver\Configuration\Behaviors\Actions.
The new behavior appears at the bottom of the Action Manager pop-up menu
and in the Behavior window.
Action Manager CourseBuilder Interactions
The Action Manager object stores information from and controls all or a group
of CourseBuilder Interactions on a page. Unlike other CourseBuilder Interactions,
the Action Manager object does not have its own interactivity and is invisible
to users.
Use an Action Manager CourseBuilder Interaction to collect results from a set of
multiple-choice questions, summarize these results, and send a score back to a
tracking system. You can use Action Manager CourseBuilder Interactions to take
advantage of existing interactions on a page while creating a wide variety of system
actions. You can also use several Action Manager CourseBuilder Interactions on a
page and have each object behave differently.
For example, one Action Manager CourseBuilder Interaction could set properties
on interactions and trigger actions that make the page act as if it were a tutorial.
After those actions executed, the Action Manager CourseBuilder Interaction
could enable another Action Manager CourseBuilder Interaction on the same
page to control the interactions on the page to simulate the correct responses to
that tutorial. A third Action Manager CourseBuilder Interaction could enable the
second Action Manager CourseBuilder Interaction to control the simulation while
the third CourseBuilder Interaction collected results and sent those results to a
CMI system.
An Action Manager object’s segments can apply to any or all CourseBuilder
Interactions on that HTML page.
Don’t confuse the Action Manager CourseBuilder Interaction, which defines the
actions of multiple CourseBuilder Interactions on a single HTML page, with the
Action Manager tab, which defines the conditions and actions for a single
Action Manager
249
The Action Manager template
Click the Action Manager template icon, and then use the tabs of the
CourseBuilder Interaction dialog box to customize the Action Manager:
ActionMgr manages a group of object interactions on a page but does not
appear on-screen.
The Action Manager CourseBuilder
Interaction tabs
General tab
on this tab.
Interaction Name
determines when CourseBuilder for Dreamweaver evaluates a
page 163.
Judge Interaction
Knowledge Track
Tries Are
Time Is
places the entire CourseBuilder Interaction in a layer. See “Inserting a
Layer
Tracking tab
the General tab.
Action Manager tab
The Action Manager tab is where you add code segments that define how the
CourseBuilder Interaction behaves under specific conditions.
250
Chapter 9
10
CHAPTER 10
Scoring and Data Tracking
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Tracking user performance
Scoring and data tracking are key functions for evaluating how well users perform.
Tracking users’ performance has several benefits:
Provides feedback to users as they work through the course
Gets feedback from users while you’re developing and testing a piece
On course completion, assesses how well users have done
Uses performance information to design a more effective training piece
CourseBuilder for Dreamweaver makes tracking performance easy. Use
CourseBuilder Interaction settings to mark a response right or wrong, and to
apply a score to a response. You can also use JavaScript with CourseBuilder
Interaction variables to get dynamic information about the user’s interactions.
CourseBuilder for Dreamweaver’s Knowledge Track feature allows you to
exchange standard student performance information with computer-managed
instruction (CMI) systems like Lotus Pathware.
Knowledge Track can keep track of:
The number of right and wrong target responses a user has made
The number of tries the user took to get the right answer
The amount of time it took the user to respond to an interaction
The amount of time the user spent in an interaction
The amount of time remaining if there was a time limit on an interaction
The score for an interaction
251
You can transfer information directly to CMI systems using CourseBuilder for
Dreamweaver’s Knowledge Track actions—or save the information in a database,
such as Microsoft Access, SQL Server, or Oracle.
Consider the following if you want to track and record the user’s performance:
What activities do you need to track to assess a user’s performance?
See Scoring and data tracking—step-by-step procedures.
What level of performance is acceptable?
See Scoring a response.
How are you going to use the information you gather? Are you going to
use it to provide feedback? Will you display the information on the screen
to the user?
See Displaying feedback.
Where are you going to store performance information? On a local server? On
a web server across the Internet?
See Recording performance.
Do you want to store the information you’ve gathered in a CMI system?
See Using Knowledge Track.
Do you want to store the information you’ve gathered in a database?
See Connecting with databases.
Scoring and data tracking—step-by-step
procedures
What you can do
interaction
Limiting the number of tries
Limit the amount of time a user has to Putting a time limit on an interaction
respond correctly
Setting when a CourseBuilder Interaction
Interaction evaluates a user’s response is judged
as soon as the user drops a drag
element, when the user clicks a
Submit button, or when some
event occurs
which are wrong
252
Chapter 10
Marking a response right or wrong
What you can do
Assigning a score to an interaction
Scoring a response
Provide users with feedback about an
interaction
Displaying feedback
Create a one-page self-assessment
quiz
Scoring multiple interactions on the same
HTML page
Create a multi-page self-assessment
quiz
Scoring multiple interactions on different
HTML pages
Track the time remaining in an
interaction
Tracking the time remaining
Track the number of attempts that the Tracking the number of tries
student used to make a correct
response in an interaction
Identify CourseBuilder Interaction in
HTML source code
Locating the CourseBuilder Interaction
identifier in HTML Source code
Track interaction data with JavaScript
variables
JavaScript variables for tracking performance
Record interaction data
Recording performance
Using Knowledge Track
performance to a computer-managed Using CourseBuilder for Dreamweaver with
instruction system, such as Pathware Lotus Pathware
Record interaction data to a database Connecting with databases
Record interaction data using ODBC
Using ODBC
Collect data for recording to a serverside database
Collecting data
Transfer interaction data to a serverside database
Transferring data
Transfer interaction data using CGI
Transferring data using CGI
Record interaction data using
Cold Fusion
Recording data using Cold Fusion
Record interaction data using ASP
Recording data using ASP
Record interaction data using other
transport methods
Recording data with other transport methods
253
Marking a response right or wrong
CourseBuilder for Dreamweaver elements have three judge values—Correct,
Incorrect, or Not Judged. CourseBuilder for Dreamweaver stores the responses
and their values in a special set of system variables. This information is then
available to provide feedback to users as they respond to the interaction, and to
pass along to a CMI system.
Select one of the following settings to mark a response:
Correct
marks a response right.
Incorrect
marks a response wrong.
Not Judged
marks a response as neither right nor wrong.
To mark a response:
1
2
Select a setting for the response:
Multiple-choice response: click the Choice tab, select an element in the Choices
list, then select a setting from the Choice Is pop-up menu.
Drag-and-drop response: click the Pairs tab, select a pair in the Pairs list, then
select a setting from the Choice Is pop-up menu.
Explore response: click the Hot Areas tab, select an area in the Hot Areas list, then
select a setting from the Hot Area Is pop-up menu.
Text-entry response: click the Responses tab, then select a response in the Possible
Responses list, then select a setting from the Match Is pop-up menu.
Unexpected text-entry response: click the Responses tab, then select a setting from
the Any Other Response Is pop-up menu.
click the Triggers tab, select a trigger in the Triggers list, then
select a setting from the Trigger Is pop-up menu.
Timer response:
Slider response: click the Ranges tab, select a range in the Ranges list, then select a
setting from the Range Is pop-up menu.
254
Chapter 10
3
Repeat steps with any other responses you want to mark.
4
Click OK.
Scoring a response
Use the Score option to add a score to each response in an interaction. Use
positive values for correct responses, negative values for incorrect ones. Use higher
values for more accurate answers, lower values for answers that are correct, but
not complete.
The CourseBuilder Interaction adds up the scores of responses in interactions—
such as all-that-apply questions and drag-and-drop matching exercises—that have
more than one correct answer. (The CourseBuilder Interaction doesn’t, however,
produce a cumulative score if you give users more than one try to respond to an
interaction correctly.)
For information about scoring multiple interactions, see:
Scoring multiple interactions on the same HTML page
Scoring multiple interactions on different HTML pages
For information about storing the results of a student’s performance, see Tracking
user performance.
To score a response:
1
2
Select the response:
Multiple-choice response:
click the Choice tab, then select an element in the
Choices list.
Drag-and-drop response:
click the Pairs tab, then select a pair in the Pairs list.
Explore response: click the Hot Areas tab, then select an area in the Hot Areas
Button response:
list.
click the General tab.
Text-entry response:
click the Responses tab, then select a response in the Possible
Responses list.
Timer response:
click the Triggers tab, then select a trigger in the Triggers list.
Slider response:
click the Ranges tab, then select a range in the Ranges list.
3
In the Score field, type the score for the response.
4
Repeat the steps with any other responses you want to score.
5
Click OK.
255
Displaying feedback
You can display feedback messages for the student by using the following
feedback actions:
Action Name
What it does
Popup Message
Displays feedback in a pop-up dialog box. This is the
default feedback setting for CourseBuilder Interactions.
Set Text of Frame
Displays feedback in a different frame on the web browser.
Set Text of Layer
Displays feedback in a layer on the page.
Set Text of Text Field Displays feedback in a text field within a form on the page.
Add interaction-specific information to feedback messages with JavaScript
variables. Enclose the CourseBuilder Interaction’s unique ID and the variable in
braces ({}). For example, you can use the following text with a Popup Message, Set
Text of Frame, Set Text of Layer, or Set Text of Text Field action:
You got {G01.score--} points in this exercise.
The value of the CourseBuilder Interaction’s score variable replaces the text
between the braces:
You got 97 points in this exercise.
See also:
Learning-specific actions
Displaying feedback in a frame, layer, status bar, or text field
Locating the CourseBuilder Interaction identifier in HTML Source code
256
Chapter 10
Locating the CourseBuilder Interaction
identifier in HTML Source code
Every CourseBuilder Interaction on an HTML page has a unique identifier that
begins with the letter G followed by a number.
To see a CourseBuilder Interaction’s unique identifier:
1
Click the CourseBuilder Interaction icon on the page to select the object.
2
Choose Window > HTML to view the source for the page.
The first highlighted line in the HTML window contains the selected
CourseBuilder Interaction’s unique identifier. In this example, the
CourseBuilder Interaction’s unique ID is G01 (that’s a zero after the letter G):
object=”G01”
See JavaScript variables for tracking performance for more information about
CourseBuilder Interaction variables.
Scoring multiple interactions on the same
HTML page
You can combine several CourseBuilder Interactions on the same HTML page to
create a timed self-assessment quiz. Scoring multiple interactions on different
HTML pages shows how to store information about multiple CourseBuilder
Interactions when each CourseBuilder Interaction occupies its own HTML page.
See CourseBuilder for Dreamweaver Help for a Show Me example.
The example is a short quiz on the metric system. The quiz tracks the student’s
score for three different questions and presents the total in a text field 60 seconds
after the HTML page is loaded.
A quiz-timer CourseBuilder Interaction at the top of the page tracks the time
remaining. As the student goes through each CourseBuilder Interaction quizquestion (three varieties are demonstrated here), each question interaction
maintains its own score. When the countdown timer runs out, it notifies the
student, retrieves scores from the individual CourseBuilder Interactions, and
displays the total score at the top of the page.
The example doesn’t send any data back to the web server or to any other
destination. It’s possible to transfer the data tracked by the quiz. See Using
Knowledge Track and Connecting with databases for more information on using
server-side software to transfer and record data.
257
Setting up the quiz
Two example files (one for version 3 browsers and one for version 4 browsers) are
in Dreamweaver\Show Me\One-Page Quiz.
In the example file for version 4 browsers (one_page_quiz4.htm), a timer
CourseBuilder Interaction at the top of the page tracks and shows the elapsed
time. In the example file for version 3 browsers (one_page_quiz3.htm), an Action
Manager CourseBuilder Interaction at the top of the page tracks the elapsed time
for the quiz. A text field displays the student’s score when the time runs out.
The first CourseBuilder Interaction on the page is set to trigger a set of actions
after 60 seconds have elapsed. When that happens, the CourseBuilder
Interaction’s Action Manager executes the following actions in this order:
The Popup Message action displays an alert message telling the student that the
time is up.
The Judge Interaction action executes once for each CourseBuilder Interaction
that appears after the timer.
The Set Text of Text Field action displays the student’s score.
The student’s score is the sum of the scores for the CourseBuilder Interactions
on the page. The following text is used in the Set Text of Text Field action:
{G02.score + G03.score + G04.score}
If more than three CourseBuilder Interactions appear after the timer, you’d
display the scores for those CourseBuilder Interactions in the same way:
{G02.score + G03.score + G04.score+ G05.score+ G06.score}
G01
is the quiz-timer CourseBuilder Interaction and isn’t scored.
The CourseBuilder Interactions that appear after the quiz timer are set to be
judged on a specific event. In this case, the event is triggered when the Action
Manager for the quiz-timer CourseBuilder Interaction executes the Judge
Interaction action.
Add any number of CourseBuilder Interactions to your quiz page. The type of
CourseBuilder Interactions that you choose determines how many will fit on one
page. Although a single page can contain twenty true/false questions, it might
only fit one or two drag-and-drop exercises. See Scoring multiple interactions on
different HTML pages if you have more exercises than will fit on one page.
See also
Displaying feedback
Action Manager CourseBuilder Interactions—step-by-step procedures
258
Chapter 10
Scoring multiple interactions on different
HTML pages
CourseBuilder for Dreamweaver is designed for compatibility with server-side
software like Pathware and other computer-managed instruction (CMI) systems
that follow AICC web standards. Such systems allow a great deal of functionality
for deploying and tracking web-based applications.
You can develop effective applications with CourseBuilder for Dreamweaver
without CMI or other server-side software. The following example shows one way
to use CourseBuilder Interactions with JavaScript to create a self-assessment quiz
application that uses many CourseBuilder Interactions.
These examples don’t send data back to the web server or to any other destination.
It’s possible to transfer the data tracked by the quiz. See Using Knowledge Track
and Connecting with databases for more information on using server-side
software to transfer and record data.
Setting up the quiz
Two example files (one for version 3 browsers and one for version 4 browsers) are
in Dreamweaver\Show Me\Multiple-Page Quiz.
The example is a short quiz on the metric system. Each of the four quiz-question
HTML pages contains one CourseBuilder Interaction. The quiz tracks the
student’s score, the number of tries, and the time spent for each question and
presents the results in a page at the end of the quiz.
The example demonstrates one way to temporarily store information about
CourseBuilder Interactions when each CourseBuilder Interaction occupies its own
HTML page.
The example files for version 3 browsers (multi_page_quiz3.htm) and for version
4 browsers (multi_page_quiz4.htm) use a two-frame arrangement to provide an
interaction frame and a navigation frame. The first frame is the interaction frame,
which contains the HTML pages for the quiz exercises. The second frame is the
combined navigation and tracking frame. The name of the interaction frame is
main, and the name of the navigation frame is nav. For more information about
creating and naming frames in Dreamweaver, see “Creating frames” in the Using
Dreamweaver book.
The JavaScript scripts in the navigation frame page track any number of quizquestion pages. As the student answers a question, the quiz-question
CourseBuilder Interaction sends messages to the navigation frame scripts. You can
duplicate the scripts shown in the example questions for each question page in
your customized quiz. The final page of the interaction frame sequence is a scoring
page, which renders the scores of individual questions in bar graph form.
259
Setting up the navigation
The navigation frame page for version 3 browsers (showme_nav3.htm) and for
version 4 browsers (showme_nav4.htm) contains the JavaScript functions that
track the progress of each CourseBuilder Interaction as the student goes from one
question page to the next.
The buttons for navigation are Restart, Previous, Next, and Finish. The
navigation controls use the following JavaScript functions in the navigation
frame page:
goNext() goes to the next page of the quiz.
goPrev() goes to the previous page of the quiz.
goFirst() goes to the first page of the quiz.
goLast() goes to the last page of the quiz.
In the example for version 3 browsers, images are linked to the navigation
functions. To link an image to a JavaScript function, select the image and type
the function’s name in the Link field of the Property inspector using the
following syntax:
JavaScript:functionName()
In the example for version 4 browsers, an explore CourseBuilder Interaction is
used for the navigation controls. The Action Manager for this CourseBuilder
Interaction uses the Call JavaScript action to execute the navigation functions. For
information about using the Action Manager, see Action Manager CourseBuilder
Interactions—step-by-step procedures.
Setting up the tracking
The navigation frame page for version 3 browsers (showme_nav3.htm) and for
version 4 browsers (showme_nav4.htm) contains the JavaScript functions that
track the contents of the interaction frame.
Every HTML page displayed in the interaction frame is tracked as a quiz-page
object. The quizPage function creates a new quiz-page object for every HTML
page in your quiz and sets the values for the quiz-page URL, time elapsed, time
limit allowed, number of tries, score, and completion status.
260
Chapter 10
The following JavaScript code tracks the data for the CourseBuilder Interactions
displayed in the interaction frame:
function quizPage(src,time, timeLimit, tries, score, completed) {
this.src = src
this.time = (!time) ? 0 : time
this.timeLimit = (!timeLimit) ? 0 : timeLimit
this.tries = (!tries) ? 0 : tries
this.score = (!score) ? 0 : score
this.completed = (!completed) ? false : completed
}
The next line creates an array to contain all of the quiz-page objects in the quiz:
var quiz = new Array()
Modify the following code section in the navigation frame page to accommodate
all of the question pages, introductory pages, and summary pages. This is the only
section that needs to be modified when you add quiz pages. Each line corresponds
to an HTML page that is displayed in the interaction frame. The parameter for
the quizPage function describes the URL of the interaction frame page.
/* ---------------------------------------------------------------MODIFY THE CODE IN THE FOLLOWING SECTION.
------------------------------------------------------------------ */
quiz[0] = new quizPage("showme_overview.htm")
quiz[1] = new quizPage("showme_question1.htm")
quiz[5] = new quizPage("showme_summary4.htm")
/* ----------------------------------------------------------------END CODE MODIFICATION SECTION
-----------------------------------------------------------------*/
The first line is for the introductory page of the quiz:
quiz[0] = new quizPage("showme_overview.htm")
The next set of lines are for the quiz questions. When adding quiz questions, be
sure to increment the index value in quiz[index]:
The final line is for the final score page. If you add or remove quiz questions, be
sure to set the index value in quiz[index]:
quiz[5] = new quizPage("showme_summary4.htm")
Two text fields in a hidden HTML form are used to store the information for the
quiz-page objects. In the example files, the HTML form is named persistence and
the text fields are named persist and tries.
261
The following JavaScript functions in the navigation frame page are also used for
tracking and don’t need to be modified:
262
Chapter 10
Function name
Purpose
initPage()
Initializes the quiz pages in the event of a page reload.
restoreQuizObjects(storage)
Loads quiz page data from persistent storage using a
text field for storage.
saveQuizObjects()
Saves quiz page data in persistent storage using a text
field for storage.
setTries(URL, tries)
Sets the number of times that the student attempted
to answer the quiz page.
setAsDone(URL)
Sets the quiz page as completed.
setTimes(URL, time, timeLimit)
Sets the amount of time that the student has spent
viewing the quiz page.
setScores(URL, score)
Sets the score for the student’s response to the
quiz page.
resetObject(URL)
Resets the tries and score property settings for a quiz
page object.
findPage(URL)
Locates the quiz page object for a given quiz URL.
Setting up the questions
Create the quiz pages with CourseBuilder Interactions. The example uses four
CourseBuilder Interactions on four separate HTML pages. Specify the correct
answers, incorrect answers, and point values for each of the quiz questions using
the CourseBuilder Interaction dialog box.
Add two JavaScript functions to every HTML page that has a CourseBuilder
Interaction. JavaScript should only be added to a page in the HTML view.
Choose Window > HTML to open the HTML view.
Paste the following JavaScript code into each quiz page:
function initPage() {
var navBar = parent.nav
var thisQuizPage = navBar.findPage(document.URL)
if (thisQuizPage.completed) {
MM_setIntProps('G01.setDisabled(true);')
} else {
navBar.setTries(document.URL, 0)
}
}
function updateQuiz() {
parent.nav.setTries(document.URL, G01.tries);
parent.nav.setTimes(document.URL, G01.time, G01.timeLimit);
parent.nav.setScores(document.URL, G01.score);
}
The initPage function is called when the HTML page is loaded.
Add the onLoad event to the HTML page’s BODY tag:
<body bgcolor="#FFFFFF" onLoad="initPage( )">
The updateQuiz function sends the data for the quiz-page CourseBuilder
Interaction to the navigation frame page. This function is used so that the
student’s score, time elapsed, and tries attempted are not lost when the student
goes to the next quiz page. The Action Manager for the CourseBuilder
Interaction on the quiz page uses the Call JavaScript action to execute the
updateQuiz function. The Call JavaScript action occurs when the CourseBuilder
Interaction is judged as either correct or incorrect. For information about using
the Action Manager, see Action Manager CourseBuilder Interactions—step-bystep procedures.
Set the number of tries and time allowed for each CourseBuilder Interaction in
the General tab of the CourseBuilder Interaction dialog box. The Knowledge
Track feature is disabled because the quiz won’t be tracked with a server-side
management system. Save your quiz pages in the same location as the navigation
and interaction frame pages.
263
Displaying the student’s progress
The last page of the quiz for version 3 browsers (showme_summary3.htm) and for
version 4 browsers (showme_summary4.htm) uses JavaScript code to display the
student’s score, the attempts made, and the time spent in the quiz pages. You don’t
need to modify any of the code in this page even if you add or remove quiz pages.
A button on the page allows the student to repeat the quiz. If you change the
name of the HTML file for the quiz, you will need to modify the following line:
<INPUT TYPE="BUTTON" NAME="yes" VALUE="Yes" onClick="parent.location.href =
'multi_page_quiz4.htm'">
The parent.location.href parameter is the name of the frameset file that contains the
two frames.
Add any number of quiz pages to your quiz, and the scoring page will
automatically display the student’s progress for the entire quiz. The only section
that you need to modify if you’re adding pages is described in Setting up the
tracking. Be sure to paste the JavaScript code described in Setting up the questions
into each of your quiz pages. Then you’re all set.
Tracking the time remaining
Use a timer CourseBuilder Interaction to show a visual image of the time
remaining in a timed activity. You can also use an Action Manager CourseBuilder
Interaction to track the time remaining without showing a visual display. See
Scoring multiple interactions on the same HTML page for an example.
See also
Send Lesson Time
264
Chapter 10
Tracking the number of tries
Set a fixed limit on the number of tries that a user is allowed to correctly respond
to an interaction. Or use the tries JavaScript variable to track the number of
attempts that the user has made. See JavaScript variables for tracking performance
for more information.
See also
The following JavaScript variables can be used for tracking the student’s
performance and to provide feedback. The syntax for all the variables is:
var myVar = G01.variablename
For example:
var myScore = G01.score + G02.score + G03.score + G04.score
Display the value of these variables in feedback messages for the student by
enclosing the CourseBuilder Interaction’s unique ID and the variable in braces
({}). For example, you can type the following text for the Popup Message, Set Text
of Frame, Set Text of Layer, and Set Text of Text Field actions:
You got {G01.totalCorrect} out of {G01.possCorrect}!
See Learning-specific actions for more information about the feedback actions.
Variable Name
Purpose
score
Contains the numeric score for the interaction.
totalCorrect
Contains the total number of correct responses
the user made in the interaction.
totalIncorrect
Contains the total number of incorrect responses
the user made in the interaction.
possCorrect
Contains the total number of correct responses to
the interaction.
possIncorrect
Contains the total number of incorrect responses
to the interaction.
correct
Is true if the student completed the interaction
correctly, false otherwise.
265
Variable Name
Purpose
tries
Contains the number of times the user matched a
response in the interaction.
triesLimit
Contains the number of attempts that the user is
allowed to enter a correct response in the
interaction.
time
Contains the amount of time in HH:MM:SS
format that has elapsed since the interaction was
last judged.
timeLimit
Contains the amount of time in HH:MM:SS format
that the user is allowed to enter a correct
response in the interaction.
trackIntId
Contains the Interaction ID string entered in the
Tracking tab of the CourseBuilder Interaction.
trackObjectiveId
Contains the Objective ID string entered in the
Tracking tab of the CourseBuilder Interaction.
trackQType
Contains a string to identify the type of
interaction.
trackWeight
Contains the Weight value entered in the Tracking
tab of the CourseBuilder Interaction.
Recording performance
CourseBuilder for Dreamweaver automatically keeps track of information about a
user’s performance. However, the CourseBuilder Interactions don’t store this
information indefinitely, and they don’t save the information permanently before
the student exits the HTML page.
If you want to keep the information permanently, record it with a computermanaged instruction (CMI) system or server-side database.
A web site created with CourseBuilder for Dreamweaver, when linked to a serverside database, becomes a powerful medium for generating customized interactive
pages for anyone with a web browser. CourseBuilder for Dreamweaver can be used
to collect information about the site visitor’s interactions, and to transfer that
information to the database for tracking and recording.
266
Chapter 10
Select the Knowledge Track option on the General tab to use Knowledge Track.
The Knowledge Track feature is designed to transfer data to a server running
computer-managed instruction (CMI) software like Pathware that complies with
the AICC standard (for information, visit the AICC web site at www.aicc.org).
Pathware can be used with a number of different databases (see Using
CourseBuilder for Dreamweaver with Lotus Pathware).
Knowledge Track has two components:
The Tracking tab contains settings you use to specify interaction properties that are
recorded by a CMI or database server application. See Tracking tab.
create a
parent HTML document with two frames. The top frame displays the HTML
page that contains the CourseBuilder Interaction. A hidden bottom frame is used
by the CMI system to communicate with the CourseBuilder Interaction.
The Create Pathware Frameset and Create Tracking Frameset commands
When you select Knowledge Track, the following information is automatically
sent to the CMI server every time the CourseBuilder Interaction is judged:
The current date (DD/MM/YYYY)
The current time (HH:MM:SS)
The string entered in the Interaction ID field of the Tracking tab
The string entered in the Objective ID field of the Tracking tab
The type of the interaction
The correct answers for the CourseBuilder Interaction
The answer given by the student
Whether the student’s response was correct or incorrect
The weight given to the question for scoring
The time it took for the student to answer the question (HH:MM:SS)
267
When Knowledge Track is enabled, you can also use the following tracking
actions in a CourseBuilder Interaction’s Action Manager to communicate with
the CMI system:
Action
What it does
Send Score
Sends the activity score to the CMI system
Send Lesson Status
Sets the activity’s status as passed, failed, completed, or started
Send Lesson Time
Sends the amount of time the student spent in the activity
Send Objective
Information
Sends information about the activity’s specified objective
Send Interaction
Information
Sends information about a specific interaction
See also:
Connecting with databases
Knowledge Track actions
268
Chapter 10
Using CourseBuilder for Dreamweaver with
Lotus Pathware
CourseBuilder for Dreamweaver is designed for compatibility with Pathware
version 3.02 or higher. The Knowledge Track feature allows a CourseBuilder
Interaction in an HTML page to communicate information back to the web/
computer-managed instruction (CMI) server that served the page. This
information is specific to the current student and can include the score, status,
and cumulative time for all visits to the activity. The CMI server can also be
configured to track other information about students, courses, and activities.
Creating the CMI activity
1
2
Add one or more CourseBuilder Interactions to an HTML page to create
an activity.
Your HTML page may be one of many activities that make up a course as
defined by the CMI system.
3
Specify the correct answers, incorrect answers, and point values for each of the
activities using the appropriate interaction type tab—for example, Triggers tab
for a trigger CourseBuilder Interaction, Pairs tab for a drag-and-drop
4
On the General tab, set the number of tries and time allowed for each
CourseBuilder Interaction. Select the Knowledge Track option to enable serverside tracking.
You can associate the activity with a specific objective. Objectives are defined in
the CMI system. The CMI system also creates a unique Objective ID number
for the objective. In the Tracking tab, you can associate each CourseBuilder
Interaction in your HTML page with a CMI objective by entering a unique
Objective ID.
5
Choose Modify > CourseBuilder > Create Pathware Frameset.
A Pathware Frameset creates a parent HTML document with two frames.
The top frame displays the HTML page that contains the CourseBuilder
Interaction. A hidden bottom frame is used by the CMI system to
communicate with the CourseBuilder Interaction.
6
Copy your HTML files to the web/CMI server.
For Microsoft IIS web servers, your files usually need to reside in a directory
within C:\Inetpub\wwwroot\. Be sure to upload the scripts and images
directories so that your HTML pages can find any dependent files they need.
269
Defining the CMI course
The following procedure is for Pathware version 3. See the Pathware Help Pages if
you’re using a different version of Pathware.
Add an activity:
1
Launch the Pathmaker application on the web/CMI server.
2
Choose File > New Document to create a new course.
3
Rename the Untitled module that will contain your activity.
4
Add an activity to the course by dragging an activity icon from the icon palette
to the Course window.
Define the content for the activity:
1
Double-click the activity icon to open the Activity Properties window.
2
Set the various properties and options for the activity:
Type a name for the activity in the Title field.
Type the absolute URL to your HTML file in the URL field. The HTML file
should be the parent frameset HTML file described in Creating the CMI
activity. For example:
http://cmi.server.com/myquiz.htm
Select the Scored option to track the score for the activity.
3
Click OK to close the Activity Properties window.
Save and export the Pathmaker file:
1
Choose File > Save to save the course as a Pathmaker (PTH) file.
2
Choose File > Export and export the course as a Pathmaker Internet (PTI) file.
Use the same file name and location for the Pathmaker file and the Pathmaker
Internet file as shown in this example:
C:\Inetpub\wwwroot\Pathware\My_Course\Course_Name.PTH
C:\Inetpub\wwwroot\Pathware\My_Course\Course_Name.PTI
3
270
Chapter 10
Choose File > Exit to close the Pathmaker application.
Configuring the CMI server
The following procedure is for Pathware version 3. See the Pathware Help Pages if
you’re using a different version of Pathware.
1
Launch the Pathware LAN application on the CMI/web server and log in as an
administrator.
2
Click the Courses button. Click OK to display all of the available courses.
3
Set the various properties and options for the course:
Type a unique course ID in the Number field.
Type a name for the course in the Name field.
Enter the local path to the PTH file that you created to define the course. Click
the Browse button to specify the path to the file.
Set the Kind, Difficulty, and Other options for the course by selecting from the
available choices.
Select the Allow Self-Enrollment option to allow students to enroll themselves
in the course. If you don’t select this option, you will need to enroll students
from the roster.
4
Click the Add button to add the course to the list of available courses.
5
Click the Quit button to exit Pathware.
Taking the course
The following procedure is for Pathware version 3. See Pathware Help if you’re
using a different version of Pathware.
Provide students with the following instructions for taking the course. Make sure
you supply students with their user names and passwords.
1
Launch your web browser.
2
Type the URL for the CMI system.
3
Log in as a student.
4
Select the course from the list of available courses.
If the course doesn’t appear on the list, click the Enroll button to self-enroll
in the course.
5
Click the Start button to launch the activities in the course.
271
Connecting with databases
CourseBuilder for Dreamweaver sends data to a computer-managed instruction
(CMI) system when Knowledge Track is enabled. Modify Knowledge Track
features to collect data without using a CMI system like Pathware.
Use software on the server to connect a database to the Internet. This type of
software is often referred to as middleware because it functions in between the
server and the client. Examples include Microsoft Active Server Pages (ASP) and
Cold Fusion.
The following procedures describe the necessary steps to collect, transfer, and
record data to a database located at a remote location on a network.
The files you’ll need
The following files are located in the \Dreamweaver\Show Me\Data
Tracking folder:
272
Chapter 10
File Name
Purpose
data_tracking_frameset.htm
Frameset document to hold the content and
tracking frames
data_tracking_login.htm
Username and password entry page
data_tracking_nav.htm
Tracking page that contains an HTML form and
JavaScript functions
data_tracking_quiz.htm
Main content page with CourseBuilder Interaction
to track
data_tracking_quiz.mdb
Sample Microsoft Access database file
data_tracking_quiz.asp
Sample Active Server Pages file to record tracked data
on the server
data_tracking_quiz.cfm
Sample Cold Fusion file to record tracked data on
the server
scripts
Scripts folder and contents to copy to your server
Creating the data source
The data source is the combination of the database file and the path to it.
Regardless of the database software used, the database only accepts data in an
expected format. For example, if you’re collecting and transferring the student’s
name, password, and score, then your database file needs to have a table with a
matching set of fields to store that information. A path to the database file, with
read and write access, needs to be available to the web server.
The example files include a Microsoft Access database file named
data_tracking_quiz.mdb that you can use to try the example on your web server.
To use the example database file:
The following procedure is for a Windows-based web server. If you have a
different server computer, consult the documentation for your database software
to learn how data sources are defined and accessed.
1
Copy the example files to your server.
See The files you’ll need for more information.
2
Open the ODBC control panel on the web server.
3
Click the System DSN tab.
4
Click Add, and select Microsoft Access Driver from the dialog box.
5
Click Finish to close the dialog box.
6
Click Select, and browse to the data_tracking_quiz.mdb file.
7
Type dwaquiz in the Data Source Name field, then click OK.
Using ODBC
Open Database Connectivity (ODBC) is a widely accepted standard for database
access. It uses Structured Query Language (SQL) as its database access language.
Many database software products on the market today support ODBC. Active
Server Pages (ASP), Cold Fusion, and a number of Common Gateway Interface
(CGI) programs support database queries through ODBC and SQL.
Choosing a database and middleware that supports ODBC allows you to change
your database software at a later date without modifying the data collection or
transfer methods. You can even use the same ODBC data source with
Macromedia Generator to display customized graphics driven by the user’s
interactions. (For information about Generator, visit the Generator web site at
www.macromedia.com/software/generator/.)
273
Collecting data
If you’re not using a computer-managed instruction (CMI) system with
CourseBuilder for Dreamweaver, you need to collect the data that you want to
track before it can be transferred and recorded in a server-side database.
There are an infinite number of ways to connect a database to a web site. It’s not
possible to cover all the possible hardware, software, and network combinations.
The information provided here should be used as a starting point when setting up
on your particular server and database.
The examples used may apply to a specific database and server configuration.
With some modifications, you can adapt the example code for any database that
can accept data submitted by an HTML form. You will need to consult the
documentation for your particular web server and database software. Depending
on your configuration, you may also need an understanding of programming
languages like Perl, Visual Basic, and SQL.
Identifying the student
CourseBuilder for Dreamweaver doesn’t track the student’s identity. A CMI
system normally handles the task of user authentication. In the absence of a CMI
system, you can ask for the student’s name and password, and send this
information back to the server for validation. The data_tracking_login.htm file
uses a form to collect the student’s name and password, which is then tracked in
an HTML form in a different frame. The data_tracking_login.htm file also
specifies the first page that the student sees after logging in.
274
Chapter 10
Using an HTML form to collect and transfer data
In the example, an HTML form in the data_tracking_nav.htm file is used to
collect student data. The first line in the form’s HTML defines how the data in the
form will be processed. The action property should be set to the ASP file, Cold
Fusion file, or URL that is executed when the form is submitted. The form’s
method and name properties should not be changed.
<form action=" " method="POST" name="command">
<input type="hidden" name="username">
<input type="hidden" name="password">
<input type="hidden" name="score">
</form>
The data_tracking_nav.htm file also contains three JavaScript functions that track
the student’s name, password, and score:
function recordUsername(name)
function recordPassword(pwd)
function recordScore(score)
All three functions are similar—each function sets values in the HTML form
named command. The recordScore function uses the following statement to submit
the contents of the command form to the server:
document.command.submit( );
Modifying the command form
The following example shows how changing the form’s action property in the
data_tracking_nav.htm file defines how the data is sent.
<form action="mailto:[email protected]?subject=test results" enctype ="multipart/formdata" method="POST" name="command">
When the form is submitted, the form’s contents are sent in an e-mail message to
[email protected] without CGI or other server-side software. See Transferring data
for different ways to transfer data back to the server—including ASP, ActiveX
Data Objects (ADO), Cold Fusion, CGI, and others. It is also possible to save
data on the user’s hard disk. Keep in mind that you don’t have general access to
the local hard disk for storage through JavaScript and HTML. You will need to
use a plug-in, ActiveX control, or other software that will allow you to write to the
local hard disk.
The next two lines in the form are invisible hidden fields that are used to track the
student’s identity:
The next line defines a hidden field to hold score information about the
CourseBuilder Interaction on the main content frame.
You can define other fields to track in the command form. You need to modify the
scripts in the data_tracking_nav.htm file to track the fields that you define.
275
Transferring data
The example collects data with an HTML form that uses the POST method to send
the data over a network. You can change the network transport by modifying the
form’s action.
When using CourseBuilder for Dreamweaver to transfer data to a server, you’re
limited by the number of open connections your database and network support,
as well as the amount of free memory on the database server.
You can balance the load on the server by carefully planning the way users will
interact with your application. Don’t track everything the user does simply
because you can.
Combine mastery tests that require server-side tracking with self-assessment
modules that don’t. See Scoring multiple interactions on the same HTML page
and Scoring multiple interactions on different HTML pages for more information
about creating self-assessment quizzes using CourseBuilder for Dreamweaver.
Reduce the number of database queries by using one CourseBuilder Interaction to
collect data for multiple CourseBuilder Interactions. See the next topic for an
example.
Transferring data for multiple CourseBuilder Interactions
This example tracks the total score for a quiz. The quiz contains four
CourseBuilder Interactions. The first CourseBuilder Interaction is a timer for the
quiz. An example of this type of quiz is described in Scoring multiple interactions
on the same HTML page.
This JavaScript function in the data_tracking_quiz.htm file tallies the scores for
the CourseBuilder Interactions:
function tallyScore() {
var total = 0;
// that’s a zero after the letter G
total = G02.score + G03.score + G04.score; // G01 is the timer and is not scored.
document.forms[“QuizScore”].scorefield.value = total; // display the score
parent.nav.recordScore( total); // track the score in a separate frame
}
The tallyScore function tallies the score for the quiz. The recordScore function in the
tracking frame assigns that value to the score field in the command form in the
data_tracking_nav.file. The form is then submitted to the server. For more
information on creating a command form, see Using an HTML form to collect
and transfer data.
276
Chapter 10
Transferring data using CGI
A web server normally transfers an HTML page or other file to the browser
when it gets a request from a browser. CGI (Common Gateway Interface) is a
standard means for a custom program on the web server to respond to a request
from a browser.
Modifying the command form shows one way to send the contents of the
command form via e-mail using the mailto action. Unfortunately, the mailto action
doesn’t behave consistently across different browsers. Visit the CGI Collection
web site at www.itm.com/cgicollection and the CGI Resource web site at
www.cgi-resources.com/Programs_and_Scripts for CGI scripts you can use and
for information about developing your own scripts.
The first line in the command form in the data_tracking_nav.htm file defines how
the data in the form is processed. The action property should be set to the CGI
script or URL that is executed when the form is submitted.
<form action="mailform.cgi" method="POST" name="command">
Note how you can change the transport method used to transfer data by simply
modifying the form’s action. There are thousands of CGI programs available for
different web servers. You can create powerful applications with CourseBuilder for
Dreamweaver by experimenting with the CGI scripts that are available for your
particular server.
277
Recording data using Cold Fusion
The example can be modified to transfer data to the Cold Fusion Application
Server. You can use Cold Fusion objects and the Cold Fusion Application Server
to extend CourseBuilder for Dreamweaver with dynamic data publishing,
dynamic e-mail, and other interactive features.
Cold Fusion Application Server is a platform for building and deploying dynamic
web sites and applications that eliminates the need to create complicated CGI
scripts. It works with any major web server on Windows or Solaris. For
information about the Cold Fusion Application Server, visit the Allaire web site at
www.allaire.com/.
This command form is modified in the data_tracking_nav.htm file:
<form action="data_tracking_quiz.cfm" method="POST" name="command">
</form>
The first line specifies the action that happens when the form is submitted:
<form action="data_tracking_quiz.cfm" method="POST" name="command">
The data_tracking_quiz.cfm file contains the Cold Fusion instructions to insert the
form data to the database on the server:
<CFQUERY DATASOURCE="dwaquiz" NAME="">
INSERT INTO Quiz1
(username,
password,
score)
VALUES ('#Form.username#',
'#Form.password#',
'#Form.score#')
</CFQUERY>
Only the username, password, and score are passed back to the server to minimize
the number of transactions that the server needs to execute. Cold Fusion takes
care of inserting the form values into the username, password, and score fields in a
database table named Quiz1. The Quiz1 table is defined in the data source named
dwaquiz. The data source is the combination of the database and the path to it.
See Creating the data source for more information.
278
Chapter 10
Recording data using ASP
Microsoft IIS 3.0 and Active Server Pages (ASP) allow web applications to interact
with ODBC-compliant databases. The methods required to use ASP for tracking
CourseBuilder for Dreamweaver are similar to using the Cold Fusion Application
Server. Cold Fusion uses CFM files to interface with the database. The basic
differences are that an ASP file contains the database instructions and the
command form’s action is set to the ASP file:
<form action="data_tracking_quiz.asp" method="POST" name="command">
The data_tracking_quiz.asp file contains the following instructions to initialize a
connection to the database. The ASP file opens a connection to a data source
named dwaquiz. The data source is defined using the ODBC control panel on the
server computer.
<%
If IsObject(Session("dwaquiz_conn")) Then
Set conn = Session("dwaquiz_conn")
Else
Set conn = Server.CreateObject("ADODB.Connection")
conn.open "dwaquiz","",""
Set Session("dwaquiz_conn") = conn
End If
%>
The data_tracking_quiz.asp file also contains the following instructions to insert
the command form values into the username, password, and score fields in a
database table named Quiz1. The Quiz1 table is defined in the data source named
dwaquiz. This example uses the same database used in the Cold Fusion example.
<%
username = Request.Form("username")
password = Request.Form("password")
score = Request.Form("score")
sqlstr= "INSERT INTO [Quiz1] "
sqlstr= sqlstr & "(username, password, score)"
sqlstr= sqlstr & "VALUES "
sqlstr= sqlstr & "('" & username & "','" & password & "','" & score & "'" & ")"
Set rs = conn.execute(sqlstr)
Set rs = nothing
%>
Note that inserting values into the database is done with the same SQL INSERT
command used with Cold Fusion. ASP retrieves values from the command form
with the following syntax:
value=Request.Form("fieldName")
The SQL command is held in a string variable named sqlstr. ASP executes the
SQL command when it encounters this statement:
conn.execute(sqlstr)
For more information about ASP, visit the Active Server Pages web site at
www.activeserverpages.com/.
279
Recording data with other transport methods
By modifying the action of the command form in the data_tracking _nav.htm
file (see Using an HTML form to collect and transfer data), you can transfer
CourseBuilder for Dreamweaver data with any web transport that accepts form
data. Examples of such transports include Internet Database Connector (IDC),
ActiveX Data Objects (ADO), and many others. With careful planning, you can
isolate the database from the transport used to add, delete, and update records.
280
Chapter 10
11
CHAPTER 11
CourseBuilder Interaction Options
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
General options
The general options described in this section are common to all CourseBuilder
Interactions (except where noted). Other options appear on the General tab only
for specific types of CourseBuilder Interactions. If the option you’re looking for
isn’t described here, see:
Multiple-choice General tab options
Drag-and-drop General tab options
Explore General tab options
Button General tab options
Text entry General tab options
Timer General tab options
Slider General tab options
is the CourseBuilder Interaction’s unique name. It identifies the
Interaction Name
281
specifies when the CourseBuilder Interaction begins to evaluate
the conditions in the Action Manager.
Judge Interaction
When the user clicks a button labeled ____: adds an HTML form button to
the page. The CourseBuilder Interaction starts the evaluation when that button
is clicked (doesn’t appear for the button CourseBuilder Interaction): See
Changing the name of the Submit button.
On a specific event (set using the Judge Interaction Behavior): starts the
evaluation when some other action associated with the CourseBuilder
Interaction occurs. Use either the Dreamweaver Behavior inspector or the
Action Manager CourseBuilder Interaction to define the Judge Interaction
action that initiates the evaluation (see Setting when a CourseBuilder
Interaction is judged).
defines what qualifies as a correct response to the entire interaction
if more than one response is marked as correct within the interaction.
Correct When
Any Correct and None Incorrect causes CourseBuilder to judge a user’s
response to the interaction as correct if the response corresponds to any of the
correct answers (doesn’t appear for the Action Manager or button
CourseBuilder Interaction).
All Correct and None Incorrect causes CourseBuilder to judge a user’s response
to the interaction as correct only if the response corresponds to all of the correct
answers (doesn’t appear for the Action Manager or button CourseBuilder
Interaction).
Knowledge Track: Send results to a management system if present passes
information about user input to an external computer-managed instruction
(CMI) application, if you have one installed. When you check this option, a
Tracking tab appears after the General tab for you to enter more information
about scoring for the CourseBuilder Interaction. See Using Knowledge Track.
determines the number of tries a user has to complete the interaction.
Use the Action Manager to define or edit the actions that occur when the user
exhausts the number of tries. See Limiting the number of tries. For a description
of the Check Tries segment in the Action Manager, see Check Tries segment.
Tries Are
determines the amount of time in seconds that the user has to complete
the interaction. Use the Action Manager to define or edit the actions that occur
when time runs out (doesn’t appear for the button CourseBuilder Interaction). See
Putting a time limit on an interaction. For a description of the Check Time
segment in the Action Manager, see Check Time segment. See also Timer
Time Is
282
Chapter 11
adds an HTML form button to
the CourseBuilder Interaction to clear user input during the interaction. Clicking
the Reset button or refreshing the page in the browser window doesn’t, however,
deselect any selected radio buttons in a multiple-choice CourseBuilder Interaction
(doesn’t appear for the button CourseBuilder Interaction). See Resetting a
Reset: Create a Reset button for this Interaction
Layer: Insert this Interaction in a layer places a CourseBuilder Interaction in its
own layer, thereby simplifying Netscape layer issues and allowing for absolute
placement of the CourseBuilder Interaction on the page. This feature works
only in version 4 and later browsers. See Inserting a CourseBuilder Interaction
into a layer.
Multiple-choice General tab options
When you create or edit a multiple-choice CourseBuilder Interaction, these
additional options appear on the General tab:
appears on the page to introduce or explain the choices. Customize
this text in the Dreamweaver document.
Question Text
See:
Creating a true/false question
Judge Interaction: when the user clicks a choice starts the evaluation as soon as the
user clicks one of the items in the multiple-choice interaction. See Setting when a
CourseBuilder Interaction is judged.
283
Drag-and-drop General tab options
When you create or edit a drag-and-drop CourseBuilder Interaction, these
additional options appear on the General tab:
starts the evaluation as
soon as the user drops an element onto a target. See Setting when a CourseBuilder
Interaction is judged.
Judge Interaction: when the user drops a drag element
determines what happens to a drag element when a user drops it on or
near a target.
Reaction
Snap back if incorrect returns the drag element to its original position if the
user drops it on an incorrect target.
Snap back if not dropped on target returns the drag element to its original
position if the user doesn’t drop it on any of the possible target elements.
The CourseBuilder Interaction doesn’t evaluate the Action Manager, even if you’ve
selected “when the user drops a drag element” as the Judge Interaction setting.
See Setting how an element behaves when dropped.
Explore General tab options
When you create or edit an explore CourseBuilder Interaction, these additional
options appear on the General tab:
Judge Interaction: when the user clicks a hot area starts the evaluation whenever
the user clicks one of the CourseBuilder Interaction’s hot areas. See Setting when a
is the file name of an image behind the hot areas. See
Replacing placeholder graphics.
Backdrop Image File
284
Chapter 11
Button General tab options
When you create or edit a button CourseBuilder Interaction, these additional
selects the look of the button. See Choosing a look for a button; see
also Adding custom button graphics for information about adding new graphics
to the list.
Appearance
Type: Push/Toggle determines whether the button CourseBuilder Interaction
contains a push button or a toggle switch. See Changing the type of button.
Highlight on mouse over highlights the button graphic when the user passes the
pointer over it. See Highlighting a button.
Initial State: Deselected/Selected/Enabled/Disabled describes the default state of
the button—its state before the user takes any action. See Changing the initial
state of a button.
starts the evaluation whenever
the user clicks the button. See Setting when a CourseBuilder Interaction
is judged.
Judge Interaction: when the user clicks the button
defines the interaction as correct (or not
judged), depending on whether the button is up or down.
Correct When: Up/Down/Not Judged
assigns a score to clicking the button correctly. The score is passed to a
management system for tracking, or called and displayed through custom
JavaScript. See Using Knowledge Track.
Score
Text entry General tab options
When you create or edit a text entry CourseBuilder Interaction, these additional
Initial Text places editable default text in the CourseBuilder Interaction’s text entry
field. See Adding default text to a field.
starts the
evaluation whenever the insertion point leaves the HTML text input box. See
Setting when a CourseBuilder Interaction is judged.
Judge Interaction: when the user clicks or tabs out of the text entry field
285
Timer General tab options
When you create or edit a timer CourseBuilder Interaction, these additional
Appearance selects the look of the timer CourseBuilder Interaction. See Choosing
a look for a timer; see also Adding custom timer graphics for information about
adding new graphics to the list.
Duration: __ seconds
sets the amount of time on the timer. See Setting a timer.
displays the series of images that make up the
timer in reverse order (for example, to create the effect of a timer counting down).
Display images in reverse order
starts the evaluation
whenever the timer reaches a trigger you’ve set in the Triggers options
Judge Interaction: when any trigger condition is met
Slider General tab options
When you create or edit a slider CourseBuilder Interaction, these additional
selects the look of the slider. See Choosing a look for a slider; see
also Adding custom slider graphics for information about adding new graphics
to the list.
Appearance
defines the beginning and end values of the slider. Enter decimal numbers
to display decimal values on the slider (for example, 1.0 to 2.5). The range can be
low to high (1 to 10) or high to low (10 to 1). Enter both negative and positive
numbers (-10 to 10). Positive numbers can be ten digits long; negative numbers,
nine digits. See Setting a slider’s start and end values.
Range
sets the position of the slider’s thumb, where it remains until the
user moves it.
Initial Value
starts the evaluation
as soon as the user stops dragging the thumb of the slider. See Setting when a
Judge Interaction: when the slider thumb has been released
286
Chapter 11
Tracking tab
The settings on the Tracking tab specify interaction properties that may be
recorded by a CMI or database server application. Use JavaScript variables to
check the current value of these properties (see JavaScript variables for tracking
performance).
Interaction ID
identifies the interaction in the CMI system.
identifies a specific objective that the interaction is related to in the
CMI system.
Objective ID
Weight is an optional setting to indicate the relative importance of the interaction.
CMI systems may use the value of this property for scoring and grading students.
See Tracking user performance.
Choices options
The Choices tab, which appears whenever you create or edit a multiple-choice
CourseBuilder Interaction, defines the individual choices in a multiple-choice
interaction and any properties that apply to them.
Choices lists the choices in the CourseBuilder Interaction, along with information
about how the choice is to be judged.
Add
creates a new entry in the Choice list.
Delete
removes the selected entry from the Choice list.
See Adding or deleting a choice.
Up
reorders the list, moving a choice up to a different location on the page.
Down
reorders the list, moving a choice down to a different location on the page.
See Changing the order of the choices.
identifies the selected choice. The name of a choice is different from the
text of the choice. The text of a choice is what appears on the page; it’s what the
user sees. The name of the choice appears only in the CourseBuilder Interaction
dialog box. The name is case sensitive and can’t be reused for another choice. All
characters must be alphanumeric, and the name cannot contain spaces. See
Naming a choice.
Name
adds the text you type in the field to the selected choice. Customize the text
in the Dreamweaver document.
Text
287
See:
Replacing “True” and “False” with different words
Image File
adds an image to the selected choice. See Adding an image to a text
choice.
Place before text puts the image in front of all text when the current choice
appears on the page. This option applies only to the selected choice and must be
individually reapplied to other choices in the CourseBuilder Interaction.
defines either the graphic images used as the choices in multiplechoice CourseBuilder Interactions containing only graphics, or defines the graphic
buttons and check boxes used in place of form radio buttons and check boxes.
These images are active: users can click them. Any graphic files defined in the
Image File field are displayed with the choice but aren’t active.
Appearance
See:
defines the current choice as correct,
incorrect, or not judged. How the choice is judged determines the type of
feedback the user receives when clicking that choice. See Marking a response right
or wrong and Customizing feedback.
Choice Is: Correct/Incorrect/Not Judged
Score assigns a score to the choice. The score is passed to a management system for
tracking, or called and displayed through custom JavaScript. See Using
Knowledge Track.
288
Chapter 11
Drag-and-drop element options
The Elements tab, which appears whenever you create or edit a drag-and-drop
CourseBuilder Interaction, defines the individual drag elements and target
elements in an interaction and any properties that apply to them.
contains an entry for each of the drag-and-drop elements in the
CourseBuilder Interaction, along with information about whether those elements
are drag elements, target elements, or both drag and target elements.
Elements
Add
creates a new entry in the Elements list.
Delete
removes the selected entry from the list.
If you add an element to the Elements list, you need to assign the element to a
drag & target pair on the Pairs tab. See Adding and deleting drag-and-drop
elements.
labels the current element. The name is case sensitive and cannot be reused
for another element. All characters must be alphanumeric, and the name cannot
contain spaces. See Naming a drag-and-drop element.
Name
defines the image files used for the current drag-and-drop element. See
Replacing placeholder graphics.
Image File
defines what
role the current drag-and-drop element plays. A drag element is the element that
the user moves; a target element is the element that the drag element is dropped
on; and an element that is both drag and target can be both dragged to and
dropped on by other elements. See Making an element a drag element or a target.
Element Is: Drag Element/Target Element/Both Drag and Target
Pairs options
The Pairs tab, which is visible whenever you create or edit a drag-and-drop
CourseBuilder Interaction, defines the CourseBuilder Interaction’s drag & target
pairs and any properties that apply to them.
Pairs contains an entry for each of the drag & target pairs you’ve defined, along
with information about how the pair is to be judged. The pop-up menu above the
list lists all of the possible drag & target pairs that don’t yet appear on the Pairs list.
adds the drag & target pair you’ve selected for the pop-up menu to the
Pairs list.
Add
Delete
Removes the selected entry from the list.
moves a drag element to the
nearest possible target (regardless of how that drag & target pair is judged) if the
user drops the drag element within the specified number of pixels of the target.
The pixel value must be between 0 and 9999. See Setting how an element behaves
when dropped.
Snap If Within __ pixels of the target element’s center
289
aligns the drag element
with the target element as shown in the following illustration. Alignment is based
on the centers and edges of the layers that the drag and target elements occupy,
not on the centers and edges of the drag and target graphics. If a graphic and the
layer it occupies are of different sizes, their centers and edges might not
correspond. See Setting how an element behaves when dropped.
Snap To: Center/Left/Right/Top/Bottom of target element
Snap To: __ pixels down, __ pixels to right of target element’s upper left corner
aligns the upper left corners of the layers that contain the drag and target
elements, offsetting the corners by the values you enter (as shown in the
illustration).
290
Chapter 11
The pixel values must be between -999 and 9999.
Alignment is based on the corners of the layers that the drag and target elements
occupy, not on the corners of the drag and target graphics. If a graphic and the
layer it occupies are of different sizes, their corners might not correspond. See
Setting how an element behaves when dropped.
defines the selected drag & target pair as
correct, incorrect, or not judged. How the pair is judged determines the type of
feedback the user receives when dropping the selected drag element onto the
selected target. See Marking a response right or wrong and Customizing feedback.
Choice Is: Correct/Incorrect/Not Judged
assigns a score to the pair. The score is passed to a management system for
tracking, or called and displayed through custom JavaScript. See Using
Knowledge Track.
Score
Hot areas options
The Hot Areas tab, which appears whenever you create or edit an explore
CourseBuilder Interaction, defines the individual hot area layers in an explore
interaction and any properties that apply to them.
contains entries for each of the hot area layers in the CourseBuilder
Interaction, along with information about how the hot area is to be judged.
Hot Areas
Add
creates a new entry in the list of hot areas.
Delete
removes the selected entry from the list of hot areas.
See Adding and deleting hot areas.
labels the current hot area layer. The name is case sensitive and cannot be
reused for another hot area. All characters must be alphanumeric, and the name
cannot contain spaces. See Naming a hot area.
Name
adds the text to the current hot area layer. Customize the text in the
Dreamweaver workspace. See Adding text to a hot area.
Text
Image
adds an image to the current hot area layer. See Naming a hot area.
defines the current hot area layer as
correct, incorrect, or not judged. How the hot area is judged determines the type
of feedback the user receives when clicking that hot area. See Marking a response
right or wrong and Customizing feedback.
Hot Area Is: Correct/Incorrect/Not Judged
assigns a score to the hot area. The score is passed to a management system
for tracking or called and displayed through custom JavaScript. See Using
Knowledge Track.
Score
291
Responses options
The Responses tab, which appears whenever you create or edit a text entry
CourseBuilder Interaction, defines strings of text (called possible responses) for user
input to be compared to, as well as any properties that apply to those strings.
Possible responses can be either correct or incorrect—they’re simply strings of text
you expect users to enter.
Possible Responses contains an entry for each text string you expect users to enter.
It also contains, for each entry, information about how user input is judged if it
matches the current response.
Add
creates a new entry in the list of possible responses.
Delete
removes the selected entry from the list of possible responses.
Name labels the current response. The name of a response is different from the text
you expect users to enter. The name of the choice appears only in the
CourseBuilder Interaction dialog box; it’s merely a way of labeling a response to
make it easier to work with. The name is case sensitive and cannot be reused for
another response. All characters must be alphanumeric, and the name cannot
contain spaces. See Naming a response.
defines the character or string of characters that you expect users to
enter. The user’s actual input is compared to the character or string. If it matches,
it’s judged based on whether you have defined the text response as correct,
incorrect, or not judged. See Checking for an exact match and Checking for key
words or phrases.
Must Contain
checks to make sure the user’s input is capitalized exactly as the
string in the Must Contain field. See Checking for correct capitalization.
Case Sensitive
Exact Match Required considers the user’s input a match only if the text the user
has entered is the same as the text in the Must Contain field in every way—the
same spelling, same spacing, and same punctuation. Only the capitalization can
vary. If this option is unselected, the CourseBuilder Interaction considers the
user’s input a match if the text in the Must Contain field appears somewhere in
the text the user has typed. See Checking for an exact match.
Match Is: Correct/Incorrect/Not Judged defines user input, if it matches the
current possible response character or string, as correct, incorrect, or not judged.
How the character or string is judged determines the type of feedback the user
receives when entering that text. See Marking a response right or wrong and
Customizing feedback.
assigns a score to the response. The score is passed to a management system
for tracking or called and displayed through custom JavaScript. See Using
Knowledge Track.
Score
Any Other Response Is: Correct/Incorrect/Not Judged defines any user input that
doesn’t match any of the possible responses as correct, incorrect, or not judged.
This option applies to the text entry CourseBuilder Interaction as a whole. See
Checking for unanticipated responses.
292
Chapter 11
Triggers options
The Triggers tab, which appears whenever you create or edit a timer
CourseBuilder Interaction, defines the trigger values on a timer and any properties
that apply to them.
lists each trigger in the CourseBuilder Interaction, along with
information about how the trigger is to be judged.
Triggers
Add
creates a new entry in the list of triggers.
Delete
removes the selected entry from the list of triggers.
See Adding and deleting triggers.
labels the current trigger. The name is case sensitive and cannot be reused
for another trigger. All of the characters must be alphanumeric, and the name
cannot contain spaces. See Naming a trigger.
Name
Trigger Once After __ seconds
sets the time at which the timer is triggered. See
Setting a trigger.
defines the current trigger, when reached,
as correct, incorrect, or not judged. How the trigger is judged determines the type
of feedback generated when the timer reaches the trigger. See Marking a response
right or wrong and Customizing feedback.
Trigger Is: Correct/Incorrect/Not Judged
assigns a score to the current trigger. The score is passed to a management
system for tracking or called and displayed through custom JavaScript. See Using
Knowledge Track.
Score
Interaction Is: Correct/Incorrect/Not Judged before timer reaches first trigger
defines a user’s response, if it occurs before the timer reaches the first trigger, as
correct, incorrect, or not judged. This option applies to the timer CourseBuilder
Interaction as a whole. See Judging a response before the first trigger is reached.
293
Ranges options
The Ranges tab, which appears whenever you create or edit a slider CourseBuilder
Interaction, defines the slider’s ranges and any properties that apply to them.
contains an entry for each range in the CourseBuilder Interaction, along
with information about how the range is to be judged.
Ranges
Add
creates a new entry in the list of ranges.
Delete
removes the selected entry from the list of ranges.
See Adding and deleting ranges.
Name labels the current range. The name is case sensitive and cannot be reused for
another range, once defined. All characters must be alphanumeric, and the name
cannot contain spaces. See Naming a range.
sets the values that define a range. The start and end values
that you enter are included in the range. See Setting a range.
Range __ to __ units
defines the current range, when reached, as
correct, incorrect, or not judged. How the range is judged determines the type of
feedback generated when the user moves the slider thumb within the range you’ve
defined. See Marking a response right or wrong and Customizing feedback.
Range Is: Correct/Incorrect/Not Judged
assigns a score to the current range. The score is passed to a management
system for tracking or called and displayed through custom JavaScript. See Using
Knowledge Track.
Score
294
Chapter 11
Action Manager segments
Each template has a set of segments in the Action Manager that determine what
happens when the CourseBuilder Interaction evaluates a user’s response. The
point at which the CourseBuilder Interaction executes the Action Manager is
determined by the Judge Interaction setting on the General tab (see General
options). Judge, in fact, doesn’t necessarily mean evaluate the student’s performance;
its literal meaning is simply execute the code in the Action Manager.
For a detailed description of the Action Manager segments used in a particular
template, see:
Check Time segment
Correctness segment
Multiple-choice segments
One-to-one matching segments
One-to-one matching (either way) segments
One-to-many matching segments
“Build your own” template segments
Two-step procedure segments
Explore segments
Toggle-switch segment
Pushbutton segment
Text entry segments
Timer segment
Timer with warning segment
Range slider segment
Point slider segment
295
Check Time segment
The Check Time segment is a standard segment that’s part of all the templates. It
contains one condition—”if Time At Limit”—that compares the Time At Limit
property with the Time Is setting on the General tab. If the “if Time At Limit”
condition is true, it triggers a Popup Message action (which lets the user know
time has run out) and a Set Properties action (which disables the interaction).
By default, the time setting in the General tab is set to Unlimited. To set a time
limit, see Putting a time limit on an interaction.
To change the default feedback displayed by the Popup Message action, see
Customizing feedback. See also Displaying feedback in a frame, layer, status bar,
or text field.
Correctness segment
The Correctness segment is a standard segment that’s part of almost all the
templates. It checks three conditions for the interaction. First, the “if Correct”
condition tests to see if the response by the user is correct, by checking the Correct
State property to see if it’s correct. If that condition isn’t true, the second
condition, “else if Incorrect,” checks to see if the Correct State property is
“Incorrect.” The third condition, “else if Unknown Response,” tests to see if the
Known Response property is “False.” Simply stated, the conditions ask the
questions: Did the user answer correctly? Did the user answer incorrectly? Did the
user respond at all? In each case, a Popup Message action displays a message that
tells users whether their response was correct, incorrect, or unknown.
To change the default feedback displayed by a Popup Message action, see
or text field.
Check Tries segment
The Check Tries segment is a standard segment that’s part of all the templates. It
compares the Tries At Limit property with the Tries Are setting on the General tab
to see if they are equal. If the “if Tries At Limit” condition is true, it triggers a
Popup Message action (which lets the user know there are no tries left) and a Set
Properties action (which disables the interaction).
By default, the tries setting in the General tab is set to Unlimited. To set a time
limit, see Limiting the number of tries.
To change the default feedback displayed by the Popup Message action, see
or text field.
296
Chapter 11
Multiple-choice segments
The Action Managers in the true/false, multiple-choice, graphic multiple-choice,
and all-that-apply templates all use the same three standard segments. See:
Check Time segment
Correctness segment
Check Tries segment
For information about the templates, see The multiple-choice templates.
One-to-one matching segments
The Action Manager in the drag-and-drop one-to-one matching template uses the
three standard segments. See:
Check Time segment
Correctness segment
Check Tries segment
For information about the template, see One-to-one matching.
One-to-one matching (either way) segments
The Action Manager in the drag-and-drop one-to-one matching (either way)
template uses two of the three standard segments. See:
Check Time segment
Check Tries segment
The Correctness segment is slightly different from the standard Correctness
segment. It checks three conditions for the interaction. First, the “if Unknown
Response” tests to see if the Known Response property is false. If that condition
isn’t true (that is, if the response is known), the second condition, “else if Total
Correct equals 3,” checks to see if the Total Correct property for the interaction is
equal to 3, the number of possible correct matches. If the condition is true, a
Popup Message action displays a message letting users know how many correct
items they selected. If, however, the condition is false, the third condition, “else if
incorrect,” tests to see if the Total Correct property doesn’t equal 3. If that
condition is true—that is, if the user didn’t get all three answers correct—it
triggers a Popup Message action that uses embedded JavaScript variables to tell the
user how many choices out of the total possible were correct.
or text field.
For information about the template, see One-to-one matching, either way.
297
One-to-many matching segments
The Action Managers in both drag-and-drop one-to-many matching templates
use the three standard segments. See:
Check Time segment
Correctness segment
Check Tries segment
For information about the templates, see One-to-many matching and One-tomany matching, either way.
“Build your own” template segments
The Action Manager in the “Build your own” template uses the three standard
segments. See:
Check Time segment
Correctness segment
Check Tries segment
It also includes two special feedback segments:
In the “DragTarget1 to DragTarget2 Feedback” segment, if the condition “if
DragTarget1 to DragTarget2 Selected” is true—that is, if a user has dropped
DragTarget1 on DragTarget2—it triggers a Popup Message action that displays a
message stating simply that the user has hit DragTarget 2.
The “DragTarget2 to DragTarget1 Feedback” segment provides exactly the same
type of feedback. If the condition “if DragTarget2 to DragTarget1 Selected” is
true, it triggers a Popup Message action that displays a message stating simply that
the user has hit DragTarget1.
or text field.
For information about the template, see The “Build your own” template.
298
Chapter 11
Two-step procedure segments
The Action Manager in both two-step procedure templates uses two of the three
standard segments. See:
Check Time segment
Check Tries segment
is set up to track state transitions, which means
that once a condition in the segment is true, the CourseBuilder Interaction skips
the condition the next time it evaluates the statements in the Action Manager. On
the other hand, if a condition is false, the CourseBuilder Interaction returns
directly to it the next time it evaluates the segment.
The Two-Step Matching segment
In the Two-Step Matching segment, the first condition, “if Step1 – Drag1 to
Target1 Selected,” checks to see if the user dropped the drag element on the first
target by checking that the Selected property for the drag element and the first
target element pair is true. If so, the condition triggers a Popup Message action
that displays a message stating that the user completed the first step.
If the first condition is true, there’s another condition nested within the first, “if
Step2 – Drag1 to Target2 Selected,” that the Action Manager tests. The condition
checks to see if the user dropped the drag element on the second target by
checking that the Selected property for the drag element and the second target
element pair is true. If so, the condition triggers a Popup Message action that
displays a message stating that the user successfully completed the interaction.
If the user missed the first step—say the user drops the drag element on the
second target as the first step—the “else if Step1 Missed” condition is true. That
condition triggers a Popup Message action that displays a message stating that the
user must match the first target before the second. It then triggers a Reset action
that resets the state transition of the previous segment so the user can try again.
The “else if Step1 Missed” condition is true only if the user hasn’t already dropped
the drag element on the first target. Once the user drops the drag element on the
first target, the state transition takes effect. When the user drops the drag element
on the second target, the CourseBuilder Interaction executes the Action Manager
a second time, and goes directly to the second condition, “if Step2 – Drag1 to
Target2 Selected,” when it evaluates the Two-Step Matching segment.
The Drag1 to Target3 Feedback segment, which is part of the two-step procedure
with a distractor segment, contains one condition, “if Drag1 to Target3 Selected,”
which checks to see if the user dropped the drag element on Target3. If the
condition is true, it triggers a Popup Message action that displays a message saying
the user took an incorrect step.
or text field.
For information about the templates, see Two-step procedure and Two-step
procedure with a distractor.
299
Explore segments
The Action Managers in the explore templates use the three standard
segments. See:
Check Time segment
Correctness segment
Check Tries segment
The Action Managers also contain a series of feedback segments. The Hot Area
Feedback segments are all similar: each is associated with a different hot area on
the page. If the user selects a hot area, the condition “if Hot Area Selected” in its
associated segment is true. The condition triggers a Popup Message action that
displays the number of the area the user selected.
or text field.
For information about the templates, see Random exploration and Structured
exploration.
Toggle-switch segment
The Action Manager in the toggle-switch template uses two of the three standard
segments. See:
Check Time segment
Check Tries segment
It also includes a special feedback segment:
In the Button Selected segment, the first condition, “if Selected,” checks to see if
the Selected property is true for the button. If it is, it triggers a Popup Message
action that displays a pop-up message telling users they’ve selected the button.
Otherwise, the “else if Deselected” condition checks to see if the Selected property
is false. If it is, the condition triggers a Popup Message action that displays a popup message telling users they’ve deselected the button.
or text field.
For information about the template, see Toggle switches.
300
Chapter 11
Pushbutton segment
The Action Manager in the push button template uses two of the three standard
segments. See:
Check Time segment
Check Tries segment
It also includes a special feedback segment:
In the Button Feedback segment, the CourseBuilder Interaction executes the
Popup Message action any time it evaluates the Action Manager. Any time
users click the button, a pop-up message appears telling them they’ve clicked
the button.
or text field.
For information about the template, see Push buttons.
Text entry segments
The Action Managers in the text entry templates all use the same three standard
segments. See:
Check Time segment
Correctness segment
Check Tries segment
For information about the templates, see Single-line text entries and Multiple-line
text entries.
Timer segment
The Action Manager in the timer template has a single special feedback segment:
The Trigger1 Feedback segment has a condition, “if Trigger1 Selected,” that
becomes true when the timer runs out. The trigger in the template is set to 30
seconds (see Setting a trigger).
or text field.
For information about the template, see Timers.
301
Timer with warning segment
The Action Manager in the timer with a warning template has two special
feedback segments:
The Trigger1 Feedback segment (the segment for the warning trigger) has a
condition, “if Trigger1 Selected,” that becomes true when the timer runs out. The
trigger in the template is set to 30 seconds (see Setting a trigger).
The “if Trigger2 Selected” condition in the second segment, Trigger2 Feedback,
becomes true at 30 seconds. Because both of the segments are state transitions, the
first segment is evaluated until the condition is true, after 15 seconds. When that
condition is true, the CourseBuilder Interaction skips the first segment when it
evaluates the Action Manager and goes directly to the second segment.
or text field.
For information about the template, see Timers with a warning.
Range slider segment
The Action Manager in range slider templates uses two of the three standard
segments. See:
Check Time segment
Check Tries segment
The “if Range1 Selected” condition in the Range1 Feedback segment is true when
the user drags the slider’s thumb into this range. The “if Range2 Selected”
condition in the next segment, Range2 Feedback, is true when the user slides the
thumb to the other end of the range. The Popup Message action for both
conditions displays messages that indicate what range the user selected. Because
both triggers are not judged, there is no correctness or incorrectness.
or text field.
For information about the template, see Range sliders.
302
Chapter 11
Point slider segment
The Action Manager in the point slider template uses the three standard
segments. See:
Check Time segment
Correctness segment
Check Tries segment
The “if Range1 Selected” condition in the Range1 Feedback segment is true when
the user drags the slider’s thumb into its range. The condition triggers a Popup
Message action that displays a message saying that the position of the slider
is too low.
The next segment, Range3 Feedback, contains another condition, “if Range3
Selected,” that’s true when the user slides the thumb to the high end of the range.
The condition triggers a Popup Message action that displays a message stating that
the position is too high. If the user moves the slider to the correct range, the “if
Correct” condition in the Correctness segment is true, triggering the Popup
Message action there.
or text field.
For information about the template, see Point sliders.
303
304
Chapter 11
INDEX
A
Action Manager 215
adding custom behaviors in 249
CourseBuilder Interaction 249
feedback action in 218
Knowledge Track action in 218
pop-up menu, rearranging items on 218
properties in
Current Node 248
Disabled 248
JavaScript 248
segments
Build Your Own Template 298
Check Time 296
Check Tries 296
Correctness 296
Explore 300
introduction 295
Multiple-choice 297
One-to-Many Matching 298
One-to-One Matching 297
One-to-One Matching (either way) 297
Point Slider 303
Push-button 301
Range Slider 302
Text Entry 301
Timer 301
Timer with Warning 302
Toggle-switch 300
Two-step Procedure 299
setting properties 247
template
Action Manager tab 250
General tab 250
Tracking tab 250
Action Manager CourseBuilder Interaction, dialog
box tabs 250
Action Manager tab
explore 132
in Action Manager template 250
in button template 176
in slider template 202
in text entry template 147
in timer template 187
introduction 215
step-by-step procedures 215
actions
copying 226
cutting 226
editing 225
feedback 218
Knowledge Track 218
Interaction ID 234
Objective ID 234
Send Interaction Information 235
Send Lesson Status 236
Send Lesson Time 237
Send Objective Info 237
Send Score 238
Weight 234
learning-specific
introduction 227
Judge Interaction 227
PopupMessage 230
Reset Interaction 228
Set Interaction Properties 229
Set Text of Frame 231
Set Text of Layer 232
Set Text of Text Field 233
pasting 226
renaming 224
where to create 226
305
adding
action 224
choice 97
CourseBuilder Interaction to document 70
custom behavior 249
custom button graphics 184
custom slider graphics 213
custom timer graphics 198
default text to field 153
drag-and-drop element 124
drag-and-drop pair 125
image to text choice 98
new condition 219
new segment 218
response name 154
slider range 212
text to hot area 142
trigger 197
AGT files 170
all-that-apply question 94
appearance
button 182
slider 210
timers 196
ASP data recording using 279
Authorware objects, inserting 168
Authorware Web Player integration 167
B
browser considerations
button, when creating 179
custom template, when building 113
interaction, when savings as template 169
matching exercise, when creating 110
multiple-choice question, when creating 89
point slider, when creating 208
procedure template, when building your own 120
procedure, when creating 118
push button and 178
random exploration, when creating 136
range slider 204
range slider, when creating 205
structured exploration, when creating 139
timer template 192
timer with a warning, when creating 193
timer, when creating 190
toggle switch 177
306
Index
button CourseBuilder Interaction
Action Manager tab in 176
adding custom graphics in 184
changing appearance of 182
changing initial state of 183
changing type of 183
creating button with 179
General tab in 175
GIF files in 184
highlighting 182
introduction 173
pixel specifications 184
push button template 178
templates 174
toggle switch template 177
Tracking tab in 175
C
capitalization, checking for 154
changing
button appearance 182
button type 183
choices 97
name of a drag-and-drop element 123
order of category list 170
order of choices 97
response name 153
slider appearance 210
submit button name 164
trigger name 196
Check Time segment 296
Check Tries segment 296
checking
capitalization 154
exact text match 155
keywords and phrases 155
unanticipated response 156
checklist, new user’s 16
Cold Fusion data recording using 278
collapsing segment in Action Manager 225
configuring server for 271
connect ingwith database 272
creating activity 269
defining course 270
required database files for 272
Condition Editor, setting Type field 223
conditions
adding 219
adding action to 224
collapsing 225
Condition Editor 222
copying 226
creating expression for 221
creating new 220
cutting 226
demoting 225
editing 225
expanding 225
pasting 226
promoting 225
renaming 224
converting previous version files 75
copying support files 18
Correctness segment 296
CourseBuilder for Dreamweaver Support Center 15
Action Manager 249
adding a template 169
adding to document 70
adding to Gallery 169
Condition Editor 222
drag-and-drop 99
icon 69
identifying in HTML 257
template gallery 71
templates, overview of 71
text entry 143
tracking, displaying feedback response 256
Type field setting 223
CourseBuilder Interaction dialog box
drag-and-drop 102
slider 201
text entry 145
timer 186
CourseBuilder Interaction tab 82
See also button CourseBuilder Interaction
See also customizing CourseBuilder Interaction
See also explore CourseBuilder Interaction
See also multiple-choice CourseBuilder
Interaction
See also segments
See also slider CourseBuilder Interaction
See also text entry CourseBuilder Interaction
See also timer CourseBuilder Interaction
CourseBuilder Interactions
browser compatibility 73
explore 131
creating 136
button 179
custom icon for template 170
custom timer 199
expression for condition 221
matching exercise 110
multiple-choice question 89
new condition 220
new segment 219
point slider 208
range slider 205
text entry field 151
timer 190
timer with a warning 193
true/false question 86
Current Node property 248
customizing Action Manager pop-up menu 217
customizing CourseBuilder Interaction
adding to Gallery 169
Authorware Web Player integration 167
changing category order 170
changing submit button name 164
changing template order in Gallery 171
clearing 158
copying 158
creating icon for template 170
cutting 158
feedback 159
Gallery file 170
limiting interaction by time 163
limiting number of tries 162
removing 158
resetting 165
setting preferences 167
Index
307
D
data collection
ASP, recording data using 279
Cold Fusion, recording data using 278
identifying student for 274
introduction 274
modifying HTML form, using 275
transferring data 276
transferring data using CGI 277
transport methods 280
data tracking 251
databases
ASP, record data 279
Cold Fusion, recording data using 278
collectingdata 274
connecting to 272
creating data source for 273
identifying student 274
modifying HTML form, using 275
ODCB, using 273
required files for 272
deleting
choice 97
drag-and-drop pair 125
hot areas 142
response name 154
slider range 212
trigger 197
demoting condition 225
discussion groups 17
displaying feedback 256
drag-and-drop CourseBuilder Interaction
adding drag-and-drop pair in 125
adding element in 124
building custom template 112
building your own procedure template 120
changing element name in 123
creating matching exercise 110
deleting drag-and-drop pair in 125
deleting element in 124
dialog box tabs 102
Elements tab in 103
308
Index
drag-and-drop CourseBuilder Interaction (continued)
introduction 99
naming element in 123
one-to-many matching 108
one-to-many matching, either way 109
one-to-one matching 106
one-to-one matching, either way 107
Pairs tab 103
replacing placeholder graphics in 122
setting drag element in 128
setting element behavior when dropped 127
target element active area 126
Tracking tab 102
two-step procedure template 116
two-step procedure with distractor template 117
DWARE discussion list, subscribing to 16
E
editing
actions 225
conditions 225
segments 225
elements
changing name 123
drag-and-drop 124
setting to drag 128
target active area 126
exact text match, checking for 155
expanding segment 225
exploration, random 135
exploration, structured 139
explore CourseBuilder Interaction
adding hot area in 142
adding text to hot area 142
deleting hot area in 142
dialog box tabs 131
General tab in 131
Hot Areas tab in 132
introduction 129
naming hot area in 141
random exploration 135, 136
replacing placeholder graphics 141
structured exploration 138, 139
templates 130
Tracking tab 131
F
feedback actions 218
file
AGT extension 170
GIF 184
G
Gallery files
AGT file extension 170
changing category order 170
changing template order 171
working with 170
General tab 81
Action Manager 250
button in 175
explore in 131
slider in 201
text entry in 145
timer in 186
GIF files 184
graphics
custom button 184
custom slider 213
custom timer 198
GIF files 184
pixel requirement 184
H
hot areas
adding 142
adding text 142
changing name of 141
deleting 142
HTML identifier, CourseBuilder Interaction 257
I
icons, creating custom 170
Index, Help 14
installing Dreamweaver 13
integration, Authorware Web Player 167
Interaction ID 234
interactions
sample quiz for multiple interactions on different
HTML page 259
sample quiz for scoring on same HTML page 258
tracking
correct response 254
incorrect response 254
JavaScript variables 265
Knowledge Track 267
Lotus Pathware 269
marking a response right or wrong 254
not judged response 254
recording performance 266
scoring multiple interactions on different
HTML page 259
scoring multiple interactions on same
HTML page 257
scoring response 255
tracking number of tries 265
tracking remaining time 264
tracking performance, introduction 251
J
JavaScript
performance tracking 265
performance variables 265
properties 248
Judge Interaction action 227
K
keywords and phrases, checking for 155
Knowledge Track 218
Interaction ID 234
Objective ID 234
Send Objective Info 237
Send Score 238
using 267
Weight 234
Index 309
L
learning-specific actions
introduction 227
Judge Interaction 227
Popup Message 230
Reset Interaction 228
Set Interaction Properties 229
Set Text of Frame 231
Set Text of Layer 232
Set Text of Text Field 233
limiting tries
number of tries 162
time allowed 163
Lotus Pathware 269
Cold Fusion, recording data using 278, 279
collecting data 274
configuring CMI server for 271
connect ing with database 272
creating CMI activity 269
creating data source for 273
defining CMI course 270
identifying student for 274
modifying HTML form using 275
ODCB, using 273
required database files for 272
taking the course 271
M
multiple-choice CourseBuilder Interaction 79
adding image to text choice in 98
changing order of choices in 96
Choices tab 82
creating all-that-apply question in 95
creating multiple-choice question 89
creating true/false question 86
dialog box tabs 82
General tab 81
graphic multiple-choice question 91
naming choice 98
replacing “True” and “False” with
different words 88
templates 80
Tracking tab 81
True/False question 85
N
Name Editor 224
naming
hot area 141
response 153
slider range 211
O
Objective ID 234
ODCB 273
options
Choices tab 287
drag-and-drop interactions 284
Elements tab 289
General tab 281
Hot Areas tab 291
Pairs tab 289
Ranges tab 294
Responses tab 292
Tracking tab 287
Triggers tab 293
overview of CourseBuilder for Dreamweaver 11
310
Index
P
performance
record 266
variables 265
placeholder graphics
replacing any placeholder image 141
replacing background image 141
replacing hot area graphics 141
Popup Message action 230
problems See Troubleshooting
procedures See step-by-step procedures
promoting condition 225
properties 247
Action Manager, adding custom behavior 249
Alignment 240
All That Apply 240
Allow Multiple Selections 240
Correct State 241
Correctness 240
Disabled 241
Expected Value 241
Initial Value 241
Is Toggle 241
Judge On Selection 242
Knowledge Track 242
Known Response 242
Match Case 242
Match Entire Word 243
Original X Position 243
Original Y Position 243
Possible Correct 243
Possible Incorrect 243
Score 244
Selected 244
Snap Back on Incorrect 244
Snap Back on Miss 244
Snaps to 244
Time 245
Time Limit 245
Tolerence 245
Total Correct 245
Total Elements 245
Total Incorrect 245
Tracking Interaction ID 245
Tracking Objective ID 246
Tracking Question Type 246
CourseBuilder Interaction (continued)
Tracking Weight 246
Tries 246
Tries Limit 246
Unknown Correctness 246
Value 246
X Offset 247
Y Offset 247
properties in Action Manager
Current Node 248
Disabled 248
JavaScript 248
Q
quiz
sample, scoring multiple interactions on different
HTML page
displaying student progress 264
introduction 259
setting navigation 260
setting questions 263
setting tracking 260
sample, scoring on same HTML page,
introduction 258
R
random exploration
creating 136
introduction 135
Ranges slider tab 202
replacing
“True” and “False” with different words 88
placeholder graphics
directly in a document 122
using the CourseBuilder Interaction dialog
box 122
Reset Interaction action 228
resetting an CourseBuilder Interaction,
adding button 165
Index
311
response, user
correct 254
incorrect 254
limiting time for 163
limiting tries 162
not judged 254
scoring 255
unanticipated 156
Responses tab 146
S
scoring
correct response 254
CourseBuilder Interaction HTML identifier 257
data tracking 251
displaying feedback 256
incorrect response 254
marking a response right or wrong 254
multiple interactions on different
HTML page 259
multiple interactions on same HTML page 257
not judged response 254
scoring response 255
Send Score 238
tracking user performance 251
weight 234
scoring and tracking data, step-by-step procedures 252
Search, Help 14
segments
adding 218
Build Your Own Template 298
Check Time 296
Check Tries 296
collapsing 225
copying 226
Correctness 296
creating new 219
cutting 226
editing 225
expanding 225
Multiple-choice 297
One-to-Many Matching 298
One-to-One Matching 297
One-to-One Matching (either way) 297
pasting 226
Point Slider 303
Push-button 301
312
Index
segments (continued)
Range Slider 302
renaming 224
Text Entry 301
Timer 301
Timer with Warning 302
Toggle-switch 300
Two-step Procedure 299
Send Objective Infomation 237
Send Score 238
Set Interaction Properties action 229
Set Text of Frame action 231
Set Text of Layer action 232
Set Text of Text Field action 233
setting
preferences 167
slider end value 210
slider range 211
slider start value 210
timer 195
trigger 195
slider 213
slider CourseBuilder Interaction
adding custom graphics in 213
adding range to 212
changing appearance in 210
creating point slider using 208
creating range slider using 205
deleting range in 212
dialog box tabs 201
General tab in 201
introduction 200
naming range in 211
point slider template 207
range slider template 204
Ranges tab in 202
setting end value in 210
setting range in 211
setting start value in 210
templates 200
Tracking tab 201
Action Manager 215
button interactions 176
drag-and-drop CourseBuilder Interaction 104
explore interactions 133
multiple-choice CourseBuilder Interaction 83
scoring and tracking data 252
slider interactions 202
text entry CourseBuilder Interaction 147
timer interactions 187
what’s new 74
structured exploration
creating 139
introduction 138
Support Center 16
support files 68
system requirements
Macintosh 13
Windows 13
T
Table of Contents, Help 14
tabs
Action Manager
General tab 250
Tracking tab 250
button
General tab 175
Tracking tab 175
drag-and-drop
Elements tab 103
Pairs tab 103
Tracking tab 102, 131
explore
Action Manager 132
CourseBuilder Interaction 131
Hot Areas 132
multiple-choice
Choices tab 82
General tab 81
Tracking tab 81
options
Choices 287
Elements 289
Hot Areas 291
Pairs 289
Ranges 294
Responses 292
Tracking 287
Triggers 293
slider
General tab 201
Ranges tab 202
Tracking tab 201
text entry
General tab 145
Responses tab 146
Tracking tab 145
timer
General tab 186
Tracking tab 186
Triggers tab 187
tracking
Action Manager 250
button 175
slider 201
text entry 145
timer 186
tag selector, CourseBuilder Interaction in 69
target element active area 126
technical support 17
template gallery, adding interactions to 170
templates
Action Manager 250
building your own procedure template 120
button
creating 179
introduction 174
push button 178
toggle switch 177
Index
313
drag-and-drop
one-to-many matching 108
one-to-many matching, either way 109
one-to-one matching 106
one-to-one matching, either way 107
two-step procedure 116
two-step procedure with distractor 117
explore
random exploration 135
structured exploration 138
for building custom drag-and-drop 112
multiple-choice
check all-that-apply question 94
graphic multiple-choice 91
introduction 80
True/False question 85
slider
introduction 200
point slider 207
range slider 204
text entry
introduction 144
multiple-line text entry 150
single-line text entry 149
timer
introduction 185
simple timer 189
simple timer template 192
text display options
frame 160
layer 161
text field 161, 162
text entry CourseBuilder Interaction
adding default text to field 153
adding response name 154
changing response name 153
checking capitalization 154
checking for exact match 155
checking for keywords and phrases 155
checking for unanticipated response 156
CourseBuilder Interaction dialog box 145
creating text entry field 151
deleting response name 154
General tab 145
multiple-line text entry template 150
314
Index
naming response 153
Responses tab 146
single-line text entry template 149
templates 144
Tracking tab 145
timer CourseBuilder Interaction
adding custom graphics 198
adding trigger 197
appearance 196
assigning score before timer is reached 198
changing trigger name 196
creating timer 190
creating timer with a warning 193
custom timer 199
deleting trigger 197
dialog box tabs 186
General tab 186
introduction 185
judging response before first trigger 198
naming trigger 196
setting timer 195
setting trigger 195
templates 185
timer template 189
timer with a warning template 192
Tracking tab 186
Triggers tab 187
tracking data, See scoring
Tracking tab 81, 201
transport methods, recording data with 280
trigger
adding 197
changing name 196
deleting 197
judging response before first 198
naming 196
setting 195
True/False question, replacing with different words 88
tutorial, introductory 21
Type field setting 223
U
unanticipated response, checking for 156
URLs, Authorware integration 167
user groups 17
Using CourseBuilder for Dreamweaver book 15
using Lotus Pathware, See Lotus Pathware
V
variables for performance tracking 265
W
Web Player, See Authorware Web Player
web server, required files 76
Weight 234
Index
315

macromedia - LCSHELP Home Page

Transcription

Similar documents

Afni Background Check Process Guide

NTREIS Internet Explorer Settings

XMPlayer Express

Untitled - Brookstone

Monster Jobs - by Carpe Data

Computer Settings For NAUTIKOS

PS Classroom Reports for Teachers_20061026.fm

Go to my.harpercollege.edu and log in with your

Internet Explorer 7 and Internet Explorer 8 Browser Security Settings

1. Go to ezlm.adp.com and click the