How can I make Animated UI like this?

Hey Developers!!!

I am currently working on a game, and I am so interested to know how I can make animated User Interface. I have found a cool reference from online, and wanted to know if it’s even possible to do this, and if so, what would be the most efficient way?

Reference:

6 Likes

Sprite sheet. They’re a pain to make but there’s a program called Chasys that is really excellent for making GIFs/sprite sheets

11 Likes

To expand on this response, Sprite sheets will work well for the animated elements of the UI, such as the green wires, and the gear, even the green test tube part. Personally I would segment the different elements of the entire spin UI as such

Image Frame -
Background image, Including the all elements that are static
The Green tube, and cracked rock square thing-a-magig, because they both seem to simply move/scale location

image Frames set to rotate through sprite sheets -
Right most green “wires/tubes”, Rope/gear

Scroll frame or set of clipped image frames -
Spin results

Image Buttons -
“SPIN” and “X” buttons

Text frame -
Content area

6 Likes

Can you throw me a link to the website that I can download/buy this software from?

Sure thing: John Paul Chacha's Lab - Chasys Draw IES - Product Homepage

1 Like