Building an example-tracing tutor for fraction addition

Last updated July 11, 2016

Table of Contents

Note: You can follow this tutorial with either the HTML, Flash, or Java version of fraction addition included with CTAT.

Prerequisites:

  • CTAT 3.0+
  • For HTML version of fraction addition:
    • Student interface: The HTML code for an example interface is available for download here.
    • Click on the Raw button, then save the browser page to a directory in your CTAT Workspace (e.g., <user>\ctatworkspace\FractionAddition\FractionAddition.html).
  • For Flash version of fraction addition:
    • Flash Player 17+
    • Student interface:
      {CTAT}\Projects\FlashFractionAddition\fractionAddition.swf
  • For Java version of fraction addition:
    • Student interface:
      {CTAT}\Projects\FractionAdditionTutor\FractionAddition.class

Note: If you have built your own Fraction Addition interface by following the steps in Building a student interface for fraction addition (Flash) or Building a student interface for fraction addition (Java) you can use your own interface.

1. Introduction

In this tutorial, you will use a completed student interface and CTAT's Behavior Recorder to author an Example-tracing Tutor for the fraction addition problem 1/4 + 1/6. You will author the tutor by demonstration, without programming. As an optional step, you can convert your tutor into a quiz, in case you want to just assess student knowledge and not to also teach the student in the domain of instruction: in a quiz, the tutor's feedback to the student is suppressed.

An Example-tracing Tutor is primarily composed of a student interface (CTAT supports HTML, Java, and Flash student interfaces created with our tools) and a Behavior Recorder graph (BRD file) that stores data on the current problem. Multiple BRDs (problems) are often used with a single student interface.

When authoring an Example-tracing Tutor, both the student interface and CTAT must be running, as they communicate with one another during the authoring process.

2. Run the student interface and CTAT

The first step in authoring an Example-tracing tutor is to open both the student interface and CTAT. For this, you have a choice between HTML, Java, and Flash student interfaces: run either CTAT for Java or CTAT for HTML and Flash.

To open a Flash student interface for fraction addition:

  1. Open a web browser, and drag the fraction addition interface SWF listed above onto the browser window. (Alternatively, if you have the Flash IDE, you can use it to open the SWF.)
  2. Launch CTAT for HTML and Flash.
  3. Position the CTAT window and Flash student interface so that both windows are visible (see below).

Note: If Flash presents a security warning, modify the security settings as described here. This will enable the Flash student interface to communicate with CTAT.

Launching both the Flash student interface and the Behavior Recorder for HTML and Flash

Figure 1. Positioning the Flash student interface for fraction addition and 'CTAT for HTML and Flash' side-by-side.

To open an HTML student interface for fraction addition:

  1. Launch CTAT for HTML and Flash.
  2. Select File > Launch HTML Interface. Locate and open the fraction addition interface HTML file; the interface will open in your browser.
  3. Position CTAT and the HTML fraction addition interface so that both windows are visible.

Note: You must open the HTML student interface using the Launch HTML Interface menu option in the tools. This will enable the HTML student interface to communicate with CTAT.

Launching both the HTML student interface and the Behavior Recorder

Figure 2. Positioning the HTML student interface for fraction addition and 'CTAT for HTML and Flash' side-by-side.

To open a Java student interface for fraction addition:

  1. Launch CTAT for Java.
  2. Select File > Open Student Interface. Locate and open the fraction addition interface CLASS file
    {CTAT}\Projects\FractionAdditionTutor\FractionAddition.class.
  3. Position CTAT and the Java fraction addition interface so that both windows are visible (see Figure 3 below).

Launching both the Java student interface and the Behavior Recorder

Figure 3. Positioning the Java student interface for fraction addition and 'CTAT for Java' side-by-side.

3. Create a start state

Once your interface is running and connected to the Behavior Recorder, the next step is to create the initial problem state, or "start state". In your student interface, enter the two fractions 1/4 and 1/6 in the Given Fractions column.

To make this state the start state for the given problem, select Graph > Create Start State in the Behavior Recorder. When prompted for a start state name, enter 1-4+1-6, and click OK. You should now see your start state in the Behavior Recorder as a new node titled "1-4+1-6".

Graph start state

4. Demonstrate Solutions

After creating a start state, demonstrate correct and alternate answers, as well as common errors, that students might make for this problem. The Behavior Recorder will record the demonstrated behavior in the form of a "behavior graph".

Ensure that CTAT's Author Mode is set to Demonstrate (see below). Then demonstrate a correct solution to the problem. The Behavior Recorder records each demonstrated step as a 'link'—the line connecting two nodes—in its graph. In the graph, actions are represented by links, while states are represented by nodes.

Author Mode is set to Demonstrate.

One solution path demonstrated.

You can demonstrate an alternative solution path—one which is correct but not preferred—by clicking on the start state node in the behavior graph, and demonstrating the solution steps for that path. For 1/4 +1/6, you might demonstrate a solution where the student multiplies the denominators to get a common denominator of 24. This solution is valid, but not preferred, as '24' is not the least common denominator. Preferred paths in the graph show thick lines for edges, while unpreferred paths show a thin line.

An alternate solution path demonstrated.

If you forget to include a solution step, click on the node that precedes that step (you'll see the student interface update to reflect the state of that node), then demonstrate your step.

Tip: It is good practice to include a Done action at the end of each path in your behavior graph for two reasons: first, it is part of a cognitive skill to know when a problem is solved; second, when you create a curriculum consisting of a series of problems, the Done action, when accepted by the tutor, is a signal to present the next problem.

5. Annotate solution steps

5.1 Incorrect steps

Now you will demonstrate an incorrect step in the problem, so that the tutor will be able to recognize this error when it is performed by students. In general, any student input that is not recognized by the tutor is marked as incorrect; but by defining incorrect steps in the graph, the tutor will be able to provide a customized error feedback message for the specified input.

For the current simple problem, we will focus on the error (presumed to be common by students who have not yet mastered fraction addition) of adding the two denominators of dissimilar fractions without converting them. For the current problem, they would enter 10 as either of the converted denominators, or the answer denominator, rather than a common denominator such as 12 or 24.

In the Behavior Recorder, first click on the start state; this will reset the interface to the start state. Next, type 10 in either of the fields for the denominator of the converted fraction. You should see a new link and state appear in the Behavior Graph.

By default, the Behavior Recorder assumes that any demonstrated solution step represents a correct step. When demonstrating incorrect actions, you therefore need to mark them explicitly as incorrect behavior. So right-click the edge that was created for an input of 10 and select Change Action Type > Incorrect Action (Bug) (see below). At the prompt to edit the error message, enter an error message that the student will see when they perform this action. Note: if you convert the tutor into a quiz, the student will not see the error messages.

You can repeat this process for any incorrect action. Note that when a student performs an incorrect action, the student will not advance past the incorrect link.

Setting an incorrect action.

5.2 Hint messages

You can attach hints to the links that represent correct actions. These hints will be displayed when the student requests a hint. Typically, multiple levels of hints are available for each action. Note: if you convert the tutor into a quiz, the student will not see the hints.

To define a hint message, click on a green action label displayed on an edge. From the pop-up context menu, select Edit Hint and Success Messages. Here you can define hints that will be shown to the student when they request a hint.

Editing hints for link

5.3 Skill labels

In this step you will add skill names (also known as production rule names or knowledge component labels) to the links in the behavior graph. The skill names correspond to the skills the student needs to perform in order to complete the problem. Later, if you create production rules for your tutor, you will create production rules that correspond to each skill name. When creating an Example-Tracing tutor, you do not need production rules, but the skill names will also be used for knowledge tracing.

To view and edit skills, you need to turn on the skill name display. This allows you to view the skill labels for each link. To do so, select View > Show Skill Labels from the CTAT menu. You should see some labels with "unnamed" appear on the graph. These labels are the skill names.

To edit a skill name for an edge, right-click the skill name label for that edge and select Edit Skill Name. A dialog box titled "Edit skill name 'unnamed'" will appear.

The skill context menu

In the Edit Skill Name box, enter a name for your skill. Subsequent skill name dialogs will allow you to choose from a list of existing skills that you have defined. The "Skill set" field refers to the category of the skill, such as "fraction addition".

5.4 Save your changes

Select File > Save Graph (or use the keyboard shortcut Ctrl-S or Cmd-S) to save the behavior graph to a directory in your CTAT Workspace (e.g., <user>\ctatworkspace\FractionAddition\ or {CTAT}\Projects\FlashFractionAddition\).

6. Test your tutor

You can now test the tutor you have created. Set CTAT's Author Mode to Test Tutor (see Figure 8).

To test your tutor from the beginning, click the start state in the behavior graph; then interact with the student interface.

To test from any other step in the problem, click the desired state in the behavior graph—the student interface will update to reflect the problem-solving state—and then interact with the student interface.

Figure 8: Setting Author Mode to Test Tutor.

You can switch between Demonstrate and Test Tutor modes while authoring to iteratively test and refine your tutor.

7. Optional: Convert your tutor into a quiz

The tutor you have created provides feedback to teach the student how to solve the problem. The interface components will turn green or red, respectively, as the student enters correct or incorrect answers; the error messages seek to dispel common misconceptions; and the hints tell the student what to do next. Sometimes, however, your purpose may be not to teach but to simply assess the student's knowledge: you want to test what the student can do without hints or feedback.

CTAT permits you to convert a tutor into a quiz by making the feedback invisible to the student. In a quiz, the system still determines (and logs) whether each student answer is right or wrong, and it still recalculates skill levels internally, but it suppresses all correct/incorrect indications, error messages and hints from the student interface.

To create a quiz from a CTAT tutor, select Graph > Feedback Policy from the CTAT menu bar. As of CTAT version 3.4, there are 4 feedback choices:

  1. Show All Feedback: ordinary tutoring behavior, with all hints and feedback.
  2. Delay Feedback: no feedback until the student clicks the Done button. Then, if enough student answers are right to form a path of correct links to the Done step in the behavior graph, the system considers the problem complete and will advance to the next problem. If not, the right/wrong (green/red) feedback is made visible on all attempted selections and the hint window shows the message, "You are not done yet"; the student must correct the errors to complete the problem.
  3. Hide All Feedback: ordinary quiz behavior, with internal grading and logging but no feedback to the student. The student can advance to the next problem by clicking the Done button at any point, even if steps are undone.
  4. Hide feedback but require all steps: like Hide All Feedback, but the student cannot advance to the next problem until all required steps on a path from the start state to the Done step have been attempted. That is, the Done button will return buggy feedback if any required step is left blank.

Figure 9: Choosing a feedback policy to convert a tutor into a quiz.