Can someone Explain to me how Lerping works and answer a few questions?

Can someone Explain to me how Lerping works and answer a few questions?

Here are the questions,

  • Can I Lerp the players camera to make a bobbling effect?

  • Can I lerp UI?

  • Is their any sub functions in Lerping?

1 Like

Although I don’t personally know much about lerp, here is a video by @Alvin_Blox that will help.

About lerping UIs, you can use TweenService for that. Lerping is more for 3D objects.

And yes, you can lerp the player’s camera to create a bobbling effect. In fact, I know of FPS scripts that use it.

1 Like

Lerping (linear interpolating) is just finding a value that is some percent between 2 values. So for example, I have this slider I want to use to control the time of day. With this, I have two values: 0 and 1 for the lower and upper bound of the slider, so I would need to somehow proportionately scale up a number between 0 and 1 to 0 and 24, to account for the 24 hours of day:

To do this, we can use linear interpolation, it’s a simple formula:

lBound + (uBound - lBound) * alpha

To use it, we would define our lBound and uBound variables to be 0 and 24

local lBound = 0
local uBound = 24

Now, we need to get our alpha variable which is just the value some percent between lBound and uBound. For proof of concept, let’s use 0.2 (which equates to 20%):

local alpha = 0.2

To plug it into our formula, it would look something like this:

local lBound = 0
local uBound = 24
local alpha = 0.2
local lerpedValue = lBound + (uBound - lBound) * alpha

This outputs 4.8, which I used in the ClockTime property inside of Lighting.

There are many, use cases, the following datatypes are able to be lerped:

  • UDim2s
  • Color3s
  • Vector2 and Vector3s
  • CFrames (this is a bit more complicated as it has to incorporate rotation as well as positioning but conceptually it is the same)

To help visualize it, let’s say we want a relatively smooth transition from the pink and brown parts in terms of colour and position:

To do this, we can use for loops and lerping:

local part1 = workspace:WaitForChild('Part1')
local part2 = workspace:WaitForChild('Part2')

for i = 0,1, 0.01 do
	local newPart = part1:Clone()
	newPart.Parent = workspace
	newPart.Position = part1.Position:Lerp(part2.Position, i)
	newPart.Color = part1.Color:Lerp(part2.Color, i)
end

Results with:

We can also use this to create a somewhat smooth animation between the 2 parts:

local part1 = workspace:WaitForChild('Part1')
local part2 = workspace:WaitForChild('Part2')

local newPart = part1:Clone()

while true do
	for i = 0,1, 0.01 do
		newPart.Parent = workspace
		newPart.Position = part1.Position:Lerp(part2.Position, i)
		newPart.Color = part1.Color:Lerp(part2.Color, i)
		task.wait()
	end	
	for i = 1,0,-0.01 do
		newPart.Parent = workspace
		newPart.Position = part1.Position:Lerp(part2.Position, i)
		newPart.Color = part1.Color:Lerp(part2.Color, i)
		task.wait()
	end	
end

You will notice that it is similar to tweening, that’s because tweening uses lerping on the backend.

Lerping UDim2s is the same pretty much:

local frame1 = script.Parent:WaitForChild('Frame1')
local frame2 = script.Parent:WaitForChild('Frame2')

local newFrame = frame1:Clone()
newFrame.Parent = script.Parent

while true do
	for i = 0,1, 0.01 do
		newFrame.Position = frame1.Position:Lerp(frame2.Position, i)
		newFrame.BackgroundColor3 = frame1.BackgroundColor3:Lerp(frame2.BackgroundColor3, i)
		task.wait()
	end	
	for i = 1,0,-0.01 do
		newFrame.Position = frame1.Position:Lerp(frame2.Position, i)
		newFrame.BackgroundColor3 = frame1.BackgroundColor3:Lerp(frame2.BackgroundColor3, i)
		task.wait()
	end	
end
9 Likes