Tutorial

Macromedia Authorware 7 provides a powerful environment for creating and presenting

interactive information. Authorware basic features let you develop presentations quickly and
easily, while advanced features offer greater authoring control. You can foster a sensory experience
for your users by incorporating interactions and rich media, such as Macromedia Flash files and
MP3 audio, into your Authorware presentations.
By completing this tutorial you’ll develop the Authorware skills necessary to create interactive
training. When you finish creating the training, you’ll use one-button publishing to play your piece
on the web and prepare it for distribution on a CD.
Specifically, you will learn how to do the following:
• Analyze a completed Authorware piece and set up a new file
• Create a navigational structure using the flowline and icons
• Add multimedia to a piece, including graphics, sound, Flash movie clips, and animation
• Add user interactions
• Import an RTF file while maintaining formatting and a paging structure
• Add models to streamline authoring
• Use and modify Knowledge Objects to create an interactive quiz
• Package the completed piece using one-button publishing
The estimated time it takes to complete each section of the tutorial is noted at the beginning of the
section.

Create a master framework

You can use framework icons to further define the navigation structure. When you set up a framework, you
specify what appears on each page attached to the framework icon. The master framework that you’ll create will
include a Menu button, Quit button, and a background that appears on every page after the introductory
segment.
1.

Drag a framework icon to the Level 1 flowline, below the Introduction icon, and name it
Master Framework.
2. Drag the Main Menu icon to the right of the Master Framework icon.

3. Double-click the Master Framework icon to open its flowline.

The Master Framework flowline is divided into two panes: the Entry pane on top, and the Exit pane on
the bottom. The icons in the Entry pane are default navigation controls.

4. To delete the default icons, select the Gray Navigation Panel icon and Shift-Click the
Navigation Hyperlinks interaction icon; then press Delete.
5. When the alert appears, click Select All Attached Icons.
6. Drag the Title Background icon from the library to the Master Framework flowline.
7. Drag an interaction icon from the Icon palette to the Master Framework flowline, place it
below the Title Background icon, and name it Global Navigation.
Authorware Navigation Tutorial

The course content is broken in Lectures. Each Lecture

(e.g., Basic Probability) corresponds to an Authorware
presentation along with printable web text.
Authorware uses menus. So each Lecture has a menu of
the main ideas in that Lecture.
But these are complex ideas, so sometimes they need to be
broken down into smaller chunks. Authorware therefore
can have menus within menus as you can see in the graphic
below. When you open a menu you may see another menu
with the lecture content chunked down into smaller parts.
For complex ideas this may continue down several
LEVELS, as shown in the graphic. When you are studying,
this is very convenient because it breaks up the material
into small, digestible chunks.

This is an
example of a
Lecture with
lots of levels
(more than is
typical).

This is the
Authorware
Navigation
Panel.
This button
takes you
back up from
a lower level
to a higher
level. We'll
Use the Up Level button to go back to the previous menu.
call it the Up
Level
Button
Let's look at another button on the upper row of
the Navigation Panel
Look at the
button that
has
binoculars
and two The search button does a good job searching for
pages on it. text in Authorware. But it usually screws up
It is the navigation so that you have to close Authorware
Search and restart it to navigate. We don't recommend
button. you use unless you really need to find an idea.
The two farthest left buttons on the top row of the
Navigation Panel have no functionality and we will not
discuss them.

Before we go on to the lower row of the

Navigation Panel, we will discuss Content
Pages and the Continue button.

Eventually, as
you press
menu buttons,
you will come
to Content
Pages.
The graphic
shows a
content page
from Basic
Probability.

Notice that this content page has a Continue

button in the upper right corner.
Many ideas
take several
pages to
develop. The
Continue
button takes The Continue button is not always on the screen.
you to the When it is, be sure to press it. It will take you
next page in toward the completion of the idea you are
the studying.
development
of an idea.
When you
press
Continue on
the previous
page this page
comes up.
Notice that it
has the answer
to the question
asked on the
previous page.
The
Authorware
program
generally gives
you a chance
to solve a
problem on
your own You learn more deeply if you solve problems for
before you see yourself and and afterwards see the answer.
the answer.
Now let's go back and look at the lower row of the
Navigation Panel
Sometimes
(not always)
the final menu
looks like this.
This example
shows a
sequence of
pages (or
screens)
having to do Sometimes we have a special Menu showing a whole
with t-tests. sequence of screens (or pages). The lower row of the
Navigation Panel is very useful when you a sequence of
screens Menu like the one above. Notice that the Menu
above has navigation instructions right on it.

If you clicked
on the first
button on
the Menu
above, you
would see
this
Psychother
apy
Example
page.

When you
have read
and taken
notes about
the
Psychotherap Next page button
y page, press
the Next
button.
The Next
button will
move you to
the next page,
which shows
the results of
the research.
As you can
see, there is a
continue
button, so you
should click it
and continue
on in the idea.

When no
Continue
button is
present, use
the Next
Use the Next button on the Navigation Panel to keep
button to go moving from page to page.
on to the
next page

Look at the bottom row of the Navigation Panel. Starting

from the left, the first button (First Screen)takes you back
to the first page in a sequence. The second button
(Previous) takes you back one page, the third button
(Next) takes you forward one page. The fourth button
(Last Screen) takes you to the last page.

Summary
Authorware breaks up large Lectures into understandable
chunks with menus imbedded within menus.
Sometimes the lowest menu takes you right into the
material.
Sometimes the last menu is a special "Sequence of Screens"
menu as is shown in the graphic below.
 Think of it in three dimensions. The Up button takes up to
the next higher menu.
The Previous and Next buttons move you back and forth
from page to page.
The Continue button takes you deeper into a page until
the idea is fully developed.

Create a new piece

Begin by opening a new file.
1. Select File > New > File.
The New Project dialog box appears, listing Knowledge Objects you can use when you build a piece.
 2. Click None; you’ll use Knowledge Objects later in the tutorial.

The Design window is where you organize how the piece is structured. The label Level 1 in the upper right
corner of the Design window indicates that this flowline shows the overall arrangement of the piece.
1. To save and name the piece, select File > Save. In the File Name text box, type Camera.
2. Browse to your Authorware 7 application folder and save the file in the Tutorial folder.
Authorware appends the A7P extension to the filename, which indicates that this is an Authorware 7 file.
Note: As you complete the tutorial, remember to save your work frequently.

Set properties for the Presentation window

You can set file properties that determine the appearance of the Presentation window, such as the size of the
window and whether or not a title bar and menu will be included.
Size the Presentation window
When selecting the appropriate screen size for the Presentation window, specify a size no larger than the
smallest monitor that you anticipate your audience will use. If you specify a larger size, part of the window
might get cut off on the user’s computer. For this tutorial, you’ll select a 640 x 480 window, a size designed for
most standard monitors.
1. Select Modify > File > Properties.
The Properties inspector displays. If the inspector is collapsed, click its title bar once to expand it.
The settings you enter here affect the entire piece.
2. In the Size pop-up menu, verify that 640 x 480 (VGA, Mac13") is selected.

Specify window options

The piece that you’ll create does not require a menu bar, which includes a File menu with the Quit command, or
a title bar, so you will specify that these items not be included. Additionally, you will configure the Presentation
window to appear centered on the user’s screen.
1. Deselect Title Bar and Menu Bar.
2. Select Center on Screen.

Create a title page

A title page in your piece serves the same purpose as a title page in a book--it indicates what the piece is about
and motivates the user to learn more.
1. To create the title page, drag a display icon, used to display text and graphics, from the
Icon palette to the flowline.
2. To name the icon, type the word Title while the icon is still selected.
3. Double-click the Title display icon.
4. Authorware displays the Presentation window the way you configured it in the Properties
inspector. The Presentation window is the workspace where you place graphics, text, and
other visible objects. Additionally, as you learned when you analyzed the completed
tutorial, in Play mode the Presentation window lets you interact with the piece as a user
would.
5. A toolbox also appears, containing tools for creating text and graphics specifically for the
Title display icon.
Note: To organize your onscreen work area, you can drag dialog boxes, inspectors, the toolbox, and
windows to reposition them.
Create text using the toolbox
You’ll create the text object that will be a title for the piece.
1. In the toolbox, select the Text tool.

2. To change the default font, select Text > Font. Select Arial if it appears on a list of fonts;
otherwise, select Other and select Arial from the pop-up menu. Then click OK.

3. Choosing a font without text selected changes the default font. All text that you create in
this file will default to the font you selected.

4. In the Presentation window, click toward the upper left corner (exact placement isn’t
necessary; you’ll align the text later), and type The World of 35mm Photography.
 The line above the text shows the margin width.
Note: While completing the tutorial, you may find it useful to undo your most recent change by
choosing Edit > Undo.
5. To change the size of the text, select the entire line of text and select Text > Size > 14.
6. To make the text margin narrower, click the small square margin handle (not the dark
triangle) at the right end of the margin line, and drag it toward the end of the word
Photography.

7. To make the text stand out against any color background, verify that it’s still selected and
select Window > Inspectors > Modes. Select Inverse from the Modes palette.

With Inverse, text automatically appears light against dark backgrounds and dark against light
backgrounds.
8. If it is not already closed, close the Modes palette and select Control > Restart to play the
piece from the beginning of the flowline.
Note: As you complete the tutorial, remember to save your work frequently.

Add a graphic background

Adding a consistent background is a way of creating continuity within a piece. Icons for the background are
stored in a library. Libraries are separate files that store content--such as text, graphics, sounds, and digital
movies--in library icons. You can link a library to your piece to use the content within the library.
Open a library
Using libraries has several advantages: you can use the same library icon repeatedly without increasing the size
of your Authorware file, and any changes made to the library file automatically update all library icons in your
piece.
You’ll use a library icon to create the background for your piece’s title page.
1. Select File > Open > Library. Within your Authorware application folder, browse to the
Tutorial folder, select the Graphics.a7l file, and then click Open.
The library contains several icons created for use in this tutorial.
2. Drag the Title Background display icon from the library to the flowline above the Title icon.

When you place an icon from a library onto the flowline, the icon’s title appears in italics.
3. To view the piece in the Presentation window, select Control > Restart. Then select
Control > Pause.
Because you selected the Inverse mode for the text you created, it appears as a contrasting color against
the blue background.
4. In the Presentation window, drag the text that you typed to align it under the Title
Background text.
Pausing play, and then positioning objects in the Presentation window, is a common authoring and
design technique that you’ll use repeatedly.
5. When you finish viewing the piece, select File > Save.
If you’re asked if you want to save the changes you’ve made to the library file, click Yes.
Import graphics
In addition to storing objects in the library, you can use the import feature to embed or link to files. When you
embed a file, it’s stored in your Authorware piece. When you link to the file, Authorware stores the path to the
file, but the file remains external. Linking to external content allows you to change the content and have those
changes reflected in your piece without having to import the content again. When you publish your piece,
Authorware automatically includes the linked external files. You’ll now link to a graphic of a camera for the
title page.
1. Return to the flowline.
Note: If your monitor is small or configured in such a way that you cannot have the Presentation
window open while viewing the Design window, then you’ll need to close the Presentation window by
choosing Control > Stop throughout the tutorial, whenever necessary. To view the Presentation window
from the point in the flowline where you left off, select Control > Play.
2. On the flowline, Shift-double-click the Title display icon to open it.
The Title icon contains only the text you created. If you just double-clicked the icon, you would display
just the title text. By holding Shift as you double-click, you also display the objects displayed last.
 3. Select File > Import and Export > Import Media.
4. In the Import Which File dialog box, browse within your Authorware 7 application folder to
Tutorial/Assets and select Camera1.png.
5. Select Link To File, and then click Import.
Note: If, during the tutorial, you wish to view a list of external files linked to your piece along with their
paths, you can select Window > External Media Browser.
6. Drag the camera to the approximate location shown in the following illustration:

7. With the graphic still selected, select Window > Inspectors > Modes; then select Alpha.
The graphic includes an alpha channel--an effect that creates variable transparency in an
image, which lets you blend the image with images behind it. Upon import, the alpha
channel is maintained, and it becomes visible when you select the Alpha mode.

Note: As you complete the tutorial, remember to save your work frequently.

Add Sound
You can link sound to your piece while also specifying how you want the sound to play. Authorware supports a
variety of sound formats, including MP3 digital audio files.
1. Drag a sound icon from the Icon palette to the flowline, placing it below the Title display
icon.

2. Name the sound icon Camera Sound, and double-click it.

3. In the Sound Icon Properties inspector, click Import and browse within your Authorware 7
application folder to Tutorial/Assets, and double-click Camera.mp3.
4. In the Sound Icon Properties inspector, click the Timing tab. In the Concurrency pop-up
menu, select Concurrent.
When the Concurrency setting is Wait Until Done, the sound file plays completely before advancing to
the next icon on the flowline. When Concurrent is selected, once the sound begins to play, Authorware
immediately advances to the next icon down the flowline.
5. In the Play pop-up menu, verify that Fixed Number of Times appears.
6. In the text box below, type 2 for the number of times the sound will play.
7. Click the Play button in the Sound Ic\on Properties inspector to hear the sound based on
the settings that you specified.
8. Restart and then pause the piece.

Add a Continue button

Pacing is essential in creating an engaging presentation, and pauses offer an effective way of controlling the
pace. You can use the Authorware wait icons to stop the presentation until the user decides to continue.
With the Authorware standard Continue button, you’ll set up a pause as a first step in creating a transition to the
Main Menu.
1. Add a wait icon after the Camera Sound icon on the flowline, and name the icon
Continue.

2. Double-click the icon to open the Wait Icon Properties inspector.

3. Deselect Key Press in the Wait Icon Properties inspector and verify that Show Button is
selected.
When the Key Press option is selected, pressing any key is the equivalent of clicking the Continue
button. When the Key Press option is turned off, the user must click the Continue button to proceed
through the piece.
4. Restart the piece. When the Continue button appears, click it.

Position the Continue button

1. Restart the piece by selecting the Restart button in the Control panel. You can also press 1
on the numeric keypad.
The Num Lock function on the numeric keypad must be turned off for the shortcut to work.
2. Pause the piece by selecting the Pause button in the Control panel, or press 2 on the
numeric keypad.
3. Drag the Continue button to the lower right corner of the Presentation window.
 4. Close the Presentation window by choosing Control > Stop, or press 0 on the numeric
keypad.

Erase content and add transitions

As Authorware plays icons in sequence down the flowline, it displays the contents of each icon in addition to
the contents of the previous icons. You can use erase icons to specify that certain icons do not play.
You’ll add a transition to erase the title page when the user clicks Continue.
1. Drag an erase icon to the flowline and place it below the wait icon.
The erase icon removes the contents of one or more icons--primarily display icons--from the screen.
2. Name the erase icon Erase Title Page.

3. Double-click the Erase icon.

The Erase Icon Properties inspector appears.
You can control the way an item is erased by selecting the transition type. For example, you can make an
item disappear quickly or gradually fade away.
4. On the Erase tab, select the Ellipsis (...) button to the right of the Transition text box.
5. In the Erase Transition dialog box, verify that [Internal] is selected in the Categories
column.
Internal transitions do not require Xtra extensions--external plug-ins that offer additional functionality.
6. In the Transitions column, scroll up and select Fade Out.
7. Verify that .5 appears in the Duration text box and click OK.
Duration indicates the number of seconds the transition will take.
8. To select what you want to erase, verify that Icons to Erase is selected in the Erase Icon
Properties inspector.
9. In the Presentation window, click the camera graphic.
The camera, as well as the text that you typed (because they are both part of the same icon), fade out. In
the Erase Icon Properties inspector, the Title icon appears in the list of icons to erase. Although you are
erasing just one icon here, Authorware lets you create a list of icons to erase.
10.To preview the transition, click the Preview button in the Erase Icon Properties inspector.
Note: As you complete the tutorial, remember to save your work frequently.
Test your work
1. Select Control > Restart to restart the piece, and click the Continue button to see the
entire introductory sequence.
2. Select Control > Stop.

Group icons into a map icon

To organize icons in the Design window, you’ll group them into a map icon. Map icons can hold any number of
other icons, including other map icons. They’re ideal for grouping your piece into logical sections, so it’s easy
to see the entire structure at a glance. This is especially important for large pieces.
1. Click slightly above and to the left of the first icon on the flowline and drag the pointer to
select all the icons on the flowline. Select Modify > Group.
2. In the flowline, name the resulting map icon Introduction.

Color icons
You can change the color of icons to serve a variety of purposes: you might add color to icons that still require
content, for example, or you might make all icons that compose a segment a specific color.
For the tutorial, you’ll change the color of the Introduction map icon to make the level 1 flowline more visible
as you work with multiple Design windows. As you complete the tutorial, you can use a strategy to color icons
that you determine will suit your needs.
1. Verify that the Introduction map icon is still selected.
2. In the Icon panel, select orange from the icon color boxes.

Color icons
You can change the color of icons to serve a variety of purposes: you might add color to icons that still require
content, for example, or you might make all icons that compose a segment a specific color.
For the tutorial, you’ll change the color of the Introduction map icon to make the level 1 flowline more visible
as you work with multiple Design windows. As you complete the tutorial, you can use a strategy to color icons
that you determine will suit your needs.
1. Verify that the Introduction map icon is still selected.
2. In the Icon panel, select orange from the icon color boxes.

Color icons
You can change the color of icons to serve a variety of purposes: you might add color to icons that still require
content, for example, or you might make all icons that compose a segment a specific color.
For the tutorial, you’ll change the color of the Introduction map icon to make the level 1 flowline more visible
as you work with multiple Design windows. As you complete the tutorial, you can use a strategy to color icons
that you determine will suit your needs.
1. Verify that the Introduction map icon is still selected.
2. In the Icon panel, select orange from the icon color boxes.

Color icons
You can change the color of icons to serve a variety of purposes: you might add color to icons that still require
content, for example, or you might make all icons that compose a segment a specific color.
For the tutorial, you’ll change the color of the Introduction map icon to make the level 1 flowline more visible
as you work with multiple Design windows. As you complete the tutorial, you can use a strategy to color icons
that you determine will suit your needs.
1. Verify that the Introduction map icon is still selected.
2. In the Icon panel, select orange from the icon color boxes.

Color icons
You can change the color of icons to serve a variety of purposes: you might add color to icons that still require
content, for example, or you might make all icons that compose a segment a specific color.
For the tutorial, you’ll change the color of the Introduction map icon to make the level 1 flowline more visible
as you work with multiple Design windows. As you complete the tutorial, you can use a strategy to color icons
that you determine will suit your needs.
1. Verify that the Introduction map icon is still selected.
2. In the Icon panel, select orange from the icon color boxes.

Color icons
You can change the color of icons to serve a variety of purposes: you might add color to icons that still require
content, for example, or you might make all icons that compose a segment a specific color.
For the tutorial, you’ll change the color of the Introduction map icon to make the level 1 flowline more visible
as you work with multiple Design windows. As you complete the tutorial, you can use a strategy to color icons
that you determine will suit your needs.
1. Verify that the Introduction map icon is still selected.
2. In the Icon panel, select orange from the icon color boxes.

Color icons
You can change the color of icons to serve a variety of purposes: you might add color to icons that still require
content, for example, or you might make all icons that compose a segment a specific color.
For the tutorial, you’ll change the color of the Introduction map icon to make the level 1 flowline more visible
as you work with multiple Design windows. As you complete the tutorial, you can use a strategy to color icons
that you determine will suit your needs.
1. Verify that the Introduction map icon is still selected.
2. In the Icon panel, select orange from the icon color boxes.

Color icons
You can change the color of icons to serve a variety of purposes: you might add color to icons that still require
content, for example, or you might make all icons that compose a segment a specific color.
For the tutorial, you’ll change the color of the Introduction map icon to make the level 1 flowline more visible
as you work with multiple Design windows. As you complete the tutorial, you can use a strategy to color icons
that you determine will suit your needs.
 1. Verify that the Introduction map icon is still selected.
2. In the Icon panel, select orange from the icon color boxes.

Color icons
You can change the color of icons to serve a variety of purposes: you might add color to icons that still require
content, for example, or you might make all icons that compose a segment a specific color.
For the tutorial, you’ll change the color of the Introduction map icon to make the level 1 flowline more visible
as you work with multiple Design windows. As you complete the tutorial, you can use a strategy to color icons
that you determine will suit your needs.
1. Verify that the Introduction map icon is still selected.
2. In the Icon panel, select orange from the icon color boxes.

Objectives
After adding a main menu and navigation, you will know how to do the following:
• Create a menu with hot spots
• Insert map icons as structural placeholders
• Create a framework to ensure consistency
• Use a calculation icon to end a session
• Use the Quit function

Add graphics to the segment

1. On the flowline, add a map icon after the Introduction icon and name it Main Menu.

2. Double-click the Main Menu map icon to open it.

When you open the map icon, the label in the upper right corner of the Main Menu flowline window
says Level 2, indicating that this flowline is a subset of the Level 1 flowline.
3. Drag the Lesson Title Background icon from the library to the Main Menu flowline.
4. On the Main Menu flowline, add a display icon below Lesson Title Background and name it
Lesson Title. Then double-click the Lesson Title icon to open it.
5. To import the camera graphic for this segment, select Import and Export > Import Media
and browse within your Authorware 7 application folder to Tutorial/Assets.
6. Select Camera2.png, and then select Link to File and click Import. For the moment, it
doesn’t matter where, in the Presentation window, the camera graphic appears.
7. With the graphic still selected, use the Modes palette to select Alpha. (If the Modes palette
is not open, select Window > Inspectors > Modes.)

Align objects in the Presentation window

Once you’ve created and imported objects appearing in the Presentation window, you’re ready to start and
pause your piece to adjust how the objects are aligned.
Use flags to view segments of your piece
As your file grows, you’ll often find it more efficient to run specific segments of your piece rather than running
the entire piece from the beginning of the flowline. You can use start and stop flags to run just the section on
which you’re working.
1. From the Icon palette, drag a start flag to the beginning of the Main Menu flowline.

2. To restart the piece from the start flag, do one of the following:
○ Select Control > Restart from Flag.

Click the Restart from Flag button in the toolbar.

Align the graphics

1. Pause the piece.
2. In the Presentation window, verify that the Lesson Title Background dark rectangle
appears in the correct location, as shown in the following illustration. Drag the camera
graphic to the approximate location shown in the following illustration:

Note: In addition to dragging an object in the Presentation window to place it, you can use the arrow
keys on your keyboard to "nudge" a selected object one pixel at a time in the direction of the arrow.
Add menu items
Menus provide both a point of departure and a point of return for your user. By using interaction and navigation
icons, you can easily create a branching flowline that allows a user to follow nonlinear sequences, and a
navigational structure that includes hot spots the user can click to go to another segment.
1. On the Main Menu flowline, add an interaction icon below Lesson Title and name it
Select a Topic.
An interaction icon not only lets users interact with a piece; it also behaves like a display icon by
showing graphics and text in the Presentation window.
You’ll attach icons to this interaction that compose the Main Menu.
2. Double-click the Select a Topic icon to open it, and select the Text tool from the toolbox.
3. In an earlier section, you changed the default text to Arial. Use the Text menu to verify
that Arial is still the selected font. For the text size, select 14 point, and select Bold for the
style.
4. If the Modes palette isn’t open, select Window > Inspectors > Modes. Select Inverse and
close the Modes palette.
5. Click near the upper left corner of the Presentation window and type Main Menu, then
press Enter three times.
6. Select Text > Size and select 10 point.
7. In the Presentation window, type 1. Photographic Terminology, and press Enter twice.
8. Type 2. Parts of a Camera, and again press Enter twice.
9. Type 3. Take Some Pictures, and press Enter twice.
10.Type 4. Camera Quiz.
11.Click the square text margin handle (not the dark triangle) at the right end of the margin
line, and drag it toward the end of the word Terminology.

Set the navigational structure

You’ve defined the graphic and text elements for your main menu.You’re now ready to define the response: the
action the user takes. Later in the tutorial, you’ll define the result of that action. For menu items, the expected
response is that the user clicks the menu text. The result is that the linked text takes the user to the
corresponding segment.
1. On the Main Menu flowline, place a navigate icon to the right of the Select a Topic icon.
2. In the Response Type dialog box, select Hot Spot, and click OK.

The Response Type dialog box lets you select how your user will interact with an object.
3. On the Main Menu flowline, name the unlinked navigate icon Navigate to Terminology.

4. On the Main Menu flowline, double-click the response symbol above the Navigate to
Terminology icon.
The response symbol offers access to the Response Properties dialog box, where you can configure
settings for the response type.
5. On the Hot Spot tab of the Response Properties dialog box, in the Size text boxes, specify
196 for the pixel width of the hot spot (under the X) and 30 for the pixel height (under the
Y).
You do not need to enter values in the Location text boxes, because you will set the location of the hot
spots directly in the Presentation window.
6. In the Keys text box, type 1.
The 1 indicates that the user can either type 1 or click the hot spot to select the first menu item.
7. Select Highlight on Match.
This causes the selection to highlight when the user clicks it.
8. To display a pointing finger when the user rolls over the hot spot, click the Ellipsis (...)
button to the right of the Cursor text box. In the Cursors dialog box, scroll down and
double-click the pointing finger.

Add and configure the remaining navigation icons

1. Place another navigation icon on the Main Menu flowline to the right of the Navigate to
Terminology icon, and name it Navigate to Parts of Camera.
 2. Double-click the response symbol above the Navigate to Parts of Camera icon. On the Hot
Spot tab, type 2 in the Keys text box.
The settings you specified for the Navigate to Terminology hot spot are now the default response type
settings, including the pointing finger cursor.
3. Place two more navigation icons to the right of the others, and name them Navigate to
Take Pictures and Navigate to Quiz, respectively.

4. Double-click the response symbol for Navigate to Take Pictures, type 3 in the Keys text
box.
5. Double-click the response symbol for Navigate to Quiz, type 4 in the Keys text box.

Place hot spots on the Main Menu

You can view the hot spot areas in the Presentation window, and place them over the text that you wish to link.
1. Select Control > Restart from Flag; then select Control > Pause.

2. Taking care to avoid dragging the sizing handles, drag the menu text within the Lesson
Title Background shaded rectangle to place it, as shown in the following illustration:

3. Drag each of the four hot spots to their corresponding menu selections.
For example, drag the Navigate to Terminology hot spot object to the text that reads 1. Photographic
Terminology.
Although you have the hot spots in place, they are not yet linked to other segments in your piece. As you
complete a segment, such as adding photographic terminology or the camera quiz, you’ll link it to the Main
Menu.

Create a master framework

You can use framework icons to further define the navigation structure. When you set up a framework, you
specify what appears on each page attached to the framework icon. The master framework that you’ll create will
include a Menu button, Quit button, and a background that appears on every page after the introductory
segment.
1. Drag a framework icon to the Level 1 flowline, below the Introduction icon, and name it
Master Framework.
2. Drag the Main Menu icon to the right of the Master Framework icon.

3. Double-click the Master Framework icon to open its flowline.

The Master Framework flowline is divided into two panes: the Entry pane on top, and the Exit pane on
the bottom. The icons in the Entry pane are default navigation controls.
To delete the default icons, select the Gray Navigation Panel icon and Shift-Click the Navigation
Hyperlinks interaction icon; then press Delete.
4. When the alert appears, click Select All Attached Icons.
5. Drag the Title Background icon from the library to the Master Framework flowline.
6. Drag an interaction icon from the Icon palette to the Master Framework flowline, place it
below the Title Background icon, and name it Global Navigation.

Add a Menu button

A menu button in your piece gives users the option of returning to the Main Menu at any point after playing the
introduction.
1. Drag a map icon to the right of the Global Navigation icon on the Master Framework
flowline.
2. In the Response Type dialog box, verify that Button is selected, and click OK.
3. On the Master Framework flowline, name the map icon Menu.

4. Double-click the Menu response symbol. Click Buttons and verify that the button with the
description Standard Windows Button System is selected. Click OK.
5. In the Response Properties inspector, click the Ellipsis (...) button to the right of the Cursor
text box. Select the pointing finger in the Cursors dialog box. Then click OK.

Add the navigation for the Menu button

You’ll now specify that the Menu button return users to the Main Menu.
1. On the Master Framework flowline, double-click the Menu map icon.
 2. Drag a navigate icon to the Menu flowline, and name it Navigate to Main Menu.
3. In the Navigate Icon Properties inspector, verify that Anywhere appears in the Destination
pop-up menu and Master Framework in the Framework pop-up menu.
4. In the Page list, select Main Menu to link the Menu button to the Main Menu.

5. Close the Menu flowline.

Add a Quit button

Once your users enter an application, you don’t want them to feel trapped within. A Quit button offers users a
way of exiting the application or, if they’ve clicked the button in error, a way of returning to the Main Menu.
1. On the Master Framework flowline, add a map icon to the right of the Menu icon, and
name it Quit.

2. Double-click the Quit icon. Add an interaction icon to the Quit flowline and name it Exit
the Program.

3. Double-click the Exit the Program icon. Select the Text tool in the toolbox and type,
anywhere in the Presentation window, Are you sure you want to exit the Camera
Tutorial?

The user will see this text after clicking the Quit button and will then have the option of clicking a Yes or
No button.
4. If the Modes palette is not open, select Window > Inspectors > Modes. Verify that Inverse
is selected, then close the Modes palette.
5. Select Control > Stop or press 0 on the numeric keypad to close the Presentation window.
As you learned earlier in the tutorial, the Num Lock function on the numeric keypad must be turned off
for the shortcut to work.

Add a main menu and navigation

You’ll now build an interaction that serves as a main menu. You can continue using the Camera.a7p file you
created in the previous section, or you can open the Camera2.a7p file included in the Tutorial subfolder of your
Authorware 7 application folder.
If you do open the Camera2.a7p start file, immediately select File > Save As and save the file with a new name
to maintain an unmodified version for future use.
This section of the tutorial takes approximately 45 minutes to complete.

How an interaction works

In Authorware the structure of an interaction looks like this:

Take a look at the four main components: the interaction icon, the response type symbol, the result icon, and the
result path. Notice that you can have more than one response type symbol–result icon pair attached to an
interaction icon.
To create an interaction, you drag an interaction icon to the flowline and use it as the foundation of the
interaction structure. You build the structure by attaching icons to the interaction icon. Each icon you attach is
called a result icon. For each result icon you set up a response type symbol. The response type symbol gives
users a way to interact, and it defines the target response that directs the flow down the result path to the result
icon. The result path also determines where Authorware goes when it leaves the result icon.
The interaction icon The interaction icon works in part like a display icon: It displays the buttons, menus, text-
entry fields, and other elements that allow users to respond to an interaction. You also use it to:
• Display text and graphics that you want to appear throughout an interaction
• Control such things as whether Authorware displays the text and graphics with a
transition, where it positions them, which layer it places them in, and when it erases them
• Set whether Authorware erases the screen at the end of an interaction and whether it
uses a transition
Most important, however, the interaction icon monitors the actions of the user and sends that
information to the response type symbols attached to it.
The response type symbol The response type symbol gives users a way to interact. The response type symbol
you select tells the interaction icon whether to display a button, a menu, a text-entry field, or some other
element.

Response types and the symbols associated with them

Sometimes you may want to interact not just with users but with circumstances and events. So Authorware
provides two other ways to use the response type symbol. One is to use it to track and react to circumstances
that are part of the interaction. For example, you can set up a response type symbol to keep track of time and to
react if a user doesn’t respond within some limit you set. You can also use the response type symbol to track and
react to events produced by other components embedded in an Authorware piece, such as an ActiveX pop-up
menu or calendar control. For example, you can set up a response type symbol that reacts when the date
changes.
Once you’ve set up a response type symbol to allow a user (or a circumstance or an event) to interact with
Authorware, you use the response type symbol to define the target response. Sometimes that’s easy (the target
response for a button, for instance, is a user’s clicking it). Sometimes it’s much more difficult than it might
seem. Consider, for example, a text-entry field. Suppose you want a user to respond to a question by typing the
correct answer. How do you treat a word that’s misspelled (sattellite, instead of satellite), or a synonym (moon,
instead of satellite), or an extra word such as a or the, or an answer that’s so wrong it’s impossible to predict?
What if you want a number and a user types text? How do you deal with all the numbers that are too large or too
small? Authorware has a way of dealing with all those possibilities, but it means anticipating them and setting
up target responses to handle them.
As you can guess, most interaction icons have more than one response type symbol attached to them. In some
cases the response type symbols represent nothing more than options--the choices on a menu, for example. In
other cases, they represent correct and incorrect answers. For that reason, you also use the response type symbol
to indicate whether a user’s response is right or wrong.
Two final things you do with the response type symbol are related to the result icon: You use it to tell
Authorware when to erase any text or graphics displayed by the result icon and to direct the flow after
Authorware leaves the result icon.
The result icon The content of the result icon--the icon that’s attached to the response type symbol--determines
what happens when Authorware detects the response type symbol’s target response. You can use any icon on the
palette as the result icon, but it’s best to use a map icon because it’s the most flexible. You can add and remove
icons from a map icon easily as you construct the result of the interaction.
The result path The result path determines where the flow is directed after Authorware exits the result icon.
Typically, you direct the flow to the next response type symbol, back to the interaction icon, or out of the
interaction to the next icon on the flowline.

Adding text or graphics to an interaction icon

If you want text or graphics to appear only during an interaction--that is, if you want a question, a
prompt, or an image to appear as soon as a user enters the interaction, to remain on the screen
throughout the interaction, and to be erased automatically when the user leaves the interaction--
add the text and graphics to the interaction icon just as you would to a display icon.
Make sure that if you’re setting up an interaction that uses a hot object or one that allows a user to
drag an object to a target area, you put the object in a display icon that comes before the
interaction icon.
You create, import, and link text and graphics just as you do with a display icon.

Automatic erasing
You can always use an erase icon to erase any text or graphic that appears in the Presentation
window. The interaction icon, however, has two sets of options that you can use to have
Authorware erase text and graphics displayed in an interaction automatically:
• The Erase options on the Interaction tab in the Interaction Properties dialog
box let you select when you want Authorware to erase text and graphics
displayed by the interaction icon. (There’s another setting on the same tab
that you can use to select a transitional effect when the text and graphics are
erased.)
• The Erase options on the Response tab of each response type’s Properties
dialog box let you select when you want Authorware to erase text and
graphics displayed by a result icon.
If you want to prevent automatic erasing from affecting a specific icon (say, an icon inside a map
that’s attached to a response type symbol), you can use the Prevent Automatic Erase setting. It’s
located on the Display tab in both the Interaction Properties dialog box and the Display Icon
Properties dialog box. Be careful using this option because you will need to erase the icon
explicitly when you no longer want it in the Presentation window.
Perpetual interactions--interactions that are always available in the background when a user is
doing something else--have a special set of rules for erasing that Authorware follows. For
information about those rules, see Perpetuals and Return branching.
How an interaction works
In Authorware the structure of an interaction looks like this:
Take a look at the four main components: the interaction icon, the response type symbol, the
result icon, and the result path. Notice that you can have more than one response type symbol–
result icon pair attached to an interaction icon.
To create an interaction, you drag an interaction icon to the flowline and use it as the foundation of the interaction
structure. You build the structure by attaching icons to the interaction icon. Each icon you attach is called a result icon. For
each result icon you set up a response type symbol. The response type symbol gives users a way to interact, and it defines
the target response that directs the flow down the result path to the result icon. The result path also determines where
Authorware goes when it leaves the result icon.
The interaction icon The interaction icon works in part like a display icon: It displays the buttons, menus, text-entry
fields, and other elements that allow users to respond to an interaction. You also use it to:
• Display text and graphics that you want to appear throughout an interaction
• Control such things as whether Authorware displays the text and graphics with a
transition, where it positions them, which layer it places them in, and when it erases them
• Set whether Authorware erases the screen at the end of an interaction and whether it
uses a transition
Most important, however, the interaction icon monitors the actions of the user and sends that information to the
response type symbols attached to it.
The response type symbol The response type symbol gives users a way to interact. The response type symbol you select
tells the interaction icon whether to display a button, a menu, a text-entry field, or some other element.
Response types and the symbols associated with them

Sometimes you may want to interact not just with users but with circumstances and events. So Authorware provides two
other ways to use the response type symbol. One is to use it to track and react to circumstances that are part of the
interaction. For example, you can set up a response type symbol to keep track of time and to react if a user doesn’t
respond within some limit you set. You can also use the response type symbol to track and react to events produced by
other components embedded in an Authorware piece, such as an ActiveX pop-up menu or calendar control. For example,
you can set up a response type symbol that reacts when the date changes.
Once you’ve set up a response type symbol to allow a user (or a circumstance or an event) to interact with Authorware,
you use the response type symbol to define the target response. Sometimes that’s easy (the target response for a button, for
instance, is a user’s clicking it). Sometimes it’s much more difficult than it might seem. Consider, for example, a text-
entry field. Suppose you want a user to respond to a question by typing the correct answer. How do you treat a word that’s
misspelled (sattellite, instead of satellite), or a synonym (moon, instead of satellite), or an extra word such as a or the, or
an answer that’s so wrong it’s impossible to predict? What if you want a number and a user types text? How do you deal
with all the numbers that are too large or too small? Authorware has a way of dealing with all those possibilities, but it
means anticipating them and setting up target responses to handle them.
As you can guess, most interaction icons have more than one response type symbol attached to them. In some cases the
response type symbols represent nothing more than options--the choices on a menu, for example. In other cases, they
represent correct and incorrect answers. For that reason, you also use the response type symbol to indicate whether a
user’s response is right or wrong.
Two final things you do with the response type symbol are related to the result icon: You use it to tell Authorware when to
erase any text or graphics displayed by the result icon and to direct the flow after Authorware leaves the result icon.
The result icon The content of the result icon--the icon that’s attached to the response type symbol--determines what
happens when Authorware detects the response type symbol’s target response. You can use any icon on the palette as the
result icon, but it’s best to use a map icon because it’s the most flexible. You can add and remove icons from a map icon
easily as you construct the result of the interaction.
The result path The result path determines where the flow is directed after Authorware exits the result icon. Typically,
you direct the flow to the next response type symbol, back to the interaction icon, or out of the interaction to the next icon
on the flowline.

Ways to interact
You can give users any of five different ways to interact:
• Click a button, a hot spot, or a hot object
See:
Buttons--step-by-step procedures
Hot spots--step-by-step procedures
Hot objects--step-by-step procedures
• Select an item from a pull-down menu
See Pull-down menus--step-by-step procedures.
• Enter text
See Text entry--step-by-step procedures.
• Press a key
 See Keypress responses--step-by-step procedures.
• Drag an object to a target
See Target areas--step-by-step procedures.
You can also track and react to the following circumstances during an interaction:
• The number of tries a user has made
See Tries limit--step-by-step procedures.
• The amount of time that has elapsed since the interaction began
See Time limit--step-by-step procedures.
• Any condition that can be true or false
See Conditional responses--step-by-step procedures.
Finally, you can track and react to events produced by components such as ActiveX controls embedded in an
Authorware piece. For more details, see Events--step-by-step procedures.
Each of these ways of interacting is easy to set up with a response type symbol.

Buttons--step-by-step procedures
What you can do For instructions, see

Set up a button Setting up a button,Show Me: Button Interaction

(Q_button.a7p)

Adjust the size and position of a button Resizing or repositioning a button quickly, Resizing
or repositioning a button precisely

Use a custom button, check box, Selecting a check box, a radio button, or a custom
or radio button button

Provide a key that a user can press Assigning a shortcut key to a button
instead of clicking the button

Make a button active in the background Setting up a button that’s always available

Make a button active only under Limiting when a button is active

certain conditions

Hide or dim a button when it’s not Hiding or dimming an inactive button
active

Make a button the default Making one button the default

Mark a button as a right or wrong Marking a response right or wrong

answer

Limit the time a user has to click the Putting a time limit on an interaction
correct button

Limit the number of tries a user has to Limiting the number of tries
click the correct button

Create or edit a custom button Creating a custom button, Editing a custom button

Create a collection of custom buttons Creating a custom button collection

Setting up a button
To set up a button:
1. Drag an interaction icon to the flowline and title it.
See Adding text or graphics to an interaction icon and Setting interaction icon properties.
2. Drag an icon to the right of the interaction icon.
An icon attached to an interaction icon is called a result icon. The result icon determines
what happens when a user clicks the button. It’s a good practice to use a map icon as the
result icon because that makes it easy to make changes. You can use any icon as the result
icon; you must, however, place interaction, framework, sound, digital movie, and decision
icons inside a map icon.
3. Select Button in the dialog box and click OK.
The Response Type dialog box appears automatically whenever you place a result icon to
the immediate right of the interaction icon. If you place a result icon to the immediate right
of another result icon, Authorware doesn’t display the dialog box because it assumes that
you want to use the same symbol you last chose. If the Response Type dialog box doesn’t
appear automatically and you want to change the response type, double-click the response
type symbol to display it. For more information, see Response Type.
4. Select the result icon and name it.
A response type symbol and the result icon attached to it form a single unit and share a title.
If you use one of the standard buttons from the Button Library dialog box, Authorware also
uses the title as the button’s label. You can also set up a custom button so that Authorware
uses the title you type as its label.
Double-click the button response symbol, click the Response tab, and select the Erase and
Branch options. Click OK.
Authorware automatically gives a button the same characteristics (such as the same Erase,
Status, and Branch options) as the button immediately preceding it. For example, if you
create buttons 1 and 2, modify button 1, and then create button 3, button 3 takes on the
characteristics of button 2. It doesn’t take on the characteristics of the last modified button,
button 1. Create a button immediately to the left of the button that has the characteristics
you want. Reposition the button after you create it.
5. Set up the result icon.
See also
• Button Response Properties
• Creating a custom button
• Selecting a check box, a radio button, or a custom button
• Resizing or repositioning a button quickly
• Resizing or repositioning a button precisely
• Assigning a shortcut key to a button
• Changing the result icon
• Making one button the default
• Setting up a button that’s always available
• Hiding or dimming an inactive button
• Limiting when a button is active
• Limiting the number of tries
• Time limit interactions
• Checked*
Add a Continue button
Pacing is essential in creating an engaging presentation, and pauses offer an effective way of controlling the
pace. You can use the Authorware wait icons to stop the presentation until the user decides to continue.
With the Authorware standard Continue button, you’ll set up a pause as a first step in creating a transition to the
Main Menu.
1.

Add a wait icon after the Camera Sound icon on the flowline, and name the icon
Continue.

2. Double-click the icon to open the Wait Icon Properties inspector.

3. Deselect Key Press in the Wait Icon Properties inspector and verify that Show Button is
selected.
When the Key Press option is selected, pressing any key is the equivalent of clicking the Continue
button. When the Key Press option is turned off, the user must click the Continue button to proceed
through the piece.

4. Restart the piece. When the Continue button appears, click it.

Framework icon
The framework icon provides an easy way to set up navigation in an Authorware piece. A set of navigation
controls is built into the framework icon so that users can move among the icons you’ve attached to it.
An icon attached to a framework icon is called a page. A page isn’t limited to a display icon containing text and
graphics. It can also be a digital movie, a sound, or an animation. In fact, if you use a map icon, you can make
the page as complex as you want. It can contain an interaction, a decision, another framework icon with its own
navigation structure, or any combination of icons you want to arrange on the flowline.
Use the Framework window to set up icons that Authorware executes when entering or exiting a navigation
framework.
To display the Framework Icon Properties dialog box, Alt-double-click the framework icon. See Framework
Icon Properties.

Framework Icon Properties

Use the Framework Icon Properties dialog box to view information about a framework.

Framework Icon Properties

Use the Framework Icon Properties dialog box to view information about a framework.
Preview
The Preview box shows a preview of the elements in the entry pane of the framework. Typically this includes a
background graphic and buttons.
Open
Click Open to open the Framework window.
Page Transition
Click the transition button (...) to select a transition to use when moving between pages. The Transitions dialog
box appear

Framework window
The framework window is divided into an entry pane and an exit pane.
When Authorware enters a framework icon, it executes any icons in the entry pane before going
to the first page of the framework. As Authorware exits the framework, it executes icons in the
exit pane.

To adjust the relative sizes of the entry and exit panes, drag the black rectangle on the right side of the dividing
line.
Entry pane Use the entry pane to set up icons that should affect every page of the framework. The entry pane
contains default navigation controls, and the buttons associated with those controls appear on every page.
You can delete the navigation controls, modify them, or add others to suit your needs. Double-click a response
symbol in the Framework window to open the Button options for that response type.
You can also use the entry pane to add display icons that contain text or graphics, to add sounds or animations
for every page, or to set up calculation icons that affect the entire framework. For example, you could set up a
custom variable that collects information as the user goes through the pages.
Exit pane Authorware normally erases any displayed objects and ends any perpetual interactions when it exits a
navigation framework. You can use the exit pane to set up other events that you want to happen when
Authorware exits the framework. For example, you could add an interaction that asks users if they really want
to quit, or you could use a display icon to display a message. By embedding a variable in a display icon, you
could also display information collected while the user was navigating within the framework, such as a score.
Set up the exit pane so that Authorware resets the values of any variables to their original values. In this way
you can "clean up" after the user and always know the state and values of the piece.

Variables and functions related to framework icons

The following system variables and functions are useful when working with framework icons and navigation.
Variables
Variable Description

CallStackText Lists the connections between two icons set up as a call.

CalledFrom Indicates the Icon ID of the origin of a call.

CurrentPageID Indicates the Icon ID of the last page displayed within a framework icon.

CurrentPageNu Indicates the page number of the current page in the specified framework
m icon.

MatchCount Indicates the number of times FindText found a particular word or phrase.

PageCount Indicates the number of pages attached to the specified framework icon.

Functions
The following Framework category functions mostly perform tasks associated with text searches and with
displaying the pages the user has seen.
Function Description

FindText Searches for specified text; you can limit the search.

GetTextContai Returns the word or phrase in a particular match located by FindText; it can
ning also return some context for the match.

PageFoundID With FindText, determines the ID of the icon that contains a match.

PageFoundTitl With FindText, determines the title of the icon that contains a match.
 e

PageHistoryID Returns the ID of the nth previously displayed page.

PageHistoryTitl Returns the title of the nth previously displayed page.

e

PurgePageHist Erases the page history.

ory

PageContainin Returns the Icon ID of the specified page’s parent.

g

Replacing Authorware's File pull-down menu

Sometimes you may want to change Authorware's File pull-down menu and Quit option to something else, or eliminate it
completely. When you have the Menu bar option in the File Setup dialog box selected, Authorware always includes the
File menu item. To change it to something else, you must first recreate the menu item on the flowline and then erase it
with an Erase icon..
Creating a File pull-down menu item is easy:
1 First, open a new Authorware file, and drag an Interaction icon to the flowline.
Title the Interaction icon "File".
2 Drag a map icon to the right of it.

3 Select the pull-down menu response type and click OK. Title the map icon
"Quit".
4 Once you're back at the flowline, double-click on the pull-down menu response
type next to the interaction icon. Turn on Perpetual in the Scope checkbox, and
change Try Again branching to Exit Interaction or Return.
Turning on Perpetual and setting the branching to Exit Interaction or Return will
enable Authorware to continue down the flowline.
You have now created a dummy File pull-down menu with the Quit option.
To erase the menu you just created, do the following:
1 Drag an Erase icon after the interaction icon on the flowline.
2 Run the course. The presentation window will open and show you the File pull-
down menu. The erase icon dialog box should open as well. .
3 Just as you would with any other object you want to erase, click on the File pull-
down menu. The menu should disappear from the menu bar and should also
appear in the Erase icon dialog box as an object that you want erased.
Next, we want to create our new pull-down menu:
1 Return to the flowline (Ctrl+J).
2 Drag an interaction icon after the Erase icon and name it: Course.

3 Drag a calculation icon to the right of the Interaction icon.

4 Select the pull-down menu response type and hit OK. Name the calculation
icon: I'm done.
5 Run the file (Ctrl+R).
Next, we want to create our new pull-down menu:
1 Select the Course pull-down menu. The menu item should be "I'm done".
2 Select "I'm done" and an empty calculation icon will open.

3 Type in Quit() inside the calculation icon in order to exit the course when that
pull-down option is selected.
You can also use this method if you want to add some features to the quit operation. For example, if you want to have a
sound play or display a graphic when the user quits, you can add a sound icon and a display icon in a map icon that gets
executed when the user selects the Quit pull-down menu.