Storyline Styles

Scrolling Text

***All template files are tested using modern browsers, such as Chrome and Firefox. We do not support or test using Internet Explorer.***

Do you want to learn how to use xAPI in this template? Learn Now!! 

In this video, we're going to take a look at the basic structure of our Scrolling Text Scenario Storyline template, and how to make simple edits like changing text in the file.

First let's look at the structure. Primary content for this file is presented in scrolling chat bubbles on the main layer. Once the 4th chat moves into position on screen, a Selection Layer will launch, presenting the user with 4 choices. Based on that input, a Correct or Incorrect layer displays with additional messaging or remediation. The user can close the incorrect layer and return for another try.

Editing content is fairly straightforward on this template. You can change content on each chat bubble on the main layer simply by clicking and editing each chat's text box. The buttons on the selection layer are standard Storyline shapes, and can be edited as such. Similarly, all content on the correct and incorrect layers can be directly selected and edited as desired.

To change the images in each chat, select the shape of the image you'd like to edit, then press the Edit States button. In the normal state, you'll find a PNG overlayed on a rectangle. You can edit or delete that image as needed.

To adjust the correct/incorrect answers, navigate to the Selection Layer and use the "Show Layer" triggers at the top of each button to change its target.

If you'd like to include fewer buttons on screen, simply hide them, drag off-screen, or delete.

If you'd like to edit the number of chat bubbles, you'll need to get your hands a little dirty. The functionality is pretty straightforward: we've got a set of arrows that, when clicked, control motion path animations (and states) of several groups. The trick, however, is that the 4th bubble's UP animation controls the appearance of the Selection Layer. So, if you add or remove something from the thread make sure to adjust both the final positioning of those elements to make space for the Selection Layer, AND the trigger that controls its appearance.

This article last reviewed July, 2018. The software may have changed since the last review.