Hello all,
I wanted to share a recent tutorial I created, outlining the process of developing a custom closed captioning or subtitle system for Roblox. To make the process easier, the provided model includes all necessary components and examples.
Overview
Roblox lacks a native closed captioning or subtitle system, so we need to create a custom solution. This guide will demonstrate how to implement a custom subtitle system using a LocalScript and a settings ModuleScript that automatically adapts to any playing audio within Roblox. The system uses the SubRip (SRT) format for subtitles.
Required model
Get the “DynamicSRT” model from the Roblox developer catalogue. This model includes all necessary components like ScreenGui
, LocalScript
, ModuleScript
, and TextBox
.
Instructions
-
Insert the model
- Insert the “DynamicSRT” model from the Roblox developer catalogue into your game.
-
Setup the ScreenGui
- Move the
ScreenGui
from the model intoStarterGui
. - Ensure the
ScreenGui
contains aTextBox
which will display the subtitles.
- Move the
-
Move the LocalScript
- Inside the
ScreenGui
, there should be aLocalScript
namedDynamicSRT
. - Make sure this
LocalScript
is a child of theScreenGui
.
- Inside the
-
Verify the Settings ModuleScript
- Inside the
DynamicSRT
script, ensure there is aModuleScript
namedSettings
. - The
Settings
ModuleScript contains default settings for the subtitles, such as theTextBox
reference and clear text settings.
- Inside the
-
Add subtitles to audio
- For each
Sound
instance in your game that you want to add subtitles to, create aModuleScript
as a child of theSound
. - Name the
ModuleScript
with “SRT” in its name (e.g., “ExampleSRT”). - The
ModuleScript
should follow the template provided below, containing the SRT subtitles.
- For each
Example “ExampleSRT” ModuleScript
local Settings = {
-- Optional setting overrides for subtitles
TextLabel = nil, -- Text object to display captions
ClearText = "", -- Text to set the TextBox when cleared
ClearOnSubtitleEnd = true, -- Clear the TextBox when a subtitle ends
ClearOnAudioEnd = true, -- Clear the TextBox when audio ends
UpdateInterval = 0, -- Wait interval (in seconds) to update the text with new captions
-- SRT file for parent Sound
SRT = [[
1
00:00:00,000 --> 00:00:01,000
<b>Warning.</b>
2
00:00:01,000 --> 00:00:03,740
Medical facility quarantine breach detected.
]],
}
return Settings
The SRT format
- Each subtitle entry starts with a unique ID.
- The ID is followed by a timestamp indicating the start and end times for the subtitle, separated by an arrow (
-->
). - Below the timestamp, the subtitle text is written.
- Example:
1 00:00:00,000 --> 00:00:01,000 Warning. 2 00:00:01,000 --> 00:00:03,740 Medical facility quarantine breach detected.
- If rich text is enabled, you can use HTML-like tags to format the subtitles.
- Example:
1 00:00:00,000 --> 00:00:01,000 <b>Warning.<b/> (Bold text.) 2 00:00:01,000 --> 00:00:03,740 <i>Medical facility quarantine breach detected.</i> (Italic text.)
Join the game to see the subtitles in action. The LocalScript
will automatically adapt to any Sound
instance and display the corresponding subtitles in the TextBox
. This will only affect the client side, so you must join the game rather than simply running it.
You can customize the appearance of the TextBox
in ScreenGui
to match your game’s design.
SRT files can be created manually or with automatic transcription services like the one I have linked at the bottom of the post. You’ll usually want to modify automatic transcriptions so they align properly.
- Scripts: Roblox
- SRT generation platform: Free Subtitles AI
Feel free to provide any feedback or questions you may have. Your input is greatly appreciated.
Thank you!