AuthorTopic: GR#199 - Character - Animation (Read 11442 times)

Added the link because imgur is blowing it up for some reason, making it look all blurry.

Inspiration is from Paul Robertsons work, nothing was ripped, but his art-style is along the lines I was shooting for.

I'm BRAND NEW to pixel art, this is my first work. Please let me know what you guys think. I believe that it is good, but I watch it and can't help but feel like SOMETHING is missing.Thanks in advance for any advice, tips, or other forms of help!

I think the sprite base looks pretty good, but the animation seems a bit rushed and jerky for just a shanding pose, unless he's about to throw a punch at someone. The main thing I would change is the way the shirt "pops" a bit at the bottom. I'd make that less dramatic; my eyes go to it first rather than the face of the sprite.

It is fast and bouncy, but the framerate on the GIF is little faster than the actual animation in-game, but just by a bit. I actually want it that way. I want it to look bouncy and alive. I'll look into the shirt, see what it looks like toned down a bit.

I'm actually pretty new to pixel art, too, but I had some experiences and... here is my attempt to help you.

If I say anything wrong, please correct me someone. It's my first attempt on helping someone on this forum.

The Face is a little strange. He doesn't have a pupil on the eye for a three-pixel eye (it's a rule I've made: if he has a three-pixel eye, use a pupil, but I think that's just me being weird), and it doesn't seem to match his body at all (through I think this is just my opinion).

His arms are too big, I think. If you 'open' them straight, they would get near his feet, and that shouldn't happen. Maybe making the arm a little shorter would fix that?

And I think the pose is a little strange. It looks like he is just putting his hands on his waist, but then you realise that you can see his hand, and it is closed. If it's supposed to be a fighting stance, I think putting his hand more near his face and showing his arm a little would make the animation better.

But... it's actually a good animation for first time :p. I didn't know how to shade very well, so I never shaded at all in the beggining, but I see you are practicing it!

Logged

I'm actually a little scared of forums... but I always liked them, so I'm joining this one now! I hope we can all get along.

Slowed the animation down, tried to downplay the shirtflapping, decreased the width of the torso, changed the eyes to look more like pupils, and changed the hands a bit. I think it looks much better now, thank you for the thoughts!

All I can think of now is that the eye pupils looks a little strange. Like if he was looking up. Try changing their position.

And the hair bouncing seems a little strange, maybe making it less frames where the hair bounces? Like, if it uses 4 frames for the hair bounce, try making it bounce on 3 or 2, and making it less aparental. I think it's taking too much atention.

Good work so far! Keep up at it!

« Last Edit: July 13, 2014, 05:06:33 am by Yukie Anima »

Logged

I'm actually a little scared of forums... but I always liked them, so I'm joining this one now! I hope we can all get along.

Yeah, you're right about the hair. I think I might try sunglasses on him, aviators maybe, and see what that would look like if I can do it right. He seems kind of plain, I wanna give him a bit more flair.

I think it looks much better, and still has that lively flare it did at the beginning. I'm good with human anatomy, so I can't help anymore really, but I look forward to checking in on the final piece!

Reworked the stomach area, brought the edge of the shirt in my one pixel, then let it expand to add to the popping effect by making the shirt look like it is filling with air. Added sunglasses and lightened the highlight color on the legs. Also improved arm pixels to try and reduce the banding.

Thanks everyone for your thoughts! I can't decide if I like the glasses though.

I still don't feel like I have enough though, the character seems SO PLAIN. I think I may try to add a jacket or something like that.

I did an edit to the arms of your animation. I tried to get the shading slightly changed, so you didn't get the banding effect. Edit: My program made it slightly faster than what it was before for some reason, and I don't know how to fix it :/

I did an edit to the arms of your animation. I tried to get the shading slightly changed, so you didn't get the banding effect. Edit: My program made it slightly faster than what it was before for some reason, and I don't know how to fix it :/

I like the shading for the wrist! Thank you for the edit!

I think I am just going to leave him fingerless though.

My latest edit. I reduced the saturation in the shirt to get a more realistic look, reworked the back of the arms to get rid of the banding there as well, shortened the arms, added a little bit of pop to the pant legs, and added 1 pixel to the feet with some re-shading.

Thoughts?? I feel like he is getting so close! What accessory can I add to get that little touch of flair, but won't be over the top.

I was just about to tell you about the contrast of the shirt. Darker contrasts makes it more realistic.

You could try adding some emotion to him now. Something like, a angry look in his face with only 4 pixels above his sunglasses, and that would be the eyebrows. Or, maybe a sarcastic smile. Maybe a jacket, a cap, things that would add emotion to the character. What I told you were only examples, but if you like one of them, you can use it!

That way the shirt goes up, too, I think it shouldn't happen. It's a little unnecessary and it takes some attention. I think you should either remove it, or make that part of the animation less... 'strong'.

And I think you could rework the pallete of the hair. Maybe making it a little darker. I think he shading makes it look like it is glowing.

And there's one little pixel on the arm that is really unconfortable at least for me. The shirt isn't moving, but the shading is. That shouldn't happen. Try removing it.

Good job so far!

Logged

I'm actually a little scared of forums... but I always liked them, so I'm joining this one now! I hope we can all get along.

As Yukie mentioned earlier your dude has gorilla-arms-disease (which seems to be a common problem). I've drastically raised his elbows. Anatomically, they usually fall right above the love handles or higher. I also gave him longer shins, because they were so incredibly short.

As far as posing, I raised his left arm, because with both hands down by his waist it seems more like he's doing a naughty dance, or getting read to roll some dice, neither of which makes me think he's ready for a fight.

As far as blandness, I gave him to stripes on his shoulder just to add something, a belt and buckle, because bad dudes wear belts and it helps break up the torso from the pelvis. As well I slightly hinted at pockets on the jeans. You'll notice also that I gave a ring for his neck. Before it seemed king of like he wore his shirt on backward so it was riding up his neck. I also varied his jaw a bit so it's more manly and tough guy like. Before it was too soft and pudgy.

Last piece of advice, especially since you're new to pixel art (not sure if you're new to art in general): on complicated pieces like this, you should really fine tune the anatomy of your character, style and costume, and especially the pose, before starting to animate. It will cut down on development time when you have to make a correction and then go through every frame and correct it (this is only 5 frames so it's not as big a deal as it could be). So in short, put up a still picture of your character, get critiqued on that, then once you're satisfied, move on to animating.

Okay, one last piece of advice: if you think something looks wrong with your picture, flip it horizontally (meaning if he's looking to his left, flip it so he's look to his right). Almost immediately, you'll notice what's wrong. If you don't, then flip it vertically so he's standing on his head. If you still don't notice what's wrong then post so you can get some C + C.

This time I mean it, last thing: honestly, my edit can be pushed much, much further. He still kind of looks like he's just standing there, maybe looking at his invisible phone. Bring up both of the arms even further, so they're actually almost chin height and he'll look ready to punch someone's face off.

Thanks! There's a lot of good stuff there. I actually did another edit last night where I cut 2 pixel layers out of the arms above the elbows. The legs are exactly how I want them and give the feeling I want, but I definitely understand your point, thank you! Also, he IS supposed to just be standing there, looking tough, but not like he is about to punch someone's face off! XD

Thank you everyone for your advice! At work right now, but will probably post another edit tonight.

I think that you need to better define your forms. Boxcar was going in the right direction. Also you should avoid banding and using similar tones of same color for shading cause low contrast between them cause blur effect.

Here is quick edit, also I didn't have the time to create animation, but you can easily find some reference animation and learn form them. You can open gif files in PS, Gimp, Graphicgale, (even some websites) etc. and study every frame.

I think that you need to better define your forms. Boxcar was going in the right direction. Also you should avoid banding and using similar tones of same color for shading cause low contrast between them cause blur effect.

Here is quick edit, also I didn't have the time to create animation, but you can easily find some reference animation and learn form them. You can open gif files in PS, Gimp, Graphicgale, (even some websites) etc. and study every frame.

Thanks!

That's a great edit, but the art style of the game matches the way I had the character drawn. The proportions and body style are what I want him to look like. It's a creativity choice more than anything.

Your link definitely educated me on banding and color, but is there pillow shading on my character anywhere? I though I had do e a good job avoiding pillow shading.

Shading against the lines anywhere generally creates banding and pillow-shading -- your biggest offenders are the bicept/tricept areas and under the bottom of the arm all the way to the tip of the visible arm's hand and also the crease in the bend of that arm. You could use a single dark color in those areas and avoid the feel of pillow-shading/banding altogether. If you seriously need that extra color, turn it into some slight AA, closer to the highlight color instead of the shadow color. Shadows should be done more like you did the front-most knee/leg area. Notice how HarveyDentMustDie did his shadows in single-blocks of shades. Lack of outlines aside, this is how sprite shading should be done -- that is, in clusters of a single color over a large enough area to represent the 3d planes/forms as best as possible.

Hopefully you can eliminate this look of pillow-shading by using HDMD's shading as an example of what I mean by 3d planes. You can easily add outlines to this when you're done defining the 3d forms.

Also, just a side note -- even though it's "just cartoony" in terms of style -- that doesn't let you get away without having to treat the cartoon as a 3d form, even if you're going for barely a hint of a lighted form -- so keep that in mind because you'll have to deal with this fact no matter what style of art you do.

I agree with everything astraldata said. If you want to shade this you have to do it properly to make it look properly. If you want full cartoon feel, you can just use two color tones (main and shadow, or main and highlight). A lot of cartoons use this style:

Much improved pillow-shading elimination. Nice touch with the shine there too.

The crease in the forearm/bicep area seems to not know where it's going anatomy-wise. Are you emphasizing the roundness of the bicep or the upward curve of the forearm muscle down toward the elbow with that extra pixel?

I mention that because single isolated pixels like that are not good to have unless they clearly express some important feature. You have another on the wrist and you should either get rid of both or double them up into a 2px wide cluster. Either would be workable, but neither place on the nearest visible arm is clear enough as-is with that single-pixel floating without a clear purpose.

The one other thing that bothers me is the lack of a clearly discernible ear (could be, in part, due to the distance the chin line goes back past where the ear should be and outlines the head like it's a separate piece barely attached to the body. ;P)

And while we're talking about the head -- the hair swoop above his forehead just seems to move around without any influence from the physics of his body and the movement of his head. It gives the appearance of sorta 'combing itself' forward during each loop of the animation. I know the dude is stylish, but unless there's a disembodied comb up there automatically combing his hair as he moves it out of place (which I admit would be fracking hilarious), it really does look off.

Finally, the medium and darkest hair and medium skin tones really do need to be lightened up -- otherwise this sprite looks, at first glance, like it has only 2 colors per part (not including the black outline and transparency).

That should give you a bit of an idea of what to do about the hands and the values you should select for colors. The main difference is not that I simply lightened the colors, but I made the contrast between each value graduation on the ramp more stark, essentially making them more stark in their brightness difference.

I also showed you what I meant about leaving that lone pixel on the wrist and removed the brightest color on his shirt -- you didn't need that light because there wasn't a lot you could light on a dull green seemingly cotton shirt.

Finally, I played with his hair animation on a few frames, but one in particular where it almost flattens out to give it more of that 'bounce' you seemed to be going for.

That should give you a bit of an idea of what to do about the hands and the values you should select for colors. The main difference is not that I simply lightened the colors, but I made the contrast between each value graduation on the ramp more stark, essentially making them more stark in their brightness difference.

I also showed you what I meant about leaving that lone pixel on the wrist and removed the brightest color on his shirt -- you didn't need that light because there wasn't a lot you could light on a dull green seemingly cotton shirt.

Finally, I played with his hair animation on a few frames, but one in particular where it almost flattens out to give it more of that 'bounce' you seemed to be going for.

Just doing something with that extra color that lines the bottom of the shirt near his pants. Just felt like balancing it. Was thinking of the legend of zelda bird logo at the time. Feel free to ignore it. xP