UltimateUI guide

How to add UI open and close animations

In this guide, you will learn how to add open and close animations

You can add open and close UI animations to make the interface look better.

This can be done easily by adding an animation section at the beginning of the .yml file, right under the name section.

ini

name: profile
animation:
  open:
    effect: uui_animation
  close:
    usehud: true
    effect: uui_animation

Additionally, usehud ensures that when the UI is closing, the player can already move while the closing animation is still playing.

Furthermore, effect refers to animations stored in the effects folder. You can use them to animate elements on hover, click, or when the UI is opened.

Below is an example UI animation that moves the UI upward when it is opened.

ini

id: uui_animation
name: Example animation
close-reversed: true
type: move
amount-percent: 0
move-x: 0
move-y: -200
start-y: 200
opacity-delta: 0
rotation-deg: 0
duration-ms: 450
interpolation: ease-out