Closed Captions in Player V4

Closed captions are additional text shown within a video during playback. The captions typically contain an audio transcript of the video. For an overview, see Managing Closed Captions

User Experience with Closed Captions

If closed captions are available for a video, end users can click the CC button on the Player V4 control bar to open the closed captions screen for all browsers with web and mobile platforms. In the closed captions screen end users can enable or disable closed captions in the language of their choice and apply color, opacity, and font styling settings.

In Player V4, closed captions consist of the text, background, and window. The window is a rectangle that contains the background, which contains the text.

From the closed captions screen end users can preview what the closed captions will look like on the player before applying settings. Note that if closed captions are off, when you make a selection in the GUI, for example, selecting a language, closed captions will automatically turn on with that setting applied.

Configuration Options in Player V4

By default, if closed caption files are available for a video, they will be enabled and shown in English. You can configure the default behavior and language of closed captions for your player in skin.json by modifying the defaultEnabled and defaultLanguage attributes of the closedCaptionOptions object.

Supported Input Formats

Closed caption files should be uploaded to Backlot along with your video files. For details on how to upload closed caption files to Backlot, see Ingesting Closed Caption Files and Uploading a Closed Caption File in Backlot.

The following input formats are supported for Player V4 closed captions:
  • DFXP
  • VTT
  • CEA-608 (Ooyala Live only)
  • SCC
Note: Any styling settings specified in the closed caption file will be ignored.

FCC Compliance

Player V4 is now Federal Communications Commission (FCC) compliant and supports FCC closed caption styling per the Twenty-First Century Communications and Video Accessibility Act (CVAA) requirements. FCC compliant closed caption styling allows the end user to change how the closed captions appear on the player, including:
  • Multi-language support
  • Font
  • Text size
  • Text, background, and window color
  • Text, background, and window opacity
  • Text styling

If closed captions are available for a video, the end user has the ability to apply the styling mentioned above.

Note: FCC closed caption styling is only supported on the web Player versions 4.5+ for desktop web and mobile web. The native SDKs do not have any styling settings within the Ooyala Player. For Android, the Android Skin SDK uses the operating system's closed caption styling information to render closed captions. As of June 23, 2016, the iOS Skin SDK does not support FCC closed caption styling. We are working on adding this functionality. The Android Skin SDK supports FCC closed caption styling.

Storing Closed Caption Settings

With the closed caption screen UI controls, end users can make changes to closed caption styles on the fly. Player V4 saves closed caption settings automatically in the browser. If a user changes a setting (for example, chooses a different font color), the change remains in effect when they open a new browser tab or window, or launch a new browser session. The information is saved using local storage key "ooyala_player_settings". The OO.EVENTS.SAVE_PLAYER_SETTINGS event is triggered when a change is saved.

Enabling or Disabling Closed Captions

To turn closed captions on, the end user clicks CC button > On. The player displays closed captions immediately after the end user clicks CC button > On in the default closed caption language. The default closed caption language is English, unless otherwise specified in skin.json.

To turn closed captions off, the end user clicks CC button > Off.

Configuring Language and Caption Settings

In the popover, click Caption Options to change the language and other settings for closed captions.

Selecting a Language

If you have associated closed captions with your video, end users will be able to select a caption language from the languages you provided.

To customize the closed caption language, the end user clicks Language and selects the desired closed caption language.

Note: The entry for each language selection in the closed caption screen is localized in its own language. For example, Italian is listed as Italiano.

The default language is English, unless otherwise specified with the defaultLanguage attribute of the closedCaptionOptions object in skin.json.

Selecting Text, Background, and Window Colors

For the closed caption text, end users can select a color option to apply.

For the closed caption background and window, end users can select a color option or transparent option to apply.

To customize colors, end users click Color Selection and select a color. The default color settings are white text with a transparent window and a black background.

Selecting Text, Background, and Window Opacity

For the closed caption text, background, and window, end users can use the slider bars to select an opacity. The default opacity settings are 100% opacity for text, 0% opacity for the window, and 60% opacity for the background.

To view opacity options, end users click Caption Opacity.

Selecting a Font Type

End users can choose from a selection of font types. All Font types shown are web safe fonts that browsers can render automatically.

To customize the font type, end users click Font Type and select a font. The default font is Proportional Sans-Serif.

Selecting a Font Size

End users can select from small, medium, large, and extra large font sizes.

To customize the font size, end users click Font Size and select a size. The default size is the second text size icon (medium).

Applying Text Enhancements

End users can apply the following text enhancements to closed captions. Only one enhancement can be applied at a time.
  • Uniform
  • Depressed
  • Raised
  • Shadow

To apply the text enhancements, end users click Text Enhancements and select an option.

Known Issues

When using HLS video assets with Mac devices and the Safari browser, the closed caption button always displays even if closed caption files are not associated with the video asset. This is due to an intrinsic problem with Safari.

Was this article helpful?