How to make a Team Change GUI

Introduction

Hello, I am AdánTalaz, a Front-end Lua developer, and today I will do my best to instruct you how to make a simple, yet Semi-Advanced Team-Switch GUI.

What you need

ReplicatedStorage You will need to insert a RemoteEvent, we will call this Event "TeamEvent"

Teams You will need teams obviously

Creating the GUI

In StarterGui, you will need to insert a ScreenGui, name this whatever, and a frame inside it, we will call the frame, "Background". Inside the ScreenGui, insert a LocalScript. This is what it should look like once you've positioned it to your liking: (Note: You can add a UICorner under an object to add corners to it)

Next, we're going to customize it how we like it (BackgroundColor, Size) and then add our TextButtons that we will press. To do this, right click the Background frame, and press Insert Object, then press TextButton. You MUST name the TextButton the exact same as the Team name you want it to change to, the text does not matter. To perfectly space it out, insert a UIListLayout into the Background frame. Adjust the settings on it to match your comfort. You should have something similar to this:

Scripting the GUI

In the LocalScript, we're going to put in the following:

local frame = script.Parent.Background
local buttons = frame:GetChildren() --All of the buttons inside of the Background frame
local event = game:GetService("ReplicatedStorage").TeamEvent

for _, v in pairs(buttons) do --Goes through all of the buttons, v now represents all of them
    if v:IsA("TextButton") then --Makes v only apply to TextButtons
        v.MouseButton1Click:connect(function() --Makes something happen when a button is clicked
            event:FireServer(v.Name) --Tells any backend scripts that are listening to do this
        end)
    end
end

Next, we're going to be creating the Back-end script, also known as a Server-script

Insert a Script into ServerScriptService. You can call this whatever, I will call it TeamServer. Inside this script, we will put the following:

local event = game:GetService("ReplicatedStorage").TeamEvent
local teams = game.Teams

local function onEvent(plr, target) --These parameters come from what we put in the :FireServer, but the player that fired it, is always going to be the first parameter. The parameters don't change no matter what you call them.
    plr.Team = game.Teams[target] --This changes the players team
    plr:LoadCharacter() --Reloads the player
end

event.onServerEvent:connect(onEvent)

Now, you should have a working Team-Changing GUI! If you wanna add more teams, just add a text button into the GUI, and make its name the same as the team name.