Working on Dynamically Creating Character Animations

just use spine make animation ,it,s easy

I don't understand how Spine would help me here as the issue is not creating the initial animation

Great blog, thanks for sharing all the details, nice concept and it looks great in action.

One suggestion when it comes to color tint, use a two color tint. One color that effects the lighter colors and one that effects the darker colors. It offers a lot of versatility. (If this effect does not already exist, I am going to look into creating one). Then, you can use a base grayscale image that will be tinted.

Example of the concept (from Spine.)

Thanks for the comment and tip!

Great pro tip there. Do you want to explain it a bit more, just so I am clear on the benefit?

I was planning on doing a replaceColor, but was indeed going to have to replace two colors for the shading. But the way you propose you basically are removing the color (saturation) so is grayscale and can use one tint on the whole sprite? Therefore the tint adds the color and the shading is already in place?

I will keep an eye out for that when looking through the effects. Though I might not be able to do that as I have outlines on certain things that I don't want to tint the outline color (it is not a true black). But might experiment with that, tinted outlines could look better!

Here's the basic formula for two color tint (you can also do it with non gray scale source image also, you can experiment with it.)

Darker colors are more tinted by dark tint color, lighter colors are more tinted by light tint color. It does take some playing with to find good combinations though.

texColor is the rgb color of the original texture. texColor.a is the alpha of the texture (used so we don't colorize transparent pixels.)

finalColor = (1.0 - texColor.rgb) * darkTint * texColor.a + texColor.rgb * lightTint;

The benefit is you can tint darker colors with one color and lighter ones with another color for more variety. It depends on your images though, if they are all one or two solid colors, then replace color might be the better way to go.

I added an example Two Tint effect to my C3 effects pack, so you can play with it, if you want. If you don't have a key of my pack DM me on Twitter and I'll send you one (kindeyegames on twitter.)

kindeyegames.itch.io/effects-for-construct

In this session I worked I used the effect Replace Solid Color to setup customizable hair color, skin color, tie color and pants color. This means I did have to add the effect multiple times to both sprites. Next I plan on doing a stress test to see how intensive this will be with numerous characters and if this will work and a ballpark on how many characters can be on the screen at once with this effect.

I also setup six different heads for this, just for a bit of variety.

In the project you can toggle from the character creator screen and a layout where you can walk around. This is simply to give it that game-like feel of doing something with your character after creating him and test out the different animations, which are just walking cycles for this one.

Read more about this on my blog post: Custom Character Creator Dev Blog

Also, I have this project to the Construct Arcade, for anyone not trusting links to my website :)

This is what the screen looks like: