What is the best way to make a teleporter with a fading gui?

You can write your topic however you want, but you need to answer these questions:

  1. What do you want to achieve? A simple teleporter that has a fading gui when teleported.

  2. What is the issue? I am not sure how to make a teleporter.

  3. What solutions have you tried so far? I’ve tried free models but I keep having the problem when my character teleports the character ends up on the roof of my build.

What is the best way?

First of all, what experience do you have with scripting, to begin with? For this I would use the TweenService to fade the GUI and once it’s done teleporting the player before using another tween to unfade. If this is above your skill level I would gladly elaborate on how to do this more.

I don’t have much experience. I mostly know about functions.
I’m still learning.

Alright, Lets say you have a ScreenGui with a Frame that covers the whole screen, you would start the teleport by defining your tweenservice
local tweenService = game:GetService("TweenService")
After defining that you would want to define the TweenInfo by setting the following
local tweenInfo = TweenInfo.new(1,Enum.EasingStyle.Linear)
The first param is the time it takes and the second is how the move is done
More about Easing Style

After you’ve set up the basic info you now need to create the actual tween and change the transparency of the GUI, the transparency right now is 1.
local tween = tweenService:Create(player.PlayerGui.ScreenGui.Frame,tweenInfo,{BackgroundTransparency = 0})
The first param is the object changed, the second is the info, and the third provides what you change about that object and the value it should go to

After all this you play the tween and wait for it to finish as follows-
After all this, you can teleport your player to some point using player.Character:MoveTo(Vector3 point)
When your done you just need to create a second tween to fade away the GUI, you can just use the info from the first tween, all you need to change is the final value

Use TweenService, since you said you don’t have much scripting experience i’ll help you out a bit

Using TweenService is pretty simple!

--// First get the service itself

local TweenService = game:GetService("TweenService")

--// Then create the information for it, this is where you can customize it

--// First is the duration of the Tween, basically how fast the screen will fade

--// Second is the style of the Tween

local TweenInformation = TweenInfo.new(1,Enum.EasingStyle.Linear,Enum.EasingDirection.InOut)

--//Then create your tween

--// First set your target, in your case your Frame

--// Second this is where we use the Tween information

--// Last, this is where we will set the Transparency of the Frame

local Tween = TweenService:Create(Frame,TweenInformation,{BackgroundTransparency = 1})

--// Last Play your tween

1 Like

You need to also mention halting the script until the tween is finished using Tween.Completed:Wait()

1 Like