PhaserJS Integration examples?

Hi I am curious if there are any examples of using Synfig in a phaserjs project. I am looking to have skeletal animations to save on memory of loading entire sprite sheets. I have seen this youtube video using Synfig with phaserjs but no context to whether the animation was exported as a skeleton and bones or a sprite sheet.

Has there been anyone in the community which has worked on importing Synfig projects into Phaserjs?

Hi and welcome here :slight_smile:
From what we can see from the Render dialog, the render is done as an export of a sequence of 32x32 .png files (with transparency).

Sequence because “render current frame only is unchecked” and the target is “Auto” (parameters is disabled)
You would need to use png-spritesheet as a module and set up the parameters (rows/columns) for an actual spritesheet

2 Likes

Is there any plans to make a working bones binary for Phaser.Js to use? This way it would save a lot of work and resources by eliminating the need to create sprite sheets and instead use just the bone JSON data and binary to run the animations with very few images. Thank you for all the great work you have done in Synfig. It’s a great resource for everyone.

If we have the information for how the JSON data and the binary to work, why not, but PhaserJS compatibility is not panned (I even didn’t know it before this thread lol)

From what I can find as examples online for animation from json, using the Developper Tools of the browser :

[Phaser - Examples - v3.85.0 - animation - From Animation Json]
This animation is made from a spritesheet and a JSON describing each sprite
https://cdn.phaserfiles.com/v385/assets/tests/columns/gems.json
https://cdn.phaserfiles.com/v385/assets/tests/columns/gems.png
And another one that are the parameters of the animation (mostly a listing of the sprites to use)
https://cdn.phaserfiles.com/v385/assets/animations/gems.json

I think that you are more interested is Spine animation like
[Phaser - Examples - v3.85.0 - spine4 - Webgl Test 1]
which is a lot different, and not supported by Synfig at the moment

Edit : Resources for Spine
[Spine: JSON export format]
[Spine: Binary export format]
[Spine: Runtimes]