Storyline Example: Generating Closed Captions
Jun 27, 2012
One of the complaints I've seen with Storyline's accessibility is the challenge of adding Closed Captions. There are a few ways to accomplish this in Storyline but most of the methods I've seen in practice make it difficult to separate the caption from the presentation. In other words, folks are putting text boxes on the slide to time the text.
Here's a way to add CC to your presentations that is fast and easy - with the bonus of providing a toggle control to show or hide the CC and centralized styling and position of the display from a single object.
Take a look. The file is pretty self-explanatory, it employs relatively simple concepts with decent results. It's pretty easy to manage.
176 Replies
Great presentation, Kevin. Thanks for linking to it. I love Terrill's able player. Interactive transcripts really add a lot for me personally, even if I don't require it - still a super-useful feature.
And I agree! While workarounds like the one described in this thread make accessibility a little more accessible, native support for standard captions and features that meet with current (and extensible to future) expectations should really be on the roadmap.
Hi Steve. Thanks for the info on the closed captioning. It's been great. However, I am having issues with linking it to a video file. The video file is set to play "when clicked" so assigning the CC to timeline starts means that the captioning will be out of synch with the video. I considered setting the CC to start when the media starts to play (when user clicks the play button) but will also have the same issue if the user decides to pause the video.
Any thoughts or suggestions?
Matthew
Couple of ways around it. One would be to import the video in an accessible player as a Web Object. The other might be to put in a trigger to pause your video at the beginning, overlaying with a play button graphic. This would give you the same effect while retaining the sync with the player timeline.
Unfortunately, it's hard to do anything synchronized with the player if it's not locked to the timeline.
Thanks Steve. The other workaround I'm going to try is to create closed captioning in the video file using Adobe Premiere. I will then have two video files (one with CC and one without). the CC without file will be on the base layer. I will place the CC with on another layer for users who need the accessible option. The video is relatively short and only a small size so not too worried about increasing the file size. I'll look at the accessible player option as well for future projects.
Matthew,
I considered a similar approach, but our videos start at 1 hour long (broken up into clips on different slides) and go up to 7 hours. This would significantly increase download size for our users. I'm brainstorming on some other ways to do this...
I got this working, see my last few messages here: https://community.articulate.com/discussions/articulate-storyline/can-the-seekbar-be-used-to-scrub-in-videos-on-separate-layers
Thanks for sharing Mike and linking the threads.
Hi Steve!
I have followed your directions for adding closed captioning to my course. It works well for all, but two pages. In these pages (like in many others) I have multiple layers. The layers display correctly (i.e., without showing the base layer) until the CC button is clicked. At that point the base layer is shown underneath.
I am not sure what I am missing here. I have attached the .story file. The two pages in question are 1.7 and 1.10. I would appreciate any help I can get.
Hi Katarina -
I see what's going on with it, though I haven't seen this particular behavior before. You're using the layer to control visibility of objects on the base slide. When the CC displays, the CC layer reactivates the base layer objects. I think this could be a bug. It might just be a side-effect of layer behavior.
I'd fix it by adding a shape to the background of your overlay layers (with that light blue tint of your slide background) that blocks the text shown on the layer below rather than using the layer visibility. That should fix what you're seeing. You might also create a feedback master specifically for those layers that contains the background in the master. In this case, since it's not that many screens, I'd just paste in the blocker shape.
Hi Steve!
Yes, adding the blue shape to each layer fixed the problem with the base layer showing when other layers are selected. Thank you very much for your suggestion and the closed captioning solution. I appreciate it! :)
Glad to see you got the help you needed, Katarina... and many thanks to you, Steve! :)
Thanks for sharing this information! Has anyone come up with a fix for having CC on multiple layers? If the CC is turned on, but you click on a layer, the CC turns off and you have to click the CC button again for it to show. Thanks for the help!
Hi Lesley -
Couple of ways around that. One is to make your layers not hide other layers. The other method I've found handy is to add something to your feedback master to immediately open the CC layer (or other layer) with a trigger when the layer is shown.
You can edit the feedback master and add a trigger. I use a shape to contain the trigger that appears at least .1 seconds into the timeline. By using a condition on this trigger, you can control whether it should show the CC or not when the layer is shown. And by adding this to the feedback master, it'll happen on every layer.
Thanks, Steve! I applied the trigger concept to the particular slide that had layers and it worked. So, I added a shape to the layer:
Action: Adjust variable
Variable: "transcriptToggle" (the True/False variable created where default value is False)
Operator: =NOT Assignment
When: Timeline starts
Object: [the shape I inserted off the slide]
On Condition: transcriptToggle==Equal to True
I add the shape with the trigger to every layer and it appears to be work. I have it set to display at .1 seconds on the timeline. Typing this out so I have it on hand for next time.
If there's another way, or if I misunderstood, let me know. Thanks for all of your help!
That method definitely works. You could also edit the feedback master (the masters that are applied to layers) and add that shape. It would appear in every layer using that master .
Lesley, if the variable has default of False, how do you set the value to True so the condition works? Or doesn't that need to happen?
Thanks, Steve. I'll try that too.
Alexandra, what happens is I have the CC on when I'm on the base layer, it is set to true. When I click on the layer, it's still true, but the CC text wasn't showing. So that is why that particular trigger on the shape works. I was actually using one of the submitted projects on this message thread, and it appears there are some extra triggers on the master slide that are unnecessary. I'm going to have to play around with it some more. Hope this helps!
Update: even after deleting the triggers on the master slide I thought necessary, I still needed to add that trigger to the shape. I'm not going to pretend to understand, but it works. :) I'm always open to smoother ideas!
Have you tried deleting it and adding a different type of button?
Thanks, Jeff. It looks like I had added an additional trigger on the master slide that was changing the variable unnecessarily, so in this case, the added shape with the trigger didn't appear necessary. I think I have it figured out now. Thanks for your help!
Glad to hear that you were able to get the assistance you needed Lesley and thanks for the update.
Great solution Steve. I figured out to add Soft Closed Captions in Storyline with using the .mp4 file itself, using the Screenflow app for video (or handbrake), adding localized captions there, rendering with captions, then inserting in Storyline, Publishing then finally swapping out the Published Storyline .mp4 video file.
As long as you keep the .mp4 files then same aspect size you're good.
I Detailed the Steps further on my Blog and will make a video next.
http://contextc.com/closed-captions/adding-soft-closed-captions-to-mp4-video-for-web-or-articulate-storyline-html5/
Hope this helps. :]
Using video is a cool trick. Are you hiding them by using a cover shape? For good quality, how are the file sizes?
Would really love to simply be able to add a widget with synced SRT / VTT. Your method is at least a little more portable and allows you to use whatever caption creation method you please:)
It's all done in the MP4 Steve, SL just holds the video. Maybe in SL3 there will be support for external localized SRTs opening the door to highlighted narration blocks, seen as the narration is playing similar, to lynda.com tutorials.
This closed caption solution seems to work quite well but I have a question. I've published a file to Tempshare. I noticed while it works on Chrome in Windows, when I open the same Tempshare link in Chrome on my Mac and I click the closed caption button, it freezes the whole module. Has any one else experienced this? I can't see why it would not work on Chrome on a Mac...(also does not work on ipad).
Thanks!
This discussion is closed. You can start a new discussion or contact Articulate Support.