Como fazer uma Gui Animada Roblox Studio

Desperte o gênio criativo do seu filho com Tecnologia!

Como fazer uma Gui Animada no Roblox Studio

Se você está começando a criar jogos no Roblox, provavelmente já quis adicionar menus ou janelas que abrem de forma suave e bonita, como nos jogos profissionais. Neste post, vamos mostrar como fazer uma GUI animada no Roblox Studio, passo a passo, com um exemplo prático e super fácil de seguir!

Você vai aprender a criar uma janela interativa que aparece na tela com animações suaves, ideal para menus de configurações, tutoriais, inventários e muito mais. Essa técnica ajuda a deixar seu jogo mais bonito, organizado e fácil de jogar — e o melhor: você vai entender a lógica por trás da animação!

Assista ao video Completo de Como Fazer GUi Animada no Roblox Studio

No vídeo abaixo, você confere o passo a passo completo para criar uma GUI com botão e animação no Roblox Studio, perfeita para aplicar em qualquer tipo de jogo. Com uma linguagem simples e direta, ideal para crianças, adolescentes ou iniciantes, vamos te ensinar a criar uma janela que aparece e desaparece com suavidade. Tudo isso com exemplos práticos e explicações claras!

Scripts utilizados na aula:

Durante a aula, usamos scripts simples em Linguagem Lua, próprios para o Roblox Studio. Eles controlam a abertura e fechamento da GUI com animações suaves e podem ser facilmente adaptados para qualquer jogo. Os scripts estão disponíveis gratuitamente para copiar e colar!

				
					
local TweenService = game:GetService("TweenService")
local ScreenGui = script.Parent


local FrameMenu = ScreenGui.FrameMenu
local Button = ScreenGui.Frame.TextButton


local TweenOutInfo = TweenInfo.new(
	0.5,
	Enum.EasingStyle.Back,
	Enum.EasingDirection.Out
)
local TweenInInfo = TweenInfo.new(
	0.5,
	Enum.EasingStyle.Back,
	Enum.EasingDirection.In
	
)

FrameMenu.Size = UDim2.new(0,0,0)
FrameMenu.Position = UDim2.new(0.5,0,1.5,0)

FrameMenu.Visible = true
local open = false



Button.MouseButton1Up:Connect(function()
	if open then
		local tweenOutProps={
			Size= UDim2.new(0,0,0),
			Position= UDim2.new(0.5, 0,1.5,0)
		}
		local closeTween = TweenService:Create(FrameMenu, TweenOutInfo, tweenOutProps)
		closeTween:Play()
		print("Fechar")
		open=false
	else
		local tweenInProps={
			Size= UDim2.new(0.5,0,0.5,0),
			Position = UDim2.new(0.5,0,0.5,0)
		}
		local openTween= TweenService:Create(FrameMenu, TweenInInfo, tweenInProps)
		openTween:Play()
		print("Abrir")
		open = true
	end
	
end)