Skip to main content

Creating a 360 Head, Adding Spring Bones and Color Management - My Character Design Process for Puppet, Bone Rig 2D Animation in Reallusion's Cartoon Animator (Part 5 - Final)

Variations of Business-Bikini Rachael.

I realize writing a five part series over almost three months makes creating a G3-360 SVG vector character in Cartoon Animator 5 look like a long and drawn out process. However, I want to assure you that, once you've designed your character and divided up, or created the bare minimum of required sprites, the actual rigging process should maybe take an afternoon to a day at most - excluding testing and refining the rig.

Despite spending a lot of time debugging the Inkscape rigging template provided by Reallusion, I've also only been working on my character when I've sat down to write these articles every second week. (BTW, if you haven't read Part 1, Part 2, Part 3, or Part 4, just follow those links... it's been quite a process). I expect my next character will take no more than a couple of days to rig.

To continue on, this week I fix the final few character design issues, then I rig my character's G3-360 head, add spring bones, and set up the color management system.

Final Character Design Tweaks

Since bringing my Inkscape template into Photopea fixed everything I decided to continue using this free online graphics editor to finish off my character.

As it turns out Inkscape wasn't actually deleting folders and layers properly because all kinds of folders, both new and deleted, appeared in my template when I opened it in Photopea. Once I cleaned all these out, including my rogue earing bones, my template imported into Cartoon Animator with no issues.

Skirt shape element added to each of the character's thighs.
The selected light green shape
I added to both the character's
thighs so that her skirt would
'stretch' when she moved her
legs out to the sides. Obviously
I changed the green to match the
rest of her skirt.
I could also fix the Iris and Mask error, where eye sprites that didn't need either of these but CA5 gave me an error saying they were missing, simply by hiding the actual images (not the folders) in the template so they wouldn't show up in the final, imported character.

That just left my risque skirt design flaw which I fixed by adding some skirt elements to her thigh sprites. So long as the character doesn't lift either leg too high it fixes the problem.

Rigging the G3-360 Head

When rigging a G3-360 head I have a standard process I follow that utilizes only the existing sprites needed for a front facing, human head. 

I don't usually add extra sprites for side facing noses or mouths. You really only need those extra sprites on a human character if you have a fairly cartoonish design or you're turning the character's head to a full 90 degree side view.

Steps for setting up the character's G3-360 Head in Cartoon Animator.
Setting up the Character's G3-360 head.
The step numbers approximately match
the steps outlined in the article.
My steps are as follows:
  1. Once inside the G3-360 head set up tool, click the Quick Setup button and apply the default settings.
  2. Choose the middle left angle position and, using transforms, deforms, etc. make the head look correct for a 315 degree, side facing head. It's a good idea to start with the face shape sprite. Get that correct and then position everything else in relation to it. Don't be afraid to really deform sprites and make those that move further away slightly smaller etc.
  3. When you're happy with this view, mirror copy it to the right facing angle. Note - Make sure the sprite box is deselected or all your sprites will be mirrored and you'll have to flip them back.
  4. Switch back to the left middle angle and use the copy/paste button to copy the middle angle to the left top angle and the left bottom angle.
  5. Switch to the left top angle. Rotate the entire head about 40 degrees so the character is looking up. Make sure you move the head back on the neck a little so it doesn't look like the head detaches from the neck.
  6. Switch to the left down angle and rotate the head down about 15 degrees so it looks like the character is looking down.
  7. Repeat these steps on the right facing side (i.e. copy/paste the right facing head etc.).
  8. Switch to the middle top angle and work on this until it looks correct for the character looking up. Make sure you preview a lot with the left and right looking up angles to make sure everything moves in line as the head angle changes.
  9. Repeat for the middle bottom angle.
  10. Make any final tweaks to each angle and you're done.
Following these steps on a standard human shaped head means you really only have to set up three angles in any great detail. All the remaining angles can be copied, mirrored, and rotated.

Once you've finished setting up the head exit out of the head set up tool (you may want to save your head profile first just in case you need to update the character again and don't want to set up the head from scratch). You may want to check the character's layers to make sure the back hair sprite is sitting behind all other sprites. Check to make sure everything else is in the correct layer order too.

Spring Bones for the Hair

If your character has long hair then adding some spring bones to it is a no brainer. It may also be worthwhile experimenting with adding spring bones to any lose fitting clothing such as skirts (or body parts like a large belly etc.).

For mine I simply added some additional bones to the front and back hair sprites, grouped the bones into left and right sides in the Spring Bone editor while leaving the bones themselves on the default settings.

Remember, when you're grouping your spring bones leave the root (or base bone) out of the group. This bone serves as an anchor point for the physics of spring bones to react against. If you include it you may get an error or your spring bones just won't work.

Grouping the additional hair spring bones added to the character.
I divided my hair spring bones up into left and right sides, plus one center group on the fringe.
I left the actual spring bone settings on their default because I imagine my character
probably uses a lot of hairspray to keep that nice curl at the back!

Color Management

I'd always envisioned my character being capable of having her outfit modified through color management. Specifically being able to remove her business outfit so she could also show off her beach body in her swimsuit. Setting this up should be the last stage in rigging your character.

Color Management can be initially confusing, particularly if you've got a very detailed character with hundreds of vector shapes. I tried to keep mine simple which is why I used very minimal highlighting and shadow. Even so, I still had a lot of shapes to sort through.

When you first fire up the SVG Group Editor (which is how you group everything for Color Management through the SVG Color Adjustment tool) you have two sort options, by color or by Sprite Name.

I chose by Sprite Name as this at least gave me extra clues for where to look when trying to see each color because, even though selecting a color would cause that selection to flash on the character, you won't see the flashing color if it's hidden behind another layer. Note: There is a transparency button at the bottom of the group editor that makes everything temporarily transparent so you can see which area is flashing as 'selected'.

Setting up the color management system.
Although you can use one of the two default color management options and be done in a
single click, it's better to go through and sort everything into groups that you can easily
understand like 'Jacket', 'Skin', 'Skirt' etc. You'll thank yourself for it later.

It took me maybe a couple of hours to sort all my colors into groups I could easily understand, specifically making sure each item of clothing was in its own group so it can easily be switched on or off using the transparency setting.

This whole process of color management isn't hard but it is definitely made easier if you keep it front of mind when you're designing your characters. You'll definitely want to limit your color palette using only what is necessary for your character's design.

The finished G3-SVG, Character

I must admit this whole process took me far longer than expected, even for a first time vector character rigging experience.

This character is the first one in years that I've had to create all the face sprites for from scratch. When I create G3-PSD characters I have a project file that auto generates these from a morph based head.

I really did not expect to come up against so many issues with the Inkscape template. I'm hoping when Inkscape 1.3 is released some of the issues I experienced will be fixed (deleted folders not actually being deleted for one).

I'm almost tempted to change my vector editor to Photopea which gives me the best of raster and vector based graphics editing... except I just don't like editing graphics in a browser. Particularly when it rasterizers vectors on screen so they no longer look like vectors.

Despite that I will still be using Photopea to do a final pass on my templates if I keep having the same issues experienced making this character.

With all that now behind me I'm very happy with how the final character, who I'm calling Business-Bikini Rachael turned out. It's quite fun creating variations of her using the color management system. Check some of them out in the image below.

The character is available to buy from my Reallusion Store where you can see a short video of her in action.

Five variations of the same Business-Bikini Rachael character created using color adjustment settings.
Variations of Business-Bikini Rachael create just by adjusting
settings in the SVG Color Adjustment Tool.


Comments

Popular posts from this blog

Inochi2D - Free Open Source 2D VTuber Avatar Rigging and Puppeteering Software (Part 1)

Inochi2D Creator - Free Open Source VTuber Software. If you've been looking for a way to live perform as a 2D cartoon avatar on camera, whether it be for a live stream or for pre-recorded content like educational videos, then VTuber software is a low cost (or even no cost) option worth looking into. In my previous post, How to Become a VTuber - 2D and 3D Software for Creating and Controlling Your Avatar , I took a brief look at the relatively new but completely free and open source Inochi2D  which I thought showed great potential for my own needs of creating a live performance character rig for my own TET Avatar that I use for all my promotional materials. While it is possible to live perform my character using Cartoon Animator itself, Reallusion's MotionLive2D capture system isn't great - with lip sync in particular. More importantly though, I can't exactly teach people how to use Cartoon Animator if I'm using Cartoon Animator to control my Avatar. What is Inochi2D

Moho 14 Released - Still the Best 2D Animation Software for Indy Animators on a Budget

Moho 14 Released. Regular readers know I am a Reallusion, Cartoon Animator advocate through and through. Hands down I would recommend Cartoon Animator 5 first over Lost Marble's Moho 14 to anyone who is just starting in 2D animation, is a team of one, or just needs to animate as quickly as possible. However, feature for feature, Moho is, arguably, the best 2D animation software for the rest of us who can't justify a Toon Boom Harmony , or Adobe Creative Cloud subscription (and even with their applications Moho is very competitive on features). You can get started with Moho Debut for just USD$59.99 which is a cut down version of Moho Pro but it still has the most essential features needed for 2D animation. While Moho Pro is a whopping USD$399.99 (Cartoon Animator, which only has one version, is just USD$149.00) upgrades to new version numbers come down to a quarter of the price at USD$99.00. Even though Reallusion just released features like Motion Pilot Puppet Animation and

2D Animation Side Hustle - How to Package, Upload, Optimize, Price, and Promote Your Content in the Reallusion 2D Marketplace

T his is the final post in my four part, 2D Animation Side Hustle series on Selling in the Reallusion 2D Marketplace. I'll look at how to package up your content and upload it to the Marketplace, how to optimize your listings, price, and how to sell through your store backend as well as off site through social media and other channels. If you haven't read previous articles in the series click these links for Part 1 - Can You Make Real Money , Part 2 - Finding Niches , and Part 3 - What to Sell . Before getting started you'll need to register as a Content Developer in order to see the backend of your store on the Reallusion Marketplace . Packaging Content and Uploading to the Marketplace Since the release of Cartoon Animator 5 the software has a built in Package Manager that makes it easy to assemble and upload your Content to the Marketplace. Reallusion has a comprehensive, official video (embeded below) that quickly explains the entire process in less than seven minutes. 

Wonder Unit Storyboarder - Free Storyboarding Software for People Who Can (or Can't) Draw

Wonder Unit Storyboarder.  As an independent and solo animator I'm always tempted to try and skip storyboarding my animated shorts because they're usually only single scene sketch comedy type jokes. As a result I have many unfinished projects that kind of petered out due to having no clear finishing line. Storyboarding your productions, no matter how small, gives you a step by step guide of every shot that needs to be completed (no planning shots as you animate). It also allows you to create an animatic that gives you a rough preview of the finished production. In short, you shouldn't skip storyboards as they, generally, increase the chance of the project being completed. Disclaimer - I'm Not a Fan of Storyboarder Upfront, Wonder Unit's Storyboarder  is not my preferred storyboarding software. However it's completely free, has a number of very compelling featu

The Ultimate Independent Animator's App and Resource List 2019-2023 - Animation and Video Life

Image created with Cartoon Animator 4. Being an independent animator is not like a studio animation job. There's so much more to do that is indirectly related to the actual task of animating. Over the years I've sought out many apps, tools, and services that can help me achieve that one single task, expressing myself through animation. Below is my Ultimate Independent Animator's Resource List for 2019-2022. It started out as a list of free or low cost apps that could help you in every stage of producing either 2D or 3D animation, and then just kind of grew from there. You may not have been looking for a Time Management App as much as you needed something to get you started in 3D animation but when those commissioned projects start coming in you'll have a head start on maximizing your time. All the apps and services on this list had to meet two main criteria: They had to be useful and relevant to an Indy Animator/artist. The base app/service had to be US$

Start Your 2D Animation Side Hustle - Sell Your Cartoon Animator Characters, Props, Scenes, and Motion Files in the Reallusion 2D/3D Marketplace

Have you thought about starting a side hustle selling your original Cartoon Animator assets in the Reallusion 2D/3D Marketplace ? In this article, the first in a series on selling in the marketplace, I'll give you an overview of what's involved, why you should give it some thought, and whether you can earn enough to quit your day job (or at least have a worthwhile side hustle). If you're an artist with any kind of drawing skills, and you're creating your own original characters, props, scenes, and even motion files for your Cartoon Animator projects, then setting up your own store in the Reallusion Marketplace should be a no brainer. You're making content already, it doesn't cost you anything to set up, and Reallusion only takes a 30% commission from each item sold. (If you think that's a lot, I'll address that further down). Don't be put off if you think your art skills aren't up to professional standards. There are plenty of artists with naïve

Prome AI Sketch Render Tool - Your Tradigital Clean Up and Colorist Artist for Character and Background Design

Random character head, Biro sketches drawn by TET (left). Render by PromeAI (right) using Prome's Sketch Render tool set to 'Comon:Cartoon, Render Mode: Outline'. W hile I don't do New Year Resolutions, one of my plans for the year ahead is to do more of my own art. Specifically character design drawn in an actual, physical sketchbook.  To that end, I have been spending the last half hour of most days drawing a page or two of random biro sketches in my sketchbook and posting the pages to my Instagram account  (this link will take you to one of my posts). These sketches are mostly practicing my skills because I don't really draw regularly anymore. Here is a tip, if you do this kind of sketching, and push yourself to keep doing it, you will see many drawings that could be taken further, even if you don't have anything they're suited for just at the moment. Which is where my second favorite AI Image Tool (after Leonardo.ai )  PromeAI comes into play. PromeAI