GraphEditor Plugin(Create custom easing styles)

Resources Community Resources
#1

Found myself wanting a plugin that lets me create arbitrary curves(custom EasingStyles basically) for animation transforms.

With this tool you can create any curve you want, and the exported modulescript has a function that lets you get the corresponding Y value for any X value. Much like how TweenService:GetValue(x) works

Here it is if anyone else would find use in it

87 Likes
#2

Dude, I’ve never knew you could create custom easing styles until now. This looks awesome :+1:

5 Likes
#3

OH MY GOD

GOD JUST ACCEPTED MY PRAYER! I WAS LITERALLY LOOKING HOW TO CREATE CUSTOM EASING STYLES YESTERDAY!

Enough with caps, this is an awesome resource! 110% gonna use this!

6 Likes
#4

Accidentally kept a testing line in there that was throwing errors, make sure to update the plugin

#5

Awesome plugin

1 Like
#6

It looks great, mate.
Now i have questions:

  • How can i use the custom Tween on a script, or animation?
  • How it works?
  • It was a pain to code?
  • And final question: Are you satisfied with the final product?

~DarkGames.

1 Like
#7

The exported module returns a function which returns the Y value for any given X, similar to TweenService:GetValue() You can use this as you please, I use it for interpolating procedural animation transforms

1 Like
#8

how can i use this in a script? i am a little confused

EDIT:
nevermind i got it ty tho

2 Likes
#9

I don’t quite understand how you would use this while tweening, coukd you maybe give us a example code?

#10

normally you can interpolate things with linear interpolation like this

alpha = math.clamp(elapsedTime/1,0,1)
a:lerp(b,alpha)

this is linear interpolation though, so you can use other types of interpolation on that alpha to produce a different curve

TweenService:GetValue() exists for this, but you can also use this plugin if you want your own curves

#11

Hey, I found a bug within your plugin. If you pan in studio with the plugin enabled, you can’t zoom in studio anymore.

Moreover, the bug is fixed if you press F to focus on an object, or disable your plugin.

1 Like
#12

For those of you trying to figure out how to use this as a substitute for tweening service, here is how I utilized it:

local ExportedCurve = require(game.ReplicatedStorage.ExportedCurve)

local duration = 5
local startTime = tick()
local connection

connection = game:GetService("RunService").Heartbeat:Connect(function()
	local elapsedTime = tick() - startTime
	local progress = elapsedTime / duration

	if progress >= 1 then
		progress = 1
		connection:Disconnect()
		script.Parent:Destroy()
	end

	script.Parent.Transparency = ExportedCurve:Get(progress)
end)

Hopefully this helps someone.

8 Likes
#14

this is very helpful - however how would i make this correlate from one CFrame to another?

#15

You can do that using CFrame:Lerp()

Changed a bit @PRIC3L3SS’s code

local ExportedCurve = require(game.ReplicatedStorage.ExportedCurve)

local duration = 5
local startTime = tick()
local connection

local target = Instance.new("Part")
local start = CFrame.new(0, 0, 0)
local goal = CFrame.new(0, 1, 0)

connection = game:GetService("RunService").Heartbeat:Connect(function()
	local elapsedTime = tick() - startTime
	local progress = elapsedTime / duration

	if progress >= 1 then
		progress = 1
		connection:Disconnect()
	end

	target.CFrame = start:Lerp(goal, ExportedCurve:Get(progress))
end)
2 Likes