Spine Spotlight: Juliano Castro

April 1st, 2021

We really enjoy working with all talented animators in the Spine community, each with their own workflows and tips. We recently had the chance to interview Juliano Castro, an amazing animator who is very active in the Spine community! You may have seen his gorgeous animated scenes on Twitter or his Twitch lessons and streams.

In the interview below we get a peek into how Juliano uses Spine in professional environments.

Background

Juliano graduated in Graphic Design but his passion for drawing and art started when he was a child. He began animating in 2000 after taking a traditional animation course to create a pencil test. Since then he's worked with both 2D and 3D techniques while running his own animation studio in Brazil for almost a decade, doing freelance gigs all around the world.

Interview

What is your experience with Spine?

I landed a freelance project from a company in Canada to animate some cycles for a Transformers game while I was still living in Brazil. It was a very small project but I got the opportunity to use my first Spine Essential License. It was an isolated experience and I didn't use Spine again until I had the opportunity to start shifting my career towards gamedev, years later. I started a deeper experience with Spine around 3 years ago when I left Brazil to join a gaming company based in Malta. Over there, Spine was the main tool to create animated assets for their games and I went full speed in that direction.

I use Spine for my daily production at the studio and I also do a lot of personal projects with it as well. At the studio, most of the work is for game assets (characters and props). For personal projects I like to take illustrations from artists I admire and bring them to life. I use this to expand my knowledge of Spine and combine it with other tools like After Effects and Adobe Animate.

Does your approach change depending on what you work on?

Yes, it changes a lot. For games, especially for mobile, optimization leads the way because of the limitations of each game engine. For video workflows I can work with cameras at post production and higher resolution source images, unlimited meshes and bones, and the advantages of direct vertex animation for polishing details.

Could you describe your process?

Usually I receive the asset to be animated with basic cutting, as a layered Photoshop file. Then I use a process of planning and refinement of the cutting and organize the layers, groups and naming to help my process after, when each part is exported and the Spine project is created.

Next is rigging. Depending on the complexity of what needs to be animated, the hierarchy can grow to become very confusing, so, again, naming and structure are very important factors to make the character or scene more intuitive and the workflow easier.

Animation comes after rigging and sometimes I like to start animating before all the meshes are done, because seeing the part in place can give you a better idea of what you will need for the mesh, or even if you need to turn an attachment into a mesh. I like to see the start of the animation as a back and forth process. After achieving the rigging refinement I need and I have the basic animation half done, then I change to a more polished animation flow. I like to use the concept of layered animation, even though it is not really layered in Spine, but I use the concept of building up passes on top of another. I start with basic poses, then I create the inbetweens and refine the timing, keeping an eye on the body mechanics. From there, with a solid base done, I will work on the fine details, polish the arcs, overlap and follow through, and I leave the final pass for facial animation and very specific stuff, when needed.

#artvsartist2020. I big shout out for all amazing artists I could collaborate with by animating their illustrations, they are @coryloftis @izzyabreu @MadBoogieArt @javier_charro Ronald Reyes @pointedfox you are all awesome!
🖤🙏https://t.co/zGwqXRwcEq pic.twitter.com/1c6X63e0Vs

— Juliano Castro (@julianocastro) May 1, 2020

What are your favorite tools, or runtimes, to use with Spine?

Definitely my favorite Spine sidekick is After Effects. It adds a lot with VFX, particles, and composition tools.

If you have tried different animation tools, would you say working in Spine differs? In what way?

Along my career I have tried a lot of tools. Spine made me transition for good from animating characters in After Effects because Spine is unbelievably fast to get results and high quality character animation out of it. Something I am always pointing out to people that approach me to know more about Spine is the bone/mesh/weight concepts that are very close to 3D tools. When I got started, I dove in with these concepts in mind and that made the transition from 3D to 2D very smooth.

What setup or animation was most challenging?

For games, I believe that dealing with multiple skins and having characters that dramatically change their accessories or clothing is always challenging. Outside of games, realism with human characters is very hard. Creating believable movement and expressions is very challenging because as humans we can detect very subtle variations.

How much time does it take you to work on a project in Spine, and how is this time divided?

It varies a lot depending on the project. For games it can be a long schedule due the long list of cycles needed and the reviews/feedback from the art director. If it is a personal project, done with illustrations from other artists, I like to keep it within a week. I like to divide the process by days: 1 day for cutting and preparing assets, 1 day for rigging, and 1 or 2 days for animation. Lastly, 1 extra day for render passes and composition in After Effects for final exports and posting on social media.

What's your favorite Spine feature?

I have a favorite combo. Definitely meshes combined with constraints is a big combo, you can do a lot with them, even with simple setups.

Any funny story to tell us while developing in Spine?

It is funny now, but quite a nightmare at the time. During my first experiences with Spine, I was new on the team and new with Spine and gamedev, so I asked one of the animators about scaling a character before animating it. The person just said “go with what they sent in the file”. The character came in a high resolution PSD, so I followed the advice and weeks later when the exports hit the dev team, I got a message to resize the assets to “the correct size”. I just replied with a fake “no problem, my friend!”. From there, I only remember the overtime and rebuilding meshes like there is no tomorrow. (Note from the Spine team: if you ever encounter this problem, you can easily resize your project!)

Do you have tips for new Spine users?

Always: study animation, guys. Mastering the tool doesn't mean mastering animation. Stick with the fundamentals, build on them constantly, and be persistent.

Any tips for seasoned Spine users?

Yes! Share your knowledge, help young animators reach their potential, keep doing great animation and inspiring them. We learn and we grow when we teach.

What or who inspires you to create?

I have a long list of 2D artists that inspire me and it grows daily. Most of my Spine work is devoted to them, by animating their illustrations, but artists who deeply inspire me are usually the ones that go out of their daily jobs to explore and stretch their creativity. I see that in animators who are also sculptors, or painters that are musicians, illustrators that could be chefs -- you get my point. Artists that don't limit their art to one circle but are committed to a search that fuels and grows their creative sparks. Also, I try to watch/read/listen to movies/books/audiobooks that can add to my work on a level beyond animation, to bring more substance to the mix. I like to research about movie directing, storytelling, the classic Disney/Miyazaki of course, but some live action as well.

Creativity comes from a fueled up brain, so I try to keep my “brain food” diverse and constant.

Do you have any favorite artist/game/game studio that uses Spine? What do you like about them?

I have some, more artists than studios. I like how creative they are with the tool. To name some of them: Jorge Bompart and Arman Harutyunyan.

Where can people find you or see your work?

My portfolio hub is Artstation, but you can also find my work on instagram and Vimeo.

Anything else you'd like to tell us about? We'd love to hear about it!

I am committed this year to starting projects for teaching and sharing animation, creating useful and more specific Spine content to help the community, and to present the tool for new people interested in gamedev and animation. One of coolest things that happened last year was an invitation to start teaching skeletal animation and motion comics in some online schools and platforms. One of them in Brazil, called Patio Digital, invited me as a mentor for their animation program.

Recently I started streaming daily on my Twitch channel, showing some processes with Spine, talking about animation fundamentals, design for animation and, soon, doing short reviews on animation that people send and want some feedback.

I have more ambitious plans like creating a short movie with Spine, as well and other projects that will demand more of my time and budget. If anyone is interested, they can follow me on my Instagram, Twitter, and Twitch where I do my announcements and post more recent work.

The year will be busy for sure and I hope we all can benefit from what is coming. Thanks to the Spine team for this opportunity to talk a bit more about me and my work. I wish you all the best and look forward to making this community stronger together.

Thank you for your time, Juliano!

The 12 Principles - Animating with Spine #2

March 18th, 2021

The second video of our Animating with Spine tutorial series is here! We'll teach you the 12 basic animation principles and how to apply those concepts in Spine. Follow along and use the provided Spine project to hone your skills by animating four different balls through an obstacle course.

As we dive deeper into animating in future videos, everything else will be built on top of these basic principles.

Visit us on the Spine forum to discuss this video and share the results of your exercise.

Happy animating!

Favor Tool - Spine workflow tutorial

January 4th, 2021

Choosing the right workflows allows you to create high quality animations in very little time. In our latest tutorial video Sinisa shows how to use Spine's Favor tool to work faster and smarter.

Join us on the Spine forum to discuss this video.

Rigging new poses - Spine workflow tutorial

December 24th, 2020

Creating poses with different art during your animations is a great way to expand the range of what your characters are able to do in Spine. We gave a glimpse of this in our mesh binding tutorial and have talked about it in several of our streams, the latest demonstrating a complete turnaround of Helmet the dog. In this blog post we'll summarize the steps to add and manage multiple poses in your Spine skeleton.

You can download the files to follow along here. We've included all required images, as well as a Spine project for each step.

Preparing the assets

Let's imagine that you have already rigged a character and you want to add a new pose in the middle of an animation. The first step is creating the additional assets required for the new pose. You can use Spine's PSD export to create a reference for your work for Photoshop or other image editing software. This is especially useful to create new assets for an animation, such as a torso with a different perspective. The PSD export gives you layers for all the attachments of an entire mid-animation pose, so you can more easily draw new attachments.

Once you are happy with your new assets, you can export them from your image editing software using these scripts. Below we assume you are using Photoshop and our corresponding PhotoshopToSpine script.

By using the [slot] tag and names in your Photoshop project that match the existing slots in your skeleton, Spine can automatically import your new assets in the correct place. For our festive Spineboy, we've created additional assets in the Photoshop project that you can find in the folder 2-spineboy-alt-images/ in the materials download accompanying this blog post.

Importing the assets

The PhotoshopToSpine script generates a JSON file along with images that you can import into your existing Spine project.

To import the new assets, open the Spine project you wish to import the new assets into (in our case that's 1-festive-spineboy.spine inside the folder 1-festive-spineboy-start/). Next, choose Import Data or drag and drop the JSON file on the Spine window to open the Import Data dialog (in our case that's the file festive-spineboy-alt-hands.json in the folder 2-spineboy-alt-images).

Uncheck New project to import the files into the current skeleton, then choose Import into an existing skeleton and Ignore the existing attachments to retain the meshes that already exist.

After clicking Import, Spine will place the imported attachments matching an existing slot under that slot. Attachments not matching any existing slot will be placed in new slots under the root bone.

Adding the new pose assets in Spine

We are now ready to integrate the new assets into the rig so that they can be used in animations.

The first problem is that the positions of the new attachments likely don't match the bones already present in the skeleton. You may be tempted to work around this problem by creating a new set of bones for the new poses. This can work fine, but has the drawback of crowding the skeleton with many bones, turning your character into an unmanageable octopus, and making it harder to navigate and use your rig in the long run.

How to rig the new pose images

There is a better approach to integrate new parts! We can store a pose inside an animation that will act as an alternative setup pose. This animation then also serves as a convenient source to quickly copy a pose and paste it into a new animation. Let's call an animation used for this purpose a "setup pose animation".

To get started, in setup mode, make the new attachments for the new pose visible, turn them all into meshes, and use Edit Mesh to create the mesh structures. Remember to follow the mesh creation tips and try to keep the vertex count low!

While still in setup mode, bind the new meshes to a bone that doesn't move in any animation, such as the root bone.

After you're done with the above steps, hide the meshes for the new pose, thereby restoring your original setup pose.

Now it's time to create the "setup pose animation" for our new pose. Switch to animate mode and create an animation that will be used to store the new pose.

Show all the meshes that are required by the new pose. Since all the meshes are bound to the root, the bones that are the real parents of these attachments can be moved freely, without affecting the attachments. Match the bones to the new positions of the meshes.

Once you are satisfied with the bone positions in this animation, bind each mesh to the respective bones that should influence it and unbind the root bone.

To test the weights, it's best to create a new animation for testing. You can test them using the setup pose animation and then undo, but it's easy to forget and accidentally ruin the pose. Duplicate the setup pose animation and adjust the weights. Once you're satisfied with the results, the pose is ready to use!

Using the new pose

After setting everything up, making use of the pose is very easy: just copy all the keys from the setup pose animation to the new animation.

Adding new bones to be used in the new pose

As you add new parts to a pose, you may realize that you actually do need a new bone or two for better control. How can this be done when the pose is very different from the setup pose?

First, follow the procedure described in the last section to match the existing bones to the new meshes in the setup pose animation. Next, bind the meshes in the setup pose animation to the bone that will be the parent of the new bones, setting the weight to 100%.

Now switch to setup mode and make the new meshes visible. They may appear positioned strangely, but they are properly aligned with the bone that will be the parent of our new bones. Use the meshes as a reference to create the new bones. Once this is done you can hide the meshes again in the setup mode.

Switch to animate mode and in the setup pose animation bind the meshes to the newly created bones. Proceed by setting their weights in a test animation as described above.

Modifying a mesh in an alternative pose

What if the mesh structure can be improved and needs to be changed? This is easy in Spine version 4.0 and higher: you can simply use the Edit Mesh button in animate mode.

In earlier versions of Spine it's possible but a bit more difficult because Edit Mesh can only be used in setup mode. The mesh was bound for a pose in an animation and in setup mode it is likely distorted, making editing the mesh there difficult or impossible. It can be done, but it requires losing the mesh's weights. You can take note of the most important weight percentages or keep the vertices count low so that the weights are easier to recreate.

First weight all of the mesh vertices 100% to the root bone (or another bone that doesn't move). If you didn't unbind the root from the mesh, you can just set the weight to 100%, otherwise make sure to bind the root while in the setup pose animation so that the correct state of the mesh is stored when it is bound.

Go back to setup mode and activate the mesh, which now shows in its undistorted state in setup mode, then click Edit Mesh. Once your mesh modifications are complete, switch to animate mode, activate the setup pose animation and press update bindings to store the correct bone positions.

You can now edit the weights so that the mesh is influenced by the correct bones once again.

Video

If you're more of a visual learner, we've got you covered! Erika has streamed these techniques on Twitch. Check out the complete stream or the digest version here:

Conclusion

This is a powerful technique to master as it unlocks a huge variety of expressiveness for your characters. For it to work it's important to be careful and pay attention to where you are binding the bones and that the setup pose animation is treated as carefully as in setup mode. Since this is an advanced technique, it is easy to get lost trying to remember all the steps, so we hope this blog post comes in handy for you.

Have you tried out this workflow? Let us know what you've created! We love to see your creations, so remember to tag them using #madewithspine on social media!

Stop by the Spine forum and let us know your thoughts about these techniques or ask questions if you get stuck.