IK Constraint Basics - Spine Tips #5

May 3rd, 2023

We are happy to share a new Spine Tips tutorial video! This time we will learn how to setup inverse kinematics, also known as IK. You will find this useful for just about every Spine project.

In the last Spine Tips video we made a hip-spine-shoulder setup. This time we will make a hip-legs setup. If you watch these two videos, you will know how to make a basic bipedal skeleton.

Try to follow along and create the skeleton yourself using the project files found in the video's description.

Whether you are new to Spine or looking to improve your skills, you should find some valuable tips here. Stop by the Spine forum to share your animations done with this setup!

Have fun and happy animating!

Importing skeleton data

April 18th, 2023

There are cases where you have no Spine project but want to import a skeleton into Spine using exported files. This tutorial will guide you through the process.


Unpacking texture atlas pages

If you have individual images files that have not been packed into a texture atlas, then you can skip this step. If your images have been packed into a texture atlas, you need to unpack them before they can be used in the Spine editor. This can be done with the Spine UI or via the command line. It's best to use the latest version of Spine to unpack an atlas.

If the atlas was packed with premultiplied alpha, Spine needs to unpremultiply the alpha when unpacking. For an atlas packed with newer versions of Spine, the atlas file knows that the atlas images have premultiplied alpha. The unpacker will use this information from the atlas file, if it exists.

For an atlas packed with an older version of Spine, you will need to tell Spine whether the atlas images are premultiplied. The transparent parts of an image will appear dark when the image is premultiplied. Here is a comparison of premultiplied and non-premultiplied (straight alpha) images:


Unpacking with the UI

To unpack via the Spine UI:

  1. Make sure that the atlas file and the atlas images are in the same folder.
  2. Open the Spine editor and choose Texture Unpacker from the main menu.
  1. In the Texture Unpacker window:
    • Enter the path to the Atlas file. If your skeleton data has been exported for spine-unity, the file extension may be .atlas.txt, which will work fine.
    • Enter the Output folder, which is the path to the folder where you want the unpacked images to be stored.
    • Check Unpremultiply alpha if the atlas was packed with premultiplied alpha. If the atlas file has "pma:true", that will be used instead of this checkbox.

  1. Click Unpack. The individual image files will be created for each texture region in the atlas.

Unpacking with the CLI

To unpack via the command line interface (CLI), specify these parameters:

Spine --input <Path to folder of atlas images> --output <Path to write unpacked image files> --unpack <Path to texture atlas file>

You can also use the short command line parameters to do same:

Spine -i <Path to folder of atlas images> -o <Path to write unpacked image files> -c <Path to texture atlas file>

You may want to use --update or -u, which allows you to run a specific version. For example, adding -u 4.1.20 to the above example will run Spine 4.1.20 to unpack. Unpacking with the latest non-beta version of Spine is best and you can do that by using -u latest.


Importing skeleton data

To import your skeleton data, first make sure you are using the same version of Spine that was used to export the data. This is especially important for binary data, but also applies to JSON data.

Next, check to see if the atlas file has a line specifying the atlas' scale. This information will be needed when importing. If not found, it means that either the skeleton's atlas was packed at a scale of 1 (the original image sizes) or that the atlas was packed with an older version of Spine.

To import skeleton data:

  1. Open the main menu and choose Import Data.
  1. In the Import Data window:
    • For File, enter the path to the JSON or binary file to import.
    • If the texture atlas was scaled, set the Scale value so the size of the skeleton will match the unpacked atlas images.
    • Enter the name of the skeleton to be imported.

  1. Press Import and you will see your skeleton, but with MISSING images instead of the correct images. This happens because the image path has not been set, which we will fix in the next step. First, save the Spine project.
  1. Select the Images node in the Tree view, and enter the path to the images folder in Path.

Now the skeleton images are displayed correctly:


Troubleshooting

Why aren't my images shown even if I set the correct image path?

If the skeleton was created in Spine Professional but you imported the skeleton data using Spine Essential, mesh attachments and constraints will not be imported because they are only available in Spine Professional. Use Spine Professional to import skeletons that contain Spine Professional features.

Why do I have dark borders around transparent areas of my images?

Your atlas images had premultiplied alpha and you did not check Unpremultiply alpha when unpacking the atlas. Try unpacking again with Unpremultiply alpha checked.

Why do I get white borders around transparent areas of my attachment images?

Your atlas images did not have premultiplied alpha and you checked Unpremultiply alpha when unpacking the atlas. Try unpacking again with Unpremultiply alpha unchecked.

Why are some of the parts smaller or larger than the correct size?

Your atlas was packed with a scale greater or less than 1. Import the skeleton again and specify the same scale value that was used to pack the atlas. If you don't know the scale, you can try some common values like 0.5 or 0.25.

Why is the animation of the imported skeleton incorrect?

To import correctly, you must use the same version of Spine that was used to export the data. You can find the Spine version in the exported data by opening it with a text editor and looking near the start of the file:

If the file is exported in binary format, you may want to use a hex editor to view the version number.

If your data is from an older version of Spine, run that version so you can import the data, then save a Spine project file and open that with the newer version of Spine that you want to use.

Why are the bones' icons changed to the default icon?

The bone icon information is not contained in the exported skeleton data, as it is only needed in Spine, so an imported skeleton will use the default icon for all the bones.

Why are the bones' colors reset and the edges between mesh vertices gone?

When skeleton data is exported without Nonessential data checked, some information that is not normally needed at runtime is not exported. The imported skeleton will still work, but will be missing the nonessential information. If you plan to import data in the future, be sure to check Nonessential data when exporting.


If you are having trouble importing a skeleton from exported files, we are happy to help on the Spine Forum!

Native Apple Silicon Support

February 20th, 2023

In late 2020, Apple introduced their first machines sporting Apple Silicon, the brand name for their custom ARM CPUs. Spine has been running on Apple Silicon hardware through Rosetta 2, a pretty impressive piece of software that translates x86 instructions to ARM instructions. This allows Spine to run unmodified on Apple Silicon, despite being built for Intel-based Macs.

Today we're happy to announce native Apple Silicon support for Spine! The native Apple Silicon version starts up faster and provides improved performance compared to running Spine via Rosetta 2. You can download the Apple Silicon launcher from your Spine license page.

With the new launcher, Spine versions from 4.0 onward run natively on Apple Silicon. Older versions still have to go through Rosetta 2, as they do not share the revamped architecture of our 4.x line of Spine. Of course you can still run these old versions through the new launcher.

Share your experience with Spine running natively on Apple Silicon on the forum.

Anticipation - Animating with Spine #7

January 19th, 2023

Welcome to the seventh video of our Animating with Spine tutorial series! This time we cover anticipation – one of the most important animation principles, especially for games. Almost every animation needs some form of anticipation. It’s a fairly simple concept to grasp and it can be applied to both simple and complex animations. But what is it exactly?

In this video you will learn how and why to add anticipation to your animations, as well as how to compromise for game animation requirements.

Use the provided Spine project to do the exercise in the video and hone your animation skills. Share what you did with us on the Spine forum!

Happy animating!