The Export to Easel JS dialog allows you to export your game character as a sprite sheet, in which each animation frame in your scene is rendered as an individual sprite.
Since the Export to Easel JS dialog renders each frame in your scene, there will not be any visible difference between the way your character is rendered by Harmony and how it is rendered in your game engine.
However, the Export to Easel JS dialog has the following important limitations:
- Contrary to the Export to Sprite Sheet dialog, the Export to Easel JS only outputs a sprite sheet and an XML document delimiting each sprite in the sheet. Hence, they cannot be imported into Unity using the Harmony Game SDK package. You must program the logic to import those sprite sheets into your game engine yourself.
- The Export to Easel JS dialog does not export anchors and props.
- To export to Easel JS, you must separate your animation clips using scene versions. The Export to Easel JS dialog will not export separate animation clips if you have separated them using scene markers.
- Fully rendered sprite sheets are much heavier in size than rigged sprite sheets, which is what the Export to Sprite Sheet dialog exports.
- Do the following to add the Game toolbar to your workspace:
- In the top menu, select Windows > Toolbars > Game.
- Right-click on any existing toolbar and select Game.
The Game toolbar is added to your workspace.
- Open the base scene version for your character, that is: the scene version in which you built your character rig.
In the Game toolbar, click on the Export to Easel JS button.
The Export to Easel JS dialog appears.
Right of the Asset Path field, click on the ... button.
A folder select dialog opens.
Browse to and select the directory in which you want to create your asset directory.NOTEYou do not need to create a directory specifically for your exported assets. One will be created with the name in the Asset Name field.
- In the Asset Name field, type in the name of the directory in which to export your assets. This will also be the name of the GameObject in Unity.
- In the Display drop-down, select which Display node to render the character from:
- Unconnected Display will simply render everything visible in the scene.
- Display is the display node created by default when creating a scene. Typically, it also displays everything in the scene unless you connected it somewhere else.
- If you created more Display nodes in your scene, they should be in this list. Selecting any display node will only render what is visible to that Display node.
- In the Sprite Resolutions section, there is a list of all the resolutions in which your sprite sheets will be exported. Do the following to export in the resolutions you want your game support:
- To add a resolution, click on the Add Resolution button. A row will be added to the list. Double-click on each field in the new row to type in its name, its width and its height, in that order from left to right.
- To remove a resolution, select it in the list, then click on the Remove Resolution button.
- For most usages, the other default parameters in the dialog should be fine. To learn more about the parameters in the Export to Sprite Sheet dialog, refer to
Export to Easel JS Dialog Box.
Click on Export.
Harmony will export the sprite sheet for your base rig.
- Open the scene version for the first animation clip for your character.
- Repeat steps 3 to 10 to export the animation for this scene version. Make sure to export in the exact same directory in which you exported the sprite sheet for your base rig.
- Repeat for each scene version containing an animation clip for your character.