[0.2] Tween Tester: A tween previewer plugin

Tween Tester is a free plugin that allows the user to preview tweens being affected on UI before play testing.

This saves a bunch of time because you don’t have to keep on play testing to see the effect happen; instead, you can preview that effect right in front of your eyes without touching that play button!

The plugin’s UI is beginner friendly, so there isn’t any complicated spots in this plugin. There is more to come with this plugin, so take note that this plugin will get updated as time goes by.

Preview of the plugin:

Download the plugin here!

Update Logs
0.1
  • This plugin was born :sparkles:
0.2
  • Brand new Interface for the plugin!
  • A built-in help center for the plugin!
  • More tween animations for the user to test around with, including a way to even customize your own tween path!

Do you think this plugin will be useful for you?

  • Yeah
  • Meh
  • No

0 voters

12 Likes

Cool, I could use this

How does it work? Do you select what you want to tween?

Does this work for models or only UI?

The button that says “In” is the EasingDirectionButton. Click that button to change the EasingDirection, and the textbox that says “EasingStyle” is where you type in the EasingStyle you want to use.

Here’s the list of those EasingStyles if you need them! EasingStyle | Documentation - Roblox Creator Hub

As of right now you’ll be only given just an image to test around with. I’m going to expand on more stuff you can potentially use in the future of this plugin.

Also this is a future idea I have planned, but as of right now it only works with UI.

0.0.0.0.0.0.0.0.0.0.0.0.0.1

You can tell how EasingStyle will look by name or description of Enum.EasingStyle, so it’s pretty useless. Maybe you should add UDim2(position/size)/Vector3(position/size/orientation) previews. They’re useful more than UDim2 Size

I’ll definitely add more controls over position and size for UDim2, but 3D spaces like Vector3 is something I’ll handle later in the future. Right now the plugin is only associated with UI tweening, but I am going to make it so that it’ll work on 3D spaces.

I mean personally I picked this style in writing versions so it’ll just cover some small updates lol.

This feels more like a helping thing for people to see how Tween actually looks like.

But you should add Buttons to make it seem better instead of typing it in.

Yeah in the next update I’ll definitely redesign the control panel. :sweat_smile:

1 Like

Can i use this plugin to start tweening any object?

Well it’s free to use so go ahead, but this plugin only shows how it’ll look like for UI tweening. Soon I’ll make it so that it’ll support 3D tweening, such as using Vector3.

Hopefully that’ll answer your question!

1 Like

Basically just a previewer kind of plugin, if you understand what I’m saying.

Looks nice, great work! I’ll be using this. You should add code importing/exporting, editing the path, and other advanced tween options (does it just grow right now?)

Well I’m pretty new to making plugins. Any big huge changes will be a little bit delayed, so just remember that!

I think I’ll make a code exporter of everything that you tested with in the future. A code importer will be challenging, but I’ll try.

Yeah so far it’s just a growing tween animation. I’m planning to add more ways to make it so that you can test different tween animations. It’s just to make it more reliable to other kinds of tween animations, not just a growing tween animation.

1 Like

NEW UPDATE! 0.2
A new design as been finally released for Tween Tester!
image

Even a built-in help center?!
image

:bug: Known bug I’ll have to fix up soon!

  • Custom not working
  • ImageID not working
1 Like

Do you guys like the redesign I’ve done for Tween Tester?

  • Looks really sick!
  • Looks pretty decent
  • Looks bad to be honest.

0 voters

Upcoming update! Version 0.3!

Two new experimental features will be added to the plugin: 3D Tweening and Export to Script!

3D Tweening allows you to preview tween animations for 3D spaces! For example, a gate sliding open, the ground floating up and down, and more! Export to Script allows you to export the tween animations you’ve been previewing. There will be only two options you can choose to export from: LocalScript or Script.

WARNING: Before you check out the hidden details of the two experimental features, just remember that the visuals and some instructions might change because this isn’t final!

Understanding how 3D Tweening works in Tween Tester

Now you might be asking yourself, “How do you do this kind of thing?!” Well, it’s pretty simple, actually! You’ll be given two and only two parts; they’ll be your points for the tween animation.

TweenPointA is your starting point.
I highly recommend putting this part in the same position as the part you want to tween with. It’s your starting point, so it has to be in the original position, or else it might look a little bit funky during the preview of the tween in action.

TweenPointB is your end point.
There’s not much I could really describe about this other than it being your finishing goal.

Now if you want to find where all of these parts are found, check underneath workspace, and you’ll find a folder named “3DTweeningParts.”.

You can change each part’s size, but I highly recommend that they both should have the same size. It might affect the tween’s path before you preview it!

image

In order to actually get those two tween-point parts that I’ve talked about before, you’ll need to click on this button.

Now let’s get an example of 3D Tweening in action!

In this screenshot, we can see a huge door and myself. Now what if I wanted to make a tween animation of that door slowly opening? Well, let’s grab the two tween-point parts that I’ve talked about and start to position them in the correct fashion.

You’ll also need to select the object to tween with. In order to do this, you’ll need to click on the Object Selector button, then select your part and click the check mark button.

We’ll get something like this:

The first tween-point part is in the middle point of the door; this is to state the tween path that this is the starting point. The second tween-point part is at the far right; this is to also state on the tween path that this is the finishing point, or finishing line, etc.

Now what is different between 3D Tweening’s preview and UI Tweening’s preview is that UI Tweening has its own separate window to display everything that is going to happen. Meanwhile, 3D Tweening’s preview will all happen in front of you if you click “Preview.”.

Exporting tween animation to script

When you’re ready to export your tween animation, you’ll need to click “Export,” and then you’ll be given this separate window.

You can select which script type you want this tween animation to be exported to. Now, when you’re ready to export your tween animation, click the “Export!” button.

You’ll know if you done everything correctly when you’ll get this notice.

image

All of your exported scripts will be in ReplicatedStorage, then inside this folder named “TweenTesterExportedScripts.”.

image

Just by judging this upcoming update, how useful do you think this plugin could potentially be?

  • I think it’ll help me out a lot!
  • I mean it’s somewhat useful, but I wouldn’t use it.
  • I don’t really think it’s really that useful.

0 voters

Hello,
Did you finish the experimental updates and are they in the latest?

Thansk

Sorry, I’ve been working on a game of mine, so version 0.3 will come out in a few days due to my other project.

I’ll announce it when it’s out, so don’t worry.

I just want to announce this before anybody asks about when the update will come out. I’m dealing with something personal, so the update will be delayed.

I’ll try and see if I can get the update out before the end of May, but I hope you understand why Tween Tester’s upcoming update will be delayed.

But here’s some information I can give you that’s planned to be added to Tween Tester.

  • Error pop-ups with specific codes (all codes will be listed in the plugin’s built-in help center)
  • Update Notice Pop-up (When you have an outdated version of Tween Tester, this notice will pop up when you reopen the plugin.)
  • Draggable Windows
  • Redesign of the built-in help center
1 Like