Hello everyone,

I asked the Affinity Designer Forum how to improve the workflow to optimize my export due to my problem with the export. Well, it turns out that the origin point in a document is always at the bottom left edge. This cannot be changed manually. It's important to note that if you have a file with multiple artboards like I do, the origin point of the first artboard created is in the bottom left corner, and this applies to all graphics throughout the document.

My workflow now looks like this: I design all the graphics in my master document. If I want to animate a graphic in Spine, I select it, copy it, create a new document with "Ctrl+N" and paste the graphic. I then select the artboard tool and create an artboard by selecting it in the bar at the top. This will give you exactly the size of the selected graphic. In Spine you then have to place the graphic in the middle, as already shown in this discussion.

Unfortunately, as far as I know, this is the best workflow. However, if I find out anything new, I will let you know.

Link to Affinity Designer Forum

Nate I did it, thank you for your support!

Thanks a lot! I think the problem is that I only set the transform constraint to 0 in the 15th frame. I also need to set the Transform Constraint back to 100 at the beginning and end of the animation so that the animation has a reference point to create a smooth transition. However, after I implemented this, only the legs move up and down and not the torso.

Here's why it probably doesn't have a smooth transition:

Here you can see that the legs move up and down, instead of the torso

Hello Nate,

First of all, thank you very much! Following your instructions was really easy and I have now achieved the desired effect. However, there is now a hard keyframe, which means that there is no smooth transition to the next keyframe. Do you have any ideas how I can fix this problem?

Thanks a lot in advance!

First of all, thank you for the excellent tutorial and the additional project you created. I successfully added a new bone called "hip" to my character and was able to successfully apply the transformation constraint. Also, I have now separated the legs from the torso so they are no longer a child of the torso, but now a child of the hip. However, when I pull the hip bone or the torso down, the entire body continues to sink. What adjustments do I need to make to control this effect?

new transformation constraint

the problem

I saw the tip and am trying to understand it. Regarding my character, I have the bones Leg_r, Leg_l and Torso. Now I'm unsure which bones should be given transform constraints and where the target should be. The entire workflow is not clear to me. I'm really sorry that you have to keep dealing with seemingly simple things. I've spent hours looking for a solution, watching videos and reading the Transform Constraints User Guide, but I still can't figure it out. Could you please also explain to me how I actually activate and deactivate a transform constraint? Thanks for the support!

Hello everyone,

I'm currently working on the animation of my character and I'm facing a problem. In my idle animation I want to move the torso, entire head and both arms down, but I want the legs to stay exactly as they are. When I drag the torso bone down with the move tool, the entire character moves, which is logical since the legs are defined as children of the torso. Info: I have attached IK constraints to both arms and legs.

In the picture the character is in the starting position

If I now push the torso down, the entire character shifts

If you have any ideas on how I can solve this problem, I would really appreciate your help. Thanks in advance!

Thank you very much Misaki, with your help I was able to solve the problem!

Misaki Hello Misaki,

It's about Step 2: Importing into Spine. I imported the JSON file into Spine. Normally the character should then automatically be displayed as it was created in Affinity Designer. However, it doesn't show anything at all for me and I'm left with a puzzle.

I emailed the zip file. This zip file contains not only the JSON file but also all associated images. I hope this will help you identify the problem and help me solve it.

Thank you in advance for your support! I really appreciate your help.

Best regards,
Trilex

Hello Nate,

I'll now show you my workflow

Step 1: Export from Affinity Designer
First I create my design or character in Affinity Designer. When exporting persona, I select the JSON format and save the file to a location of my choice.

Step 2: Import into Spine
Next I switch to Spine and open my project. I select the logo and click "Import Data". I locate the previously exported JSON file and select it.

Step 3: My problem
Normally I should be able to see my character in the scene by now, but here lies my problem. For me the character is not portrayed correctly. If I go to Images and drag all the images it contains into the scene, I have to manually compose the character.

I hope you can help me solve this problem. It's frustrating because I've noticed that when I create a blank project in Affinity Designer and only export simple shapes, it works. It seems like it might be because of the complexity of my character.

Finally, I would like to mention that I find the PSD import feature in Spine very exciting. This might be of interest to many image editing software users, as few programs offer a direct Spine JSON export function. Please keep me updated if this feature becomes available in the future. Thank you!

Hi all,

I am trying to import a character that consists of multiple parts created in Affinity Designer into Spine using the Spine Jason Batch Builder. So far I have successfully exported simple shapes from a blank Affinity Designer project, but I am having trouble importing the figure.

Spine recognizes both the PNG files and the JSON file, but the figure does not render correctly. I have to manually drag the images into the scene and position them myself to arrange them correctly. Despite my numerous attempts, I have yet to find a solution to this problem.

I'm sure some of you already have experience with this kind of workflow, and I would be very grateful if you could share your knowledge and tips with me. Are there certain settings in Affinity Designer or Spine that I am overlooking? Or maybe there are certain steps I should follow to successfully import the figure?

Any tips or advice would be greatly appreciated, as I want to make sure my figure imports smoothly into Spine. Thank you in advance for your help!

With kind regards,
Trilex

Groups in Affinity Designer:

These are the slices that i would export:

Hello Nate

In the Unity engine, I was able to use SVG files using a plugin. However, the engine automatically converted them to raster images. I now plan to re-export all sprites as PNG files. The screen resolution is 3840 x 2160 pixels, which should cover most screen resolutions. Shrinking raster graphics is not a problem, but enlarging them results in a blurry appearance.

With kind regards
Trilex

Hello Misaki,

thank you very much for your information. I read the blog and followed the steps described in it. It helped me a lot to understand the principle better!

In summary, I use the "skin constraints" to make the skeleton bigger, thinner, thicker or smaller depending on the character. This way I don't have to create a separate skeleton for each character, but can scale the skeleton.

With the "BoneFollower" component, I make sure that the sprite follows the bone and always stays on that bone.

For example, if I wanted to create a skin for a character, I would use the "Spine Examples/Other Examples/Mix and Match Equip" feature to do a sprite swap.

As you can tell, this is my first time working with Spine today and I'm trying to understand the logic behind it. Please correct me if I misunderstood something.

Thank you very much for your help!

With kind regards,
Trilex

Dear Community Members,

I hope you can help me with a little challenge. I am currently working on a project where I want to animate four different characters with slightly different proportions, using a single skeleton. My goal is to be able to differentiate these animations from each other in Unity so that I can play them as needed.

Specifically, how do you go about animating one skeleton for multiple characters and then differentiating the animations in Unity. Here are the steps I would like to understand:

Create a skeleton How do you build a skeleton that works for all four characters? Are there any special considerations or techniques you guys take into account when doing this?

Attaching Sprites to Bones: How do you attach the sprites to the bones of the skeleton? Are there any best practices to make sure the animations go smoothly?

Differentiating animations in Unity: How do you go about making sure you can control the animations for each character separately in Unity? What Unity features or techniques do you use to do this?

Thanks in advance for your dedication and valuable time!

With kind regards,
Trilex

Misaki Hello Misaki,

Thanks for your quick reply. It's a pity that Spine doesn't support SVG files.

With kind regards,
Trilex

Hello,

I have a question about importing. Since I work with vector files in both Affinity Designer and Unity, I would like to work with vector files (SVG) in Spine as well. However, I have the problem that Spine does not seem to recognize the SVG files. I would like to know if Spine recognizes vector files at all or if you have to work with raster files like PNG/JPEG. I am looking forward to your answers.

Many thanks in advance!

With kind regards,
Trilex