# Panthera - Animation Software for Defold

**URL:** <https://forum.defold.com/t/panthera-animation-software-for-defold/71276>\
**Category:** The Defoldmine\
**Created:** [July 17, 2022, 12:35pm UTC](https://forum.defold.com/t/panthera-animation-software-for-defold/71276 "2022-07-17T12:35:24Z")\
**Posts on this page:** 20\
**Page:** 1

<div class="post-metadata">

**Author:** ![Insality](https://forum-defold.b-cdn.net/user_avatar/forum.defold.com/insality/32/39737_2.png) [@Insality](https://forum.defold.com/u/Insality)\
**Post date:** [July 17, 2022, 12:35pm UTC](https://forum.defold.com/t/panthera-animation-software-for-defold/71276/1 "2022-07-17T12:35:24Z")

</div>

[![panthera_logo](https://defold-forum-bucket.nbg1.your-objectstorage.com/original/3X/6/f/6f42d2df05812e3968244a7f260721537d232bf6.png)](https://github.com/insality/panthera-editor/)

[![Github-sponsors](https://img.shields.io/badge/sponsor-30363D?style=for-the-badge&logo=GitHub-Sponsors&logoColor=#EA4AAA)](https://github.com/sponsors/insality) [![Ko-Fi](https://img.shields.io/badge/Ko--fi-F16061?style=for-the-badge&logo=ko-fi&logoColor=white)](https://ko-fi.com/insality) [![BuyMeACoffee](https://img.shields.io/badge/Buy%20Me%20a%20Coffee-ffdd00?style=for-the-badge&logo=buy-me-a-coffee&logoColor=black)](https://www.buymeacoffee.com/insality)

**Panthera** - the online tool for visual creation animation for **Defold**

**Panthera** main purpose - give your the huge speed up at Defold animation flow even with more accuracy. You not required to do animations via code and run the game every change to see the changes. Make animations in the **Panthera** and export it via code right into the game!

[**Panthera Online Editor Link**](https://insality.github.io/panthera-editor/editor)  
[**Panthera Editor GitHub**](https://github.com/Insality/panthera-editor/)

## Overview

**Panthera** is the online editor for animation, made for Defold on [Druid](https://forum.defold.com/t/druid-component-gui-library/64857). I’ve start this project for myself to make easier animation creation for a lot of stuff (I’ve used it almost for GUI simple animations)

Since the workflow: “write animate code → build → test → repeat” is a quite time consuming, it’s should help you 🙂

You can see twitter thread with some gifs of this editor: [https://twitter.com/insalitygames/status/1538076834709049344](https://twitter.com/insalitygames/status/1538076834709049344)  
You can see the Panthera GUI export example here: [-- The animation file is generated with Panthera Animation Software-- https:// - Pastebin.com](https://pastebin.com/uasaKDYi)

Also there is a small tutorial video to get primary ideas of Panthera: in 7 minutes

[![](https://img.youtube.com/vi/RBFfNuKLeBk/maxresdefault.jpg "Panthera Editor Introduce Tutorial | Defold Animations") ](https://www.youtube.com/watch?v=RBFfNuKLeBk)

### Online editor features

- Custom online editor, full [Druid](https://github.com/Insality/druid/) powered **Defold** project
- Several animations per project are supported!
- Export animation as code for GO and GUI nodes to _Defold_ via animate functions.
- Ability to copy export code directly without download file flow
- Properties supported: _position_, _scale_, _size_, _rotation_, _color_, _slice9_
- Add different triggers at specific time (events, set node state, set images and set pivot)
- Use stub node or upload image for every node
- Create you nodes layout as in your game scene or export \*_.gui_ or \*_.collection_ files right into the editor!
- Save, load, copy, import or export your projects

### Manual

[See the Manual here](https://github.com/Insality/panthera-editor/blob/main/docs/Manual.md) to learn Panthera Editor

### Issues and Suggestions

If you have any issues, questions or suggestions please [create an issue](https://github.com/Insality/panthera-editor/issues) or write right here!

### Note

It’s first **Panthera** Demo release. Probably a lot of stuff will work bad, also undo/redo is currently disabled (and autosave works not pretty well without it, so use save button now)  
I need your comments and experience with this.

There are a lot of things to do, like animation list, more export variants, more control etc. But it will be in the future 🙂

---

<div class="post-metadata">

**Author:** ![Insality](https://forum-defold.b-cdn.net/user_avatar/forum.defold.com/insality/32/39737_2.png) [@Insality](https://forum.defold.com/u/Insality)\
**Post date:** [July 17, 2022, 12:36pm UTC](https://forum.defold.com/t/panthera-animation-software-for-defold/71276/2 "2022-07-17T12:36:34Z")

</div>

Here is example of exported animation, works for GUI and GO  
But GO have several restrictions, so size and slice9 property will be not animated

---

<div class="post-metadata">

**Author:** ![88.josh](https://forum-defold.b-cdn.net/user_avatar/forum.defold.com/88.josh/32/20137_2.png) [@88.josh](https://forum.defold.com/u/88.josh)\
**Post date:** [July 17, 2022, 2:54pm UTC](https://forum.defold.com/t/panthera-animation-software-for-defold/71276/3 "2022-07-17T14:54:33Z")

</div>

Omg this looks absolutely amazing. I’ve actually tried to make something like this but I found creating it was taking longer than the slow method of code - test - recode. I cannot wait to get started on this and will download it first thing tomorrow morning. Thanks for your hard work.

---

<div class="post-metadata">

**Author:** ![britzl](https://forum-defold.b-cdn.net/user_avatar/forum.defold.com/britzl/32/23_2.png) [@britzl](https://forum.defold.com/u/britzl)\
**Post date:** [July 17, 2022, 5:56pm UTC](https://forum.defold.com/t/panthera-animation-software-for-defold/71276/4 "2022-07-17T17:56:50Z")

</div>

Well done @Insality ! This will be useful to a lot of Defold developers.

---

<div class="post-metadata">

**Author:** ![SkaterDad](https://forum-defold.b-cdn.net/user_avatar/forum.defold.com/skaterdad/32/41137_2.png) [@SkaterDad](https://forum.defold.com/u/SkaterDad)\
**Post date:** [July 20, 2022, 3:53am UTC](https://forum.defold.com/t/panthera-animation-software-for-defold/71276/5 "2022-07-20T03:53:29Z")

</div>

I’m really looking forward to trying this. Looks amazing!

I was trying to animate a main menu intro and background, and this seems like it will save me tons of time.

---

<div class="post-metadata">

**Author:** ![TheKing0x9](https://forum-defold.b-cdn.net/user_avatar/forum.defold.com/theking0x9/32/13588_2.png) [@TheKing0x9](https://forum.defold.com/u/TheKing0x9)\
**Post date:** [July 20, 2022, 3:02pm UTC](https://forum.defold.com/t/panthera-animation-software-for-defold/71276/6 "2022-07-20T15:02:55Z")

</div>

Used this yesterday to set up a sequence for my game, and I was amazed by how easy the process became when using Panthera. While normally it would have taken several hours of work to get something working, I was able to get it done within just an hour.  
Thanks for creating this awesome and much needed tool ❤

---

<div class="post-metadata">

**Author:** ![Insality](https://forum-defold.b-cdn.net/user_avatar/forum.defold.com/insality/32/39737_2.png) [@Insality](https://forum.defold.com/u/Insality)\
**Post date:** [July 20, 2022, 3:59pm UTC](https://forum.defold.com/t/panthera-animation-software-for-defold/71276/7 "2022-07-20T15:59:34Z")

</div>

Thanks! This is sounds great!  
I’m glad what Panthera can save you a hours of work!

Probably, you can share your results here. All is ok working?

---

<div class="post-metadata">

**Author:** ![TheKing0x9](https://forum-defold.b-cdn.net/user_avatar/forum.defold.com/theking0x9/32/13588_2.png) [@TheKing0x9](https://forum.defold.com/u/TheKing0x9)\
**Post date:** [July 22, 2022, 1:05pm UTC](https://forum.defold.com/t/panthera-animation-software-for-defold/71276/8 "2022-07-22T13:05:41Z")

</div>

> [@Insality](#):
>
> Probably, you can share your results here.

It still is missing some finishing touches, will definitely share later.

> [@Insality](#):
>
> All is ok working?

Yep. Loved the experience of using it. Everything felt well designed and smooth. Even the exported file is very readable and easy to edit to add more custom logic.

---

<div class="post-metadata">

**Author:** ![Ragetto](https://forum-defold.b-cdn.net/user_avatar/forum.defold.com/ragetto/32/32785_2.png) [@Ragetto](https://forum.defold.com/u/Ragetto)\
**Post date:** [July 22, 2022, 6:07pm UTC](https://forum.defold.com/t/panthera-animation-software-for-defold/71276/9 "2022-07-22T18:07:59Z")

</div>

Wow it looks amazing

I’ll give it a try as soon as possible 🕶

Thank you!

---

<div class="post-metadata">

**Author:** ![sven](https://forum-defold.b-cdn.net/user_avatar/forum.defold.com/sven/32/1086_2.png) [@sven](https://forum.defold.com/u/sven)\
**Post date:** [July 23, 2022, 3:52pm UTC](https://forum.defold.com/t/panthera-animation-software-for-defold/71276/10 "2022-07-23T15:52:45Z")

</div>

This is fantastic! Exactly what I intended for my old defanimate-project, but so much more polished, great work! 😃

---

<div class="post-metadata">

**Author:** ![Insality](https://forum-defold.b-cdn.net/user_avatar/forum.defold.com/insality/32/39737_2.png) [@Insality](https://forum.defold.com/u/Insality)\
**Post date:** [October 26, 2022, 9:08pm UTC](https://forum.defold.com/t/panthera-animation-software-for-defold/71276/11 "2022-10-26T21:08:35Z")

</div>

# Panthera 0.8 Release

![promo_animations](https://defold-forum-bucket.nbg1.your-objectstorage.com/original/3X/f/1/f181f89c6cb31f395fdffe48796fd292d4574c37.gif) ![promo_copy](https://defold-forum-bucket.nbg1.your-objectstorage.com/original/3X/0/9/099aa5831b8cafbc00b49167c70bec0615c07a56.gif)

Hello! Here is the update for **Panthera Editor**. I’m using it pretty often, so I adjust several stuff to work with it in more comfortable way.

So, here is rough changelog:

- **Animations**! Now we able to create several animations for one node setup in the Editor. On export, different animations will be exported in different functions. The exported code API slightly changed:
  - `Animation.create(nodes, options, is_skip_autoplay)`. In options you able to define default animation. By default it is “default” 😃 . The `is_skip_autoplay` says don’t play animation at start.
  - `Animation.play(animation, options)`. Now you able to override default options, pointed on creation. This options is: `animation_id`, `speed`, `is_loop`, `is_relative`, `is_skip_init`, `callback` and `callback_event`.
  - The `is_skip_init` flag is required to don’t setup node initial state on animation start. It can be useful to escape the sharp transitions between animations.
  - Panthera project format was changed, but there is migration and all should be ok.

- **Code Export**! The HTML export was improved. Now it can remember your last save path. And more important feature is **Copy Export**
  - **Copy Export** allows you copy animation code directly from **Panthera Editor**. It also can speed up your animation setup workflow, since it’s just copy & paste
  - Two buttons on status bar with _Copy Export_ and _Export_ to allows you don’t open the project window to do export 🎉

- **More node setup**! I’ve added the `blend mode` and `is enabled` to node settings. Blend mode was required for me to better adjust animations for lights and other types of particles. With `is enabled` you can setup initial node state without spawn trigger key at animation start.
- **Hotkeys changed**! Now hotkeys assigned mostly to `SHIFT + (X)` due the HTML version. It should work better now
- **Undo/Redo**! Still disabled 😆. Since it not very critical for me, but sometime!
- **JSON Project Export**! Now include every used image, so you can easily share animation project between your computers or even with your teammates (also in VCS too?)

Link as always on **[GitHub](https://github.com/insality/panthera-editor/)**

Have a good day 🤍

---

<div class="post-metadata">

**Author:** ![ainonovo](https://forum-defold.b-cdn.net/user_avatar/forum.defold.com/ainonovo/32/27068_2.png) [@ainonovo](https://forum.defold.com/u/ainonovo)\
**Post date:** [November 3, 2022, 12:49pm UTC](https://forum.defold.com/t/panthera-animation-software-for-defold/71276/12 "2022-11-03T12:49:51Z")

</div>

how this work? please learn me. I cant move box ((

video on this forum cant see

---

<div class="post-metadata">

**Author:** ![Insality](https://forum-defold.b-cdn.net/user_avatar/forum.defold.com/insality/32/39737_2.png) [@Insality](https://forum.defold.com/u/Insality)\
**Post date:** [November 4, 2022, 8:59am UTC](https://forum.defold.com/t/panthera-animation-software-for-defold/71276/14 "2022-11-04T08:59:14Z")

</div>

> [@ainonovo](#):
>
> how this work? please learn me. I cant move box ((

Hello! You can read the [Panthera’s Manual here](https://github.com/Insality/panthera-editor/blob/main/docs/Manual.md)

In short: then time on timeline is zero, you change the initial state of the current animation. If you move timeline to any other time - you can add a timeline keys of changed properties by changing them and click on property with 🔶 icon

---

<div class="post-metadata">

**Author:** ![Karim\_Ahmed](https://forum-defold.b-cdn.net/user_avatar/forum.defold.com/karim_ahmed/32/22865_2.png) [@Karim\_Ahmed](https://forum.defold.com/u/Karim_Ahmed)\
**Post date:** [November 8, 2022, 12:02am UTC](https://forum.defold.com/t/panthera-animation-software-for-defold/71276/15 "2022-11-08T00:02:26Z")

</div>

Awesome job! It is working great and very efficient. Any plans to opensource it? for people to add features to it?

Thanks

---

<div class="post-metadata">

**Author:** ![Insality](https://forum-defold.b-cdn.net/user_avatar/forum.defold.com/insality/32/39737_2.png) [@Insality](https://forum.defold.com/u/Insality)\
**Post date:** [November 8, 2022, 7:59am UTC](https://forum.defold.com/t/panthera-animation-software-for-defold/71276/16 "2022-11-08T07:59:04Z")

</div>

> [@Karim\_Ahmed](#):
>
> Awesome job! It is working great and very efficient. Any plans to opensource it? for people to add features to it?

Thanks for the feedback!

Sorry, currently I have no any plans to opensource it. But if you have any suggestions or improves, you can make an issue at github and make some donations to prioritize somehow your features 😃

---

<div class="post-metadata">

**Author:** ![Insality](https://forum-defold.b-cdn.net/user_avatar/forum.defold.com/insality/32/39737_2.png) [@Insality](https://forum.defold.com/u/Insality)\
**Post date:** [November 8, 2022, 7:48pm UTC](https://forum.defold.com/t/panthera-animation-software-for-defold/71276/17 "2022-11-08T19:48:09Z")

</div>

I made the introduction / tutorial video to get faster into Panthera

In this video we will create simple slider GUI component animation:  
 ![panthera_slider_tutorial](https://defold-forum-bucket.nbg1.your-objectstorage.com/original/3X/e/4/e4e92f70c53f33455dff4d0c23d71887eafdd010.gif)

Introduction covers:

- Animation create with import images and \*gui file
- Add several animations, create timeline keys
- Import animation into Defold and run it
- Show workflow how to update animation faster via just copy/paste
- Several options and how it’s affected on animation
- How to bind nodes directly into animation

In just 7 minutes!

[![](https://img.youtube.com/vi/RBFfNuKLeBk/maxresdefault.jpg "Panthera Editor Introduce Tutorial | Defold Animations") ](https://www.youtube.com/watch?v=RBFfNuKLeBk)

---

<div class="post-metadata">

**Author:** ![Lex](https://forum-defold.b-cdn.net/user_avatar/forum.defold.com/lex/32/23856_2.png) [@Lex](https://forum.defold.com/u/Lex)\
**Post date:** [November 11, 2022, 9:23am UTC](https://forum.defold.com/t/panthera-animation-software-for-defold/71276/18 "2022-11-11T09:23:32Z")

</div>

Amazing work!! Thanks so much for this. Can’t wait to build nice GUI animations.  
BTW, you work on Druid (especially the grid/datalist components) makes my life sooo much easier, I thank you every day that I’m using your library! Keep up the good work!

---

<div class="post-metadata">

**Author:** ![COCO](https://forum-defold.b-cdn.net/user_avatar/forum.defold.com/coco/32/38692_2.png) [@COCO](https://forum.defold.com/u/COCO)\
**Post date:** [November 11, 2022, 1:22pm UTC](https://forum.defold.com/t/panthera-animation-software-for-defold/71276/19 "2022-11-11T13:22:59Z")

</div>

Looks amazing! Can’t wait to play with it. 😆

---

<div class="post-metadata">

**Author:** ![ainonovo](https://forum-defold.b-cdn.net/user_avatar/forum.defold.com/ainonovo/32/27068_2.png) [@ainonovo](https://forum.defold.com/u/ainonovo)\
**Post date:** [November 12, 2022, 4:28pm UTC](https://forum.defold.com/t/panthera-animation-software-for-defold/71276/20 "2022-11-12T16:28:53Z")

</div>

maybe you can do checkbox with play all list animation repeatly? from first list item to last

---

<div class="post-metadata">

**Author:** ![Insality](https://forum-defold.b-cdn.net/user_avatar/forum.defold.com/insality/32/39737_2.png) [@Insality](https://forum.defold.com/u/Insality)\
**Post date:** [November 13, 2022, 9:17am UTC](https://forum.defold.com/t/panthera-animation-software-for-defold/71276/21 "2022-11-13T09:17:50Z")

</div>

> [@ainonovo](#):
>
> maybe you can do checkbox with play all list animation repeatly? from first list item to last

There is no sense to make this in animation

You can do it via animation callbacks, something like:

```lua
animation_file.play(animation_data, {
	animation_id = "anim1",
	callback = function()
		animation_file.play(animation_data, {
			animation_id = "anim2",
			callback = function()
				-- play other
			end
		})
	end
})

```

[Next page](https://forum.defold.com/t/panthera-animation-software-for-defold/71276.md?page=2)
