The Big Bubble Chat Rework

Will there be a native option supporting customization of chats for each player across all clients?

It’d be great to have a player with userId 000000 have a specific bubble chat color across all users.

I’m not sure of the implementation for Bubble Chat, but if we could do something like SetExtraData("ChatColor") like we can do for the existing chat, it’d be great.

ChatModule example of what I’m referencing:

SpecialChatColors = {
	["879330134"] = Color3.fromRGB(0,109,176)
}

local Run = function(ChatService)
	ChatService.SpeakerAdded:Connect(function(speakerName)
		local speaker = ChatService:GetSpeaker(speakerName)
		local player = speaker:GetPlayer()

		local chatColor = SpecialChatColors[tostring(player.UserId)]

		if (chatColor) then
			speaker:SetExtraData("ChatColor", chatColor)
		end
	end)
end
9 Likes

I’ve been experimenting with this using custom models.
The VerticalStudsOffset property changes every time you change into a different character.
However, for VerticalStudsOffset to update, you HAVE to send another chat message.

My request is to make VerticalStudsOffset update when this setting is being changed, not when another chat message is sent. I don’t know if this counts for other settings aswell, but it does for this one.

Examples below:

2020-10-14 20_40_07-New FFA - Roblox Studio 2020-10-14 20_40_18-New FFA - Roblox Studio 2020-10-14 20_41_40-New FFA - Roblox Studio

6 Likes

Where I put this in?
local settings = {
– The amount of time, in seconds, to wait before a bubble fades out.
BubbleDuration = 15,

	-- The amount of messages to be displayed, before old ones disappear
	-- immediately when a new message comes in.
	MaxBubbles = 3,

	-- Styling for the bubbles. These settings will change various visual aspects.
	BackgroundColor3 = Color3.fromRGB(0, 0, 0),
	TextColor3 = Color3.fromRGB(255, 255, 255),
	TextSize = 16,
	Font = Enum.Font.Sarpanch,
	Transparency = .1,
	CornerRadius = UDim.new(0, 12),
	TailVisible = false,
	Padding = 8, -- in pixels
	MaxWidth = 300, --in pixels

	-- Extra space between the head and the billboard (useful if you want to
	-- leave some space for other character billboard UIs)
	VerticalStudsOffset = 0,

	-- Space in pixels between two bubbles
	BubblesSpacing = 6,

	-- The distance (from the camera) that bubbles turn into a single bubble
	-- with ellipses (...) to indicate chatter.
	MinimizeDistance = 40,
	-- The max distance (from the camera) that bubbles are shown at
	MaxDistance = 100,
}
pcall(function()
	game:GetService("Chat"):SetBubbleChatSettings(settings)
end)
1 Like

Boo!

This should not be built into the engine. This needs to be a standalone package that developers can easily drop into their game. This allows new developers to learn how modular code is written and it allows developers to have much greater control over the appearance and functionality of the chat. Building functionality like this into the engine is the wrong thing to do!

10 Likes

This is not happening. I am testing it, and both are enabled. You can see here: https://www.roblox.com/games/3487742603/FALL-UPDATE-Work-at-a-Restaurant-CS?refPageId=b03a99cf-faf3-4229-8d7a-7d20b4133006

Adding on to this, it overlaps with Roblox dialog. image

3 Likes

These are the settings for the old BubbleChat, forked from the Chat Service while played.

--[[ SCRIPT VARIABLES ]]
local CHAT_BUBBLE_FONT = Enum.Font.SourceSans
local CHAT_BUBBLE_FONT_SIZE = Enum.FontSize.Size24 -- if you change CHAT_BUBBLE_FONT_SIZE_INT please change this to match
local CHAT_BUBBLE_FONT_SIZE_INT = 24 -- if you change CHAT_BUBBLE_FONT_SIZE please change this to match
local CHAT_BUBBLE_LINE_HEIGHT = CHAT_BUBBLE_FONT_SIZE_INT + 10
local CHAT_BUBBLE_TAIL_HEIGHT = 14
local CHAT_BUBBLE_WIDTH_PADDING = 30
local CHAT_BUBBLE_PADDING = 12
local CHAT_BUBBLE_FADE_SPEED = 1.5

local BILLBOARD_MAX_WIDTH = 400
local BILLBOARD_MAX_HEIGHT = 250	--This limits the number of bubble chats that you see above characters

local ELIPSES = "..."
local MaxChatMessageLength = 128 -- max chat message length, including null terminator and elipses.
local MaxChatMessageLengthExclusive = MaxChatMessageLength - getMessageLength(ELIPSES) - 1

local NEAR_BUBBLE_DISTANCE = 65	--previously 45
local MAX_BUBBLE_DISTANCE = 100	--previously 80

--[[ END OF SCRIPT VARIABLES ]]

And here we have the old files.

initChatBubbleType(BubbleColor.WHITE,	"ui/dialog_white",	"ui/chatBubble_white_notify_bkg", 	false,	Rect.new(5,5,15,15))
initChatBubbleType(BubbleColor.BLUE,	"ui/dialog_blue",	"ui/chatBubble_blue_notify_bkg",	true, 	Rect.new(7,7,33,33))
initChatBubbleType(BubbleColor.RED,		"ui/dialog_red",	"ui/chatBubble_red_notify_bkg",		true,	Rect.new(7,7,33,33))
initChatBubbleType(BubbleColor.GREEN,	"ui/dialog_green",	"ui/chatBubble_green_notify_bkg",	true,	Rect.new(7,7,33,33))

Bubbles.

ui/dialog_white

dialog_white

dialog_white@2x

ui/dialog_blue

dialog_blue

dialog_blue@2x

ui/dialog_red

dialog_red

dialog_red@2x

ui/dialog_green

dialog_green

dialog_green@2x


Bubbles and Tails.

ui/chatBubble_white_notify_bkg

chatBubble_white_notify_bkg

ui/chatBubble_blue_notify_bkg

chatBubble_blue_notify_bkg

ui/chatBubble_red_notify_bkg

chatBubble_red_notify_bkg

ui/chatBubble_green_notify_bkg

chatBubble_green_notify_bkg


Tails.

ui/dialog_tail

dialog_tail

dialog_tail@2x


New Bubble Chat on Old Settings


Old Bubble Chat


Hope this helps anyone wanting to use old bubble chat settings!

14 Likes

I would suggest changing the fact that the text bubbles refresh when zooming out or in.

1 Like

Question, is the old chat but the very old chat still a thing tho? The one with the blue lines on the left side. Such as the ones used in dialog bubbles.

2 Likes

I believe that would have to be implemented manually. If you want to experience the old bubble chat, I’m pretty sure RETROBLOX has it.

1 Like

Thanks, I was wondering. Lol. I wasn’t sure if it would auto re-update those ones and remove the old ones with the lines if that makes sense. :smile:

1 Like

I’m really excited about the new bubble chat but does it also allow TextStrokeColor3 to be apart of the settings? I couldn’t seem to get it to work.

1 Like

Some things I have noticed;

image

8 Likes

So you release a new bubble chat and don’t give us the option to fork it, but the old one allowed us to? Who thought this would be a good idea? :-1:

16 Likes

Also this,

3 Likes

I like the bubble design, but I don’t like it when u zoom out that u just see three dots. (just make it disappear)

Finally, we can customize chat bubbles without having to script until our fingers die.

2 Likes

I agree I think that Roblox should have done one overall UI change instead of one bit at a time like they have. It just looks off. I hope they rework the chat GUI but at the same time i’m scared that they will make it worse and more cartoony like they did the chat. I personally like the new chat excluding its look. I agree with you though. Would be nice to see a new font maybe that’s easier to read?!

4 Likes

How does stuff like this get by?! I swear Roblox has never heard of play testing things efficiently before implementing them.

3 Likes

That is something you can do on your own though. If you use UserInputService.TextBoxFocused and UserInputService.TextBoxFocusReleased, you can detect if they are focused on the chatbox. Here is an example of this through a LocalScript.

local UIS = game:GetService("UserInputService")

UIS.TextBoxFocused:Connect(function(Box)
if Box.Name=="ChatBar" then
-- Play typing animation
end
end)

UIS.TextBoxFocusReleased:Connect(function(Box)
if Box.Name=="ChatBar" then
-- Stop typing animation
end
end)
7 Likes

I love this change so far!

I suggest changing the fading out transition to fade upwards instead of just the entire bubble in the chat, but you do you.