How to make a "Cinematic Mode" in your game!

Howdy! Today ill be showing you how to make a very basic cinematic mode, it disables default roblox UI and all of your custom UI besides a logo of your choice

We will be using Tables, UserInputService, and StartGui:SetCore()

First things first we will want to assing the needed variables, to disable and enable GUI’s after and before each mode change, we will be saving the GUI’s name and enabled value in a table to load back after, it will look something like this, [“MyScreenGui”] = true

local UIS = game:GetService("UserInputService")

local StarterGui = game:GetService("StarterGui")

local player = game.Players.LocalPlayer

local playerGui = player.PlayerGui

local bool = false -- check if we want to enable or disable cinematic mode

local values = {} -- table to add values to

Now we will want to start it off with detecting when they press a key, I will be using “V” for this example, but you can use whatever you like or pair it with my keybind editing system!

Detect when the input begins, and if its a keyboard, then check the keycode

UIS.InputBegan:Connect(function(input)
    if input.UserInputType == Enum.UserInputType.Keyboard then
        if input.KeyCode == Enum.KeyCode.V then

        end
    end
end

then we do a basic check to see if we are opening or closing cinematic mode

if bool == false then
    bool = true
else
    bool = false
end

Now we have to disable all the roblox default UI, you can do this by disabling the top bar and then enabling it when they go out of the mode

if bool == false then
    bool = true
    StarterGui:SetCore("TopbarEnabled", false)
else
    bool = false
    StarterGui:SetCore("TopbarEnabled", true)
end

we then have to loop through playerGui, check if v is a screengui, check if it is not the specific logo, and then add it to the values table
(little bit a jump here)

local UIS = game:GetService("UserInputService")
local StarterGui = game:GetService("StarterGui")

local player = game.Players.LocalPlayer
local playerGui = player.PlayerGui

local bool = false

local values = {}

UIS.InputBegan:Connect(function(input)
    if input.UserInputType == Enum.UserInputType.Keyboard then
        if input.KeyCode == Enum.KeyCode.V then
            if bool == false then
                StarterGui:SetCore("TopbarEnabled", false)
                bool = true

                for i, v in pairs(playerGui:GetChildren()) do
                    if v:IsA("ScreenGui") then
                        if v:FindFirstChild("special") then
                            v.Enabled = true 
                        else
                            values[v.Name] = v.Enabled

                             v.Enabled = false
                        end
                    end
                end
            else
                StarterGui:SetCore("TopbarEnabled", true)
                bool = false

                for i, v in pairs(playerGui:GetChildren()) do
                    if v:IsA("ScreenGui") then
                        if v:FindFirstChild("special") then
                            v.Enabled = false
                        else
                            v.Enabled = values[v.Name]
                        end
                    end
                end
            end
        end
    end
end)

This runs through the loop, checks if the GUI is the specified logo by seeing if it has a child named “special” (which in my case is just a string value)
enables the logo, and disables everything else
2022-01-09 12_13_57-Client - Roblox Studio

now I have my logo as a text button so the player has the option to disable the logo for pictures if they would like, but you dont have to!

script.Parent.Activated:Connect(function()
	script.Parent.Parent.Enabled = false
end)

now try it out!

(this was written very quickly so please let me know of any mistakes!)

7 Likes

Can you show a video or a picture of what the final product should look like?

If you mean code wise that’s right here

we then have to loop through playerGui, check if v is a screengui, check if it is not the specific logo, and then add it to the values table
(little bit a jump here)

But if you mean a video of that functioning I’ll get that as soon as I can

1 Like

A video of it functioning, aka the final product, not the code is what I meant.

1 Like

Here you go!

there is a way to do it using the default roblox one by pressing shift+P lol

1 Like

that enables all UI and depending on your game enables free cam

WOW that’s really cool thanks for teaching us

1 Like