Help Scripting an Overhead GUI

  1. What do you want to achieve? Keep it simple and clear!
    [1] I would like to achieve an Overhead GUI that displays above characters head with information such as What Number rank they are and the text of their rank in the group.
    [2] Would like to than be able to set the colours of my teams in the game as the colours for my Overhead GUI and change the font.
  2. What is the issue? Include screenshots / videos if possible!
    Not really sure where I should start I’m thinking its a good Idea to create the GUI myself and than report back if there is any errors.
  3. What solutions have you tried so far? Did you look for solutions on the Developer Hub?
    Just watched a few Youtubers Such as Alvinblox, Roscripter etc.
2 Likes

We use something called a Billboard Gui for this, I recommend researching that.

See: Player | Documentation - Roblox Creator Hub
You can set the Overhead GUI to that color and it should be fine.

Alvinblox has a tutorial on Youtube on making a overhead GUI.

1 Like

Making the BillboardGui

To help remove your doubts, to start off and design the BillboardGui we would need an object to act as the head as that’s where you want the overhead gui to hover over, in this case we would use a part that would be placed in Workspace.

Next we would insert a BillboardGui into the part we have in Workspace, then we would add a TextLabel into the BillboardGui (I recommend naming the BillboardGui something like RankGui depending on how you are using it).

After this we would customize and design the BillboardGui, it’s like designing a normal gui in StarterGui if you have ever had any experience. What you might notice by this point is that the BillboardGui is “in the part when you visually look at it” so when the player spawns in the BillboardGui will be “in the characters head” so what we do is move the BillboardGui by using a few studs to move it up, to do this we look at the Properties tab and click on the BillboardGui and change the StudsOffset (y integer - I recommend 2.5) this will keep the BillboardGui above the players head, resizing and moving it is up to you and you can search up how to do that yourself on the forum or the internet.

Moving on we move the BillboardGui and it’s child (TextLabel), which will be inside of it, to ServerStorage, which we then start to make a normal Script which will be placed in ServerScriptService.

Starting the script
Starting off we define the BillboardGui which is in ServerStorage, using our handy

local bbg = game:GetService("ServerStorage"):WaitForChild("RankGui") -- this is what I renamed the BillboardGui to

Next we know every player needs a BillboardGui so we will use a function called PlayerAdded so every player gets a gui.

local bbg = game:GetService("ServerStorage"):WaitForChild("RankGui")

game.Players.PlayerAdded:Connect(function(player) -- a parameter so we get the player who joins the game
   local bbgclone = bbg:Clone() -- we need to clone our gui say if multiple players join the game they need guis as well so we can't just take the one we have in serverstorage we use it to clone other guis.
end)

So we have our new player’s gui ready, but how do we get it on it’s head? we make a new function defining the character (CharacterAdded) after we have the function in the function we use the players character to search for the head of the character and parent our cloned billboardgui to the characters head

local bbg = game:GetService("ServerStorage"):WaitForChild("RankGui")

game.Players.PlayerAdded:Connect(function(player)
  local bbgclone = bbg:Clone()
  player.CharacterAdded:Connect(function(character) -- parameter defining the character
      bbgclone.Parent = character.Head -- parenting the cloned gui to the head
  end)
end)

After this we need the text to be changed to something else so we get the textlabel in the cloned BillboardGui and change the text.

local bbg = game:GetService("ServerStorage"):WaitForChild("RankGui")

game.Players.PlayerAdded:Connect(function(player)
  local bbgclone = bbg:Clone()
  player.CharacterAdded:Connect(function(character) 
      bbgclone.Parent = character.Head 
      local text = bbgclone.TextLabel

      -- to get the rank in the group you would use this
     local rankingroup = player:GetRoleInGroup(groupid)
      text.Text = player.Name -- text that you'd want for the name or for the rank it would be --text.Text = rankingroup--
  end)
end)

I hoped this helped learn the basics of making an overhead gui as it took me a pretty long time to write this all down if you would like to look into customizing with team colours I recommend looking at the link @SingleSided sent on his post. :+1:

5 Likes

Hi there super Appreciate the help on you going through what each part does was super useful for me and beneficial for my learning. Managed to make my GUI though! just need to fix positioning I think and than just script in Names of players and their rank.
It than gave me this error in the Output.
TextLabel is not a valid member of BillboardGui "Dellboy568.Head.RankGui"

GUI

2 Likes

Hello glad you managed to understand it!
Can I see your explorer and what you have in the BillboardGui(s)?

1 Like

go in the script and replace

local text = bbgclone.TextLabel

to

local text = bbgclone.Username

basically textlabel wasnt in the billboardgui thats why it errored

Ah Ok that must have caught me by mistake cheers! :+1:
Hmm Still same error after changing the mistake around.

Can I see your code? Also try use a WaitForChild() on the textlabel because you might have to wait for the instance to load in?

GUI
thats the code I have

The issue is that you are trying to index the TextLabel, but it was not found. Because you have placed the TextLabel inside a frame. Basically just use your current code but indexing the Frame, after the BillboardGui, and before the TextLabel.

Also, your code would only work once. Since, if the player dies, the clone of the BillboardGui would be gone. This means, you need to move the bbgclone = bbg:Clone(), to the .CharacterAdded function.

1 Like

You need to say:

local text = bbgclone.Frame.TextLabel

You weren’t referencing the frame.

EDIT: Ugh, @PhoenixRessusection beat me lol

1 Like

Referenced the frame However it is returning with TextLabel is not a valid member of Frame Dellboy568.Head.RankGui.Frame

Quick Update I have now gotten to display My username on top Just need to figure out how to script in the Rank of my group under the second textlabel.

Thank for the help everyone! I managed to make my Own Gui that displays my Group rank and player name above my head. :smiley: Now I assume I can use this script to further develop changing the colour etc say for example one of my teams have the colour “Really Red” How can I parent this colour to the text label for people based on that rank in the team?

GUI

You can do;

text.TextColor3 = Color3.fromRGB(player.Team.TeamColor)