Cyberpunk Cartoon Character Sprites + Stuff

Started by Scavenger, Mon 16/02/2009 03:29:40

Previous topic - Next topic

Scavenger

So, what one of my little hobbies is redesigning and recontextualising characters. At the moment, I'm making some sprites based off of the Cyberpunk rendition of 'Jakob', my signature character.

Design is here:
Cyberpunk Jakob
I'm pretty happy with how his design came out on the whole. Flavored punky, but still cartoony and simple. I'm not asking for any advice on him, as he's pretty much finalised (I didn't want too complex a design, as I might have to hand animate him, too). He's a specieless cartoon character (as would be everything else in the game, if there was one) and pretty interesting and fun to draw.


Sprites

- Idle Pose: Yawning (arms unfinished)
- Walking pose is kind of an amble.

Things I'm looking for advice on is how to maximise expression with the minimal space I've got available, colour (I'm not THAT hot on palette picking, so any advice on how to make a more efficient palette is welcome. I already cut him down to 16 colours from 28) and pointers on which frames his body should be moving in the walking animation. x3 Not too happy about the walking one, to be honest. His legs are short in the sprites, but they look kinda freaky in the animation. Dunno why. Mostly the colours are bothering me, though.

Anyone care to C+C on the sprites? There's something wrong with them, I can tell, but my eyes aren't yet critical enough to see what. x3

Thanks, everyone ^^

SpacePaw

In my opinion braces should look more like a curve not a straight vertical line (in the walking animation), they also should connect with the pants more in the front, now it looks like he had them on his sides. Besides there is no tail on the walking animation. After adding it and giving it a gentle movement it might look lots better :)

ALPHATT

#2
Could you compile the frames into a .gif animation for us to see how fluent it is?
/sig

SpacePaw

Ok - first of all - the idle animations look great :) (in my opinion at least), the back walk animation is allright when it comes to legs movement but the wings seem to "jump" quickly from frame to frame (there should be more subtle, slower movement). Also I'm not sure about the bounce in his walk, he seems to bounce up+left and down+right and it's not symetrical as it should be...

And still, you havent posted the side walking animation :)

Scavenger

#4
Since Imageshack has failed me...

Seeing it all animated properly, the arms are the things that is wrong, it seems x3


QuoteOk - first of all - the idle animations look great  (in my opinion at least), the back walk animation is allright when it comes to legs movement but the wings seem to "jump" quickly from frame to frame (there should be more subtle, slower movement). Also I'm not sure about the bounce in his walk, he seems to bounce up+left and down+right and it's not symetrical as it should be...

I've tried to make a more subtle curve into the fin animation, but I'm struggling a little making it look natural. I'll keep trying. The bounce up+left appears to be me misaligning the frames when I compiled them into a GIF. I'll try centering the animation on his head rather than 3 pixel from the rightmost foot. x3

And now, some concept art. x3

Jakob and Khato
I think I shouldn't have combined the shading on the characters with the lighting layer. Makes it look messy.

SpacePaw

Yes. The hand movement in the side walk is wrong. It's simply because of that one frame jump to horizontal position. Try walking around a room, you dont rise your hands so high. try lowering them in extreeme frames and it should get better.

I wouldnt mind his tummy beeing one pixel bigger there too :) and some braces movement to the front when he puts his leg forward :)

Ryan Timothy B


Scavenger



Fixed his arms, his hair, made his stomach a little bigger to match his still pose.

SpacePaw

See? that's LOTS better :) Great work. I can see you're getting hang of it :) Congratz!

I think there's one dark brown pixel blinking on his shirt.
The gentle movement of the frindge would look nice on the back walk too :)'

Bouncy tummy would be fun but this would probably get too complicated :P

Scavenger



Can't really get it to bounce properly, but fixed the flashing pixel and added in the last details.

Layabout

The bounce looks a little out. To be honest, on a sprite of this small size, bounce isn't really that necessary, but you should have him bounce in frame 3 and 8 (going off the sprite sheet at the top of the page). They are really the point at where the characters body would be at it's lowest due to leg positioning.

Quick question... what makes this character 'cyberpunk'? He doesn't really have any characteristics I'd associate with cyberpunk. He's just got some flashy headphones. an electronic device on his shoulder and a nifty barcode design on his t-shirt.

That said, the sprite looks better than the source material. *edit* I like the proportions better  :)
I am Jean-Pierre.

SpacePaw

#11
when the body goes down belly should go up, and when body goes up belly should go down. Kind of opposite force movement. It had it's own name, cant remember it now. You know, like you start runing and if you have long hair they will go back and when you stop or jump back they go forward.
The bounce looks REALLY good to me, it's just off the right frames. It'll be perfect after small correction

*EDIT* Oh and try making this small led light on his headphones blink as in the idle yawn, might look cool :) or maybe even one red blink and then one green blink :)

Andail

The walking loop has too many frames for such a simple sprite.
The bounces are off-beat, so to speak. They don't occur regularly, which renders him some sort of limp.

Frame #4 looks unnecessary and out of place. Besides, it's rather un-anatomical; when your legs are the furthest apart, the front feet will point upward, not lie flat on the ground. The foot isn't flat until most of the body weight is over it.

Frame #5 could benefit from having the right leg bend more and the foot lifted, with toes pointing down. 

Remove one more frame from the "right" part of the loop to compensate for the loss of #4.

I'm not sure this will look better, as I haven't tried the loop, but those are steps toward a better animation with some more tweakening.

Scavenger

QuoteQuick question... what makes this character 'cyberpunk'? He doesn't really have any characteristics I'd associate with cyberpunk. He's just got some flashy headphones. an electronic device on his shoulder and a nifty barcode design on his t-shirt.

To be honest, not much - though any given definition of cyberpunk may differ (mine's more Snow Crash/Strange Days/Fifth Element than Neuromancer and Cybernetic things - though that's just my preference) - it's the context he's put in that's cyberpunk (so, Jakob-for-use-in-Cyberpunk-setting rather than really-cyberpunked-Jakob) . Besides which, the more overt symbolism of it I wanted to avoid - to give him the connection with the audience that would not be as strong with something a little more immersed in the setting. He would serve as the surrogate for the player, much like Roger Wilco and Guybrush Threepwood, Simon the Sorcerer, et al are more ordinary than their NPC counterparts. (besides which, isn't the point of -punk to defy preconceptions? I dunno x3)

QuoteThat said, the sprite looks better than the source material. *edit* I like the proportions better
Yeah, I'm more confident sculpting the appearance of sprites than I am drawing characters. Shame I'm so rusty at animating :(

QuoteThe walking loop has too many frames for such a simple sprite.
The bounces are off-beat, so to speak. They don't occur regularly, which renders him some sort of limp.

Frame #4 looks unnecessary and out of place. Besides, it's rather un-anatomical; when your legs are the furthest apart, the front feet will point upward, not lie flat on the ground. The foot isn't flat until most of the body weight is over it.

Frame #5 could benefit from having the right leg bend more and the foot lifted, with toes pointing down. 

Remove one more frame from the "right" part of the loop to compensate for the loss of #4.



Removing the two frames does look quite nice, I must admit. Renders it somewhat smoother. Might have to fix the tail though, hmm.

Andail

Yes, but now you only have one bounce, which is kind of odd :)
Obviously, you need to either have two bounces or none, and considering the simplicity of the animation, you might do without any bounce at all.

Shane 'ProgZmax' Stevens

#15
The problem I see with the animation isn't the style but the overall 'muddiness' of the design, making shapes very difficult to read.  I also agree with Layabout and Andail that the bounce is off and that it could benefit from fewer frames rather than more.  Another issue is the belly simply descends too far below the legs even when considering your source image (and it looks like he has pants only on his legs rather than having a waist).  Based on the extremely dark and saturated color choices, I can only guess that you drew this character on a saturated or black background, which will throw off your colors every time.  With these points in mind, I made an edit:

1.  Altered some of the colors, raising their brightness slightly, though it could be improved.  I was also able to reduce the color count by one by making the outline a really dark blue and using that instead of black for the other parts of the image.

2.  Cleaned up the line work and reduced the confusion of shapes by using darker outlines around the headset and cleaning up the face and legs.  Made the hair look less confusing by applying more logical highlights to the top and using black as an additional shade.

3.  Altered animation so the left arm is fully forward on a right leg down step and fully back on a left down step.  Also made the right arm visible as it goes back.

4.  Made the distant leg darker to reduce confusion while viewing the leg motion.

5.  Altered wings to make them readable and so they would turn with the shoulder.

6.  Changed tail slightly so it turns with the leg motion.

7.  Made the sprite move down on a down step and up as the leg is pulled up.  This makes for a more consistent appearance of motion.

8.  Made the torso twist back and forth rather than bounce so much.  With the stomach hanging down so low the bounce makes his stomach literally look disconnected from the body.





The main thing I think you should focus on is making your sprite more readable, since many of the parts in the original are undefinable shapes like the headset and wings.  I think the character has a lot of potential!


Scavenger

Quote from: ProgZmax on Thu 19/02/2009 15:52:47




The main thing I think you should focus on is making your sprite more readable, since many of the parts in the original are undefinable shapes like the headset and wings.  I think the character has a lot of potential!



Oh god, that is too awesome. I see what you mean - I knew the colours were off but without the knowledge to fix them, I was a little lost. This sprite is so clean and professional, I am really in awe. Before I go on to do any more animations, I will study how you did this sprite and try and glean what techniques I can from it. Redo the turnabout, and see if I can't tweak the colours further.

And yes, I was working on a green background, like one of the animations above. That was probably a huge mistake.

I will return once I have figured out how I can fix what went wrong.

Thank you, all, for your advice ^^.

Shane 'ProgZmax' Stevens

Drawing on any kind of bright or saturated background will throw off your colors every time, and it's a common mistake so don't worry about it :).  Try for a more bland, neutral color (like the one I used) that is just far enough away from the other colors that your image still stands out.  Neutral colors won't negatively impact your art since your eyes won't be affected by a large patch of bright or dark color.  I look forward to seeing your update!

Scavenger



Tried to replicate the techniques ProgZmax did to my sprites - I don't think I did as well, but I'm learning, ma!

SpacePaw

Waaaah, as usual, progz makes perfect edit lol. Now I feel that all my pointers were useless X3.
Anyways, nice new av Progz XD made me like "WOAH!", I kinda like it better than the aligator :)

SMF spam blocked by CleanTalk