Calls to Action

To reinforce what test takers are expected to do, a call to action—to select either the Next button or the Submit button—is present on every SBT screen.

The demo is 67% its actual size. To see a full-size demo, click here.
To view alternative presentations and styling, use the Change Theme and Read Aloud buttons in the upper-right of the screen.

Language

When test takers must select the Submit button to continue, the following message appears on screen in most cases: “Tap Submit when you are finished.”

When test takers must select the Next button to continue, one of two messages appears in most cases.

  • If there is a response component on screen: “Tap the Next arrow when you are finished.”
  • If there is no response component on screen: “Tap the Next arrow to continue.”

Some contexts may warrant variations in language (e.g., “Tap Submit to finish the experiment”). However, the core instruction—either “Tap the Next arrow...” or “Tap Submit...”—must always be present.

Style & Layout

The message for Next buttons appears in one of two locations, depending on the screen’s content.

  • If there is at least one response component on screen, the message is positioned below the last component, or proximally if there isn’t sufficient space below. Ideally, there is a margin 2x the base font size between the response component and the call to action. (Shown in the demo below.) However, a smaller margin may be used if necessitated by layout constraints.
  • If there is no response component on screen, the message appears at the lower-right corner of the content pane in which it resides. (The Intro & Exit Screens demo shows an example.)

The message for Submit buttons appears to the left of its associated button. Both message and button are positioned below the last response component on the screen. Ideally, there is a margin 2x the base font size between the response component and the call to action. However, a smaller margin may be used if necessitated by layout constraints.

Calls to action are the same font size as item text, but are at a lower font weight to maintain the importance of item text in the visual hierarchy.

When placed on a solid fill, calls to action have no background. When placed on an image, calls to action may have one of two styling options applied to ensure readability:

  • Default. Black #000000 text on a 90% opaque white rgba(255,255,255,0.9) background.
  • Inverted. White #FFFFFF text on a 65% opaque black rgba(0,0,0,0.65) background.

The example below shows an inverted call to action. Additional examples can be seen on the Intro & Exit Screens page.

To view alternative presentations and styling, use the Change Theme and Read Aloud buttons in the upper-right of the screen.

Behavior

Submit Buttons

The Submit button finalizes the test taker’s responses to one or more items. Test takers are not allowed to change their answers after submitting them. The Submit button only becomes active when the completion requirements for the current screen, as specified by assessment specialists, are met (e.g., all parts of the current item have been answered).

When the first Submit button in an SBT is selected, a modal dialog appears to inform test takers that they cannot go back after submitting. (See the Dialogs page for more information about dialog styling.) Dialog content is below. Note that the dialog uses the singular “answer” when there is one response component on screen and the plural “answers” when there is more than one response component.

Before you submit, please make sure your answer is final.

You cannot go back after you submit your answer.

The following demo presents the behavior of the Submit button.

The demo is 67% of its actual size. To see a full-size demo, click here.
To view alternative presentations and styling, use the Change Theme and Read Aloud buttons in the upper-right of the screen.

Messages

The text of calls to action is interactive:

  • Selecting “Tap the Next arrow when you are finished” will emulate tapping the Next button in the System Toolbar, unless TTS is enabled, in which case the text of the CTA will be read aloud.
  • Selecting “Tap Submit when you are finished” will emulate tapping the associated Submit button, unless TTS is enabled, in which case the text of the CTA will be read aloud.

Interaction with Navigation Controls

The navigation buttons in the System Toolbar interact with calls to action in the following ways.

  • The Next button is disabled when the Submit button is on screen.
  • When a response component is on screen, but there is no Submit button, the Next button is disabled until the completion requirements have been met.
  • The Back button is disabled on any screen immediately following a screen with a Submit button.
  • Both Back and Next buttons are disabled when the submit dialog is on screen.