Problem Statement:
As a long time Roblox developer, one thing that I always dread doing is UI animation. As of right now, all UI must be animated with code, tween service, etc., and at times it can be difficult or confusing(especially for new developers and non-programmers) when attempting to get the effect you want.
Proposed Solution:
Recently, I’ve been doing some other personal projects in Unreal, and absolutely LOVE their approach to animation UI: Keyframe animation identical to 3D models.
As you can see in the gif above, animation is as easy as selecting the properties you want to transform. Be it the object’s scale and transform modifiers, its location, rotation, opacity, color and the like. Every aspect can be keyed in the timeline while the engine handles transitions between the keys. This makes it easy to make UI animations that squash, stretch, bounce, fade, spin and more in under a minute.
Roblox could do a similar implementation to its 3D animation editor, and could probably even use the bones of that system for this one. Users would be able to select their UI object and create an animation for it that could be saved and published like 3D animations. Then, in scripts, users would simply call the animation for the UI element and be on their way.
Use Cases:
- Developers would be enabled to quickly and efficiently create UI animations for use in their games.
- It would enable non-programmers such as UI artists to quickly develop polished and animated UI.
- Individual UI pieces such as text labels, image buttons and more can be animated with ease.
- Animated billboards and signs in game.
Conclusion:
UI is an undeniably important aspect of development, and polished UI is becoming a far more prominent “must have” for many games on Roblox. If Roblox is able to address this issue, it would improve the development experience for not just me, but all users, as it would simplify the animation process for UI and make it easier and more accessible to add that cherry-on-top polish to our games.