DefAnimator, visual animator for Defold

As some of you might have read on our public slack, we have had two hack days this week where we had the opportunity to do some fun projects using Defold. I decided to do something I have been thinking about for a while, a tool created in Defold! So without a long introduction, let me introduce my hack result; DefAnimator 0.1 :slight_smile:

Screenshot

Video

http://forum.defold.com:/uploads/default/original/2X/2/21e09c9b794c40191a4dc8c2f6e13639d436c16e.mov

DefAnimator is a (super non-official ;)) visual animation tool built as a regular Defold project. The idea is that you can use it to author simple GO animations visually with keyframes, then save the animations as Lua-modules and use in your own game/project.

The output from the save functionality creates a Lua module that returns a function consisting of chained go.animation calls.

Example usage

local my_animation = require "my_animation" -- my_animation.lua was saved using the tool and is located in the project directory

function init(self)
    my_animation("gameobject_id") -- starts the generated animation on GO /gameobject_id
end

Implementation details

  • GUI was done using dirtylarry, with some modifications and custom ā€œthemeā€.
  • Some OS native interaction using LuaJit FFI, including:
    • Native ā€œSave/Open Fileā€ dialogs using defold-dialogs
    • Native context menus using a lib Iā€™m planning to release soon-ish. :slight_smile:

Future plans

  • Being able to use DefAnimator as a library in your own project. Meaning that you could in theory just depend on DefAnimator to animate your own GOs (create a .collection with your own GO, add the supplied defanimator.gui and it ā€œShould just work ā„¢ā€.

Download

I want to release it as open source eventually, but for now here is a (a bit buggy :smiley: ) OSX version.
DefAnimator.zip (2.3 MB)

Known bugs and limitations

  • The timeline is a bit wonky, you can only select keyframes on the current property you have selected (visualised as lighter gray in the left most column).
  • Playback preview does not loop.
  • Playback preview does not handle different easing options, but the saved file will.
  • Opening/Loading previously saved animations does not work currently.
18 Likes

This is a really brilliant showcase of what can be done with Defold and Lua. Well done Sven!

5 Likes

I am really looking forward to checking this out.

4 Likes

I try to use your program.
When I clicked to ā€œSave Asā€ nothing happens.

1 Like

Whoops, my bad! Fixed and updated the Zip in the original post, but here is a direct link: DefAnimator.zip

2 Likes

Eheh was searching for something else and this came back.

Wish we had something similar in the editor :wink: :wink:

5 Likes

I can die for it :dagger: (and then respawn to use it :ghost: ) :wink:

5 Likes

whatā€™s going on about it now?
after 3 yearsļ¼Ÿ

hi! Is there any chance I could get a working version of this? The archive is damaged and canā€™t be opened (not the zip, the app itself)

1 Like

Can you try this version @88.josh?
animator_0.2.zip (2.4 MB)

@COCO havenā€™t made any progress on this, I really should release it open source. :thinking:

1 Like

Okay, I can open the app, but it appears to immediately close. thatā€™s a shame. Iā€™d really love to have a play around with this! donā€™t worry if itā€™s too much work

Could you try running the binary inside the app folder through a terminal? Animator.app/Contents/MacOS/Animator
You should be able to see the logs there since I build it for debug.

INFO:DLIB: Log server started on port 53029
INFO:ENGINE: Engine service started on port 8001
INFO:ENGINE: Defold Engine 1.2.162 (e07f3bb)
INFO:ENGINE: Loading data from: dmanif:/Users/joshrackstraw/Downloads/animator_0.2/Animator.app/Contents/Resources/game.dmanifest
INFO:ENGINE: Initialised sound device ā€˜defaultā€™
ERROR:SCRIPT: main/dialogs.lua:5: dlopen(native_libs/nfd, 5): image not found
stack traceback:
[C]: in function ā€˜loadā€™
main/dialogs.lua:5: in main chunk
[C]: in function ā€˜requireā€™
main/main.gui_script:3: in main chunk
WARNING:RESOURCE: Unable to create resource: /main/main.gui_scriptc
WARNING:RESOURCE: Unable to create resource: /main/main.guic
WARNING:RESOURCE: Unable to create resource: /main/main_generated_1.goc
ERROR:GAMEOBJECT: Could not instantiate game object from prototype /main/main_generated_1.goc.
WARNING:RESOURCE: Unable to create resource: /main/main.collectionc
logout
Saving sessionā€¦
ā€¦copying shared historyā€¦
ā€¦saving historyā€¦truncating history filesā€¦
ā€¦completed.
Deleting expired sessionsā€¦109 completed.
[Process completed]

Ahhhh, right! Now I remember, I had to do some hack to get dynamic images to load. Let me see if I remember what I actually did. :slight_smile:

Managed to remember what I did last time, actually wrote a thing about it apparently. (http://svenandersson.se/2016/loading-dynamic-libraries-from-inside-macos-app-folder.html) :slight_smile:

Fixed version: animator_0.2.1.zip (2.4 MB)

5 Likes

Okay, I canā€™t get this one to work either. And you know what? Iā€™m going to have to make this myself (unless sven can make it open source :sweat_smile:)

Key features:

Ability to animate tint, scale, euler, position using keyframes along a timeline.

I think thatā€™s it. Even if I have to import images myself in the editor and get the animations out via debug everytime i want to do this, itā€™s still going to be useful for me.

4 Likes

Release the source, Sven. We will fix it. The Collective has spoken.

4 Likes

My efforts are not going badly! I have timelines and I can select different objects and different points on the time line. I also have a play button.

the only downside is that I have no idea how to actually do the animations once the play button is pressed. My idea is that for each attribute to animate (i.e. ā€œposition.xā€ to create a table with

  1. the object,
  2. the attribute,
  3. a nested table with the keyframes and target values

{
"gui.get_node(ā€œobject1ā€), ā€œposition.xā€, {0 = 0, 0.5 = 0, 1 = 20}
}

the target animation here would be the position.x waiting for the first half of the animation, then sliding to 20 during the second half. And aside from actually doing the animation, Iā€™d also like to print something like gui.animate(ā€œobject1ā€ā€¦) in the debug. And even then i wonā€™t be able to do automatic easing.

Any help?

4 Likes

okay got it! like in Svenā€™s example, itā€™s chained animations using callbacks! and that means you CAN do easing! okay WE DONā€™T NEED THE SOURCE CODE ANYMORE, Iā€™M GONNA MAKE THE SOURCE CODE MYSELF

edit: I DONā€™T KNOW HOW TO DYNAMICALLY CREATE FUNCTIONS CAN ANYONE HELP
edit: OKAY I THINK I CAN USE A GENERIC FUNCTION AND A COUNTER AND MSG.POST()

6 Likes

Maybe you could push your project on Github so we can help developing it? :wink:

P.S. I wish there could be more hackathon days in Defold team! :heart_eyes: Maybe even we can prepare something like that, in community? What do you think? :wink:

3 Likes