Adding closed captions on all layers

Dec 18, 2014

I'm hoping someone can help me with a Storyline problem. I have a course with a lot of audio and slides with layers. In a most cases there is audio on the base layer and all subsequent layers.

I have managed to add closed caption text on the base layer which references another layer I have called CC. I have managed to have the closed captions persist across slides when moving from one slide to the next. I am allowing the audio to continue to play when closed captions display as it is too hard to work out how to turn of the audio. Or is there an easy way to do this?

My problem is how to get closed captions to display on other layers apart from the base layer. I could put the CC button on each of the layers, which when clicked will display a specific CC layer for that layer. However, the audio will stop when moving to the CC layer. This is not consistent with how the base layers work. If I am on the base layer and click the CC button, the closed captions display and the audio continues to play.

Has anyone got any suggestions on what I could do?

18 Replies
Steve Flowers

Hi Alexandra - 

It depends a bit on the method you're using for captions. Here's the way I do mine:

1) Create three variables: captions (text), captionToggle (number), captionsOn (true/false)

2) Add a button for your CC on the master slide base layer. Add a single trigger to this button that adds 1 to the variable captionToggle when clicked. We'll explore why in a minute:)

3) Create a layer on your master slide called captions. Put your subtitle overlay in this layer and add the reference %captions%. Make sure this layer is not set to hide other layers. Add a trigger to this layer that sets the variable captionsOn to true. Add a copy of your CC button to this layer. Remove the captionToggle trigger and add two triggers to this copy:

  • Adjust variable captionsOn to false when clicked
  • Hide this layer when clicked

4) Add two triggers to your master slide base layer. 

  • Show layer captions when variable captionToggle 
  • Show layer captions when timeline starts if captionsOn==true

From here, you should be able to toggle your captions placeholder on or off and will show the captions when a new screen starts if the caption was shown in the previous screen.

Now we have a set of problems to solve. The first is this placeholder will hide when a new layer is shown that has "hide other layers" selected. The second is our captions need to be laid in to populate the placeholder. Both are really easy to solve:)

Solving the layer hides captions problem

1) Go to your feedback master. In the feedback master for your default layer (or the top level, that will work too) create a small "trigger shape" like a circle off of your stage. I create mine in the upper left just to the left of the visible stage area.

2) Add a trigger to this shape: Adjust variable captionToggle to add 1 when the timeline starts.

This will send a message to our master layer that shows the caption layer and sends it to the front, just in case a layer is set to hide it. Since your feedback master is fired as the layer is shown, this trigger will fire. If the captions are already on, it won't hurt anything.

Creating caption triggers

This method might seem painful but it goes REALLY quickly and also works for audio in layers. The captions are synced. I start with my transcript in the notes panel. 

1) Create a trigger shape off of the timeline below your stage. I use a small circle. 

2) Add a trigger to this shape: When timeline starts, adjust variable captions to value ___. Leave it blank for now. This becomes your "template shape". Make sure it's timeline starts and not user clicks.

3) Detach your notes panel (if you're using Storyline2) and make it as wide as you'd like your captions to be. This is your "copy source".

4) Copy and paste the shape for the number of lines you have. In this example, the transcript includes the base layer and another layer. So it's a little misleading. The layer opens first to provide the first four lines on first visit. 


5) Copy one line at a time to the corresponding shape's blank in the triggers panel. This goes really quickly.

6) Use the preview button on the lower left of the timeline. Listen to the audio with your finger over the C key. Hit C to drop a cuepoint when the audio wraps a line. In the example above, I would drop a cuepoint when the narration says "allows", "toggle", or "select". The welcome passage is on the base layer. 

7) Line up the start of your trigger shapes to the corresponding cuepoint. 

Test your slide. You should now see the captions displayed in an overlay that shows the caption, synchronizes the caption display with your timeline (even when scrubbed back and forth). Since it's a single object, if you need to change the background color / transparency of the captions overlay, adjust the font size, etc.. You'll only need to do that once.

This seems like it's a drag. But it goes really quickly and I actually prefer this method to Captivate's built-in wizard. I wish we had a way to import / export captions in a specific feature. This has been the next best thing for me.


Alexandra McCormick

Hi Steve. Thanks so much for your response.

Yes when I say closed captions I mean transcript of the audio.

I will have a look at what you have posted slowly. I'm new to Storyline and this is my first course. So I'm learning as I go. I have attached a cut down version of the screens I'm talking about.

Hopefully your way is easier and will work for this course. I may have complicated things due to lack of knowledge.

Regina Saenz

The only thing I have found when playing with HTML 5 and that you have to use the articulate player app! Maybe we are stretching the boundaries of storyline here, but it seems that everything is intermittent with storyline in HTML5 it's extremely upsetting, and creates a very unprofessional end product. Can't tell a client for sure if their file will work or not, even if I use the compatibility charts and stay within those defined guidelines

Sent from Regina Saenz iPhone

Katarina  Derek

Hi Steve!

I have added the shape to the master feedback slide, but cc on the layers still does not automatically show. I have to select the cc button to trigger it.

I am not sure whether my variables are correct. I have attached the story of my project. Maybe you can tell what is preventing the layers' cc from displaying automatically.



Jacqui Yoo
Steve Flowers

If you post a stripped version of your current file, might be able to help. When some folks say closed captions, they mean a slide based transcript. Captions are synced to the presentation.

Steve, this is great- thanks! Got me most of the way there.

Trouble for me is that I am trying to do a transcript of the audio, so the length obviously varies from slide to slide. I put a scroll box on my captions master slide layer, with the text box and caption text variable in it, set to "resize shape to fit text". It does not seem to be doing so, however, and the text is all squished. Any ideas on how to get around this?

Steve Flowers

Hi, Jacqui - 

Unfortunately the resize shape to fit text doesn't work very well. Here's how I've dealt with it:

1. Create a text box. Make it as tall as you expect the largest block of transcript to be. 

2. Create a background shape. 

3. Overlay a scrolling block the size of the background shape.

4. Drag your tall text box into the scrolling block.

The other way around this is to use the notes field and change the title of the tab (or dropdown) to transcript. This is the most common way I've seen folks beat this challenge.

Jacqui Yoo

Thanks for your reply!

Solved my own problem! I created a slideID variable and assign it a number (1,2,3) on every slide. Then I created text boxes for the slide scripts in the CC master slide layer, set to Hidden, inside the scroll box. Then I added triggers to turn their states to Normal, when SlideID changes, according to the appropriate slide number.

This discussion is closed. You can start a new discussion or contact Articulate Support.