AuthorTopic: A first go at a character: animated spaceman.  (Read 8429 times)

Offline daramon

  • 0001
  • *
  • Posts: 73
  • Karma: +0/-0
    • View Profile

A first go at a character: animated spaceman.

on: June 03, 2019, 09:53:18 am
So I'm very new to pixel art. I've looked at a course or two on Udemy and I've been fiddling around with background tiles for a while (the usual: grass, rocks, that kind of thing).

I felt like I was making some headway, so thought I'd have a go at some character animation.

This is my first attempt at a spaceman. He's small as I want the pixels to look chunky in the final game. This cycle contains run, jump and idle. The animation frames were inspired by the walk and jump cycles in a Preston Blair book on cartoon animation (you can find the cycle images all over Google as well.)



This is an earlier iteration without shading, and just the run cycle.



So questions:

 - It all looks very simplistic, and the shading seems uneven between the head and the body. How can I better shade the character to be more space-suit-like? (I'd like to keep a slight orange tint to the player, as the majority of the environment will have an orange hue.)

 - The game concept involves the suit sometimes being empty, controlled remotely by an AI (in game of course. In reality the player is always in control.) In this case, a "breathing" style idle animation doesn't really make sense. What else could I use for an idle animation to add interest? Breathing seems to be so ubiquitous.

 - I'm not overly happy with the "Jet Set Willy" style side-on idle. What kind of poses are there that aren't the "overly dramatic 45 degree to the camera posed" look?
« Last Edit: June 03, 2019, 02:09:01 pm by daramon »

Offline eishiya

  • 0100
  • ***
  • Posts: 1266
  • Karma: +2/-0
    • http://pixeljoint.com/p/28889.htm
    • View Profile
    • Website

Re: A first go at a character: animated spaceman.

Reply #1 on: June 03, 2019, 01:45:49 pm
Your images aren't working. You may want to use a service designed for hotlinking images, such as Imgur, instead of Dropbox.

Offline daramon

  • 0001
  • *
  • Posts: 73
  • Karma: +0/-0
    • View Profile

Re: A first go at a character: animated spaceman.

Reply #2 on: June 03, 2019, 02:10:50 pm
That's disappointing, Dropbox used to be great for that and the preview seemed to be working fine for me.  I even made sure I wasn't logged in.

OK, I've updated using Imgur. Are they visible now? :)

Offline eishiya

  • 0100
  • ***
  • Posts: 1266
  • Karma: +2/-0
    • http://pixeljoint.com/p/28889.htm
    • View Profile
    • Website

Re: A first go at a character: animated spaceman.

Reply #3 on: June 03, 2019, 03:05:33 pm
Yep, the images are working now!


What's the environment for this character? That should determine how you colour them.
In space, there's very little scattering of the light, so shadows tend to be very stark, even on rounded objects. On a planet or inside of a space station, the lighting will of course be different, with more bounce-light and diffusion.
In addition to the shadow quality, the environment would affect the colours. The colours you're using now suggest something like a dusty Martian surface.

For the AI idle, you could have the helmet look left to right and back (or up and down) very smoothly, as the AI scans its environment. Having different idles for AI vs human would be pretty neat, and help remind the player what's going on even if the gameplay doesn't change much.

Turning the body 45 degrees to the camera (or at least some angle that isn't a profile) is very effective for communicating the pose clearly, which is why it's so common. Showing both legs and both arms allows you to have all of those for communicating the character's personality, and allows for interesting silhouettes even with very relaxed, simple poses. Achieving the same with the character in profile would require a more dramatic pose xP

Offline daramon

  • 0001
  • *
  • Posts: 73
  • Karma: +0/-0
    • View Profile

Re: A first go at a character: animated spaceman.

Reply #4 on: June 03, 2019, 03:42:19 pm
> What's the environment for this character? That should determine how you colour them.

There will be inside and outside environments. (Futuristic exoplanet moon base, surface, caves). I may need to create different sprites for the different locations, by the sounds of it.

> In space, there's very little scattering of the light, so shadows tend to be very stark, even on rounded objects.

Great point, I'll have a play with some harder shadows. The surface will have to have some kind of atmosphere though, as there will be life, so even if it's not nitrogen/oxygen there would probably be some kind of scattering I guess.

> For the AI idle, you could have the helmet look left to right and back (or up and down) very smoothly, as the AI scans its environment. Having different idles for AI vs human would be pretty neat, and help remind the player what's going on even if the gameplay doesn't change much.

Excellent idea! Thanks.

I'll get to work on those, and a decent idle pose.

Thanks for your time!

Offline daramon

  • 0001
  • *
  • Posts: 73
  • Karma: +0/-0
    • View Profile

Re: A first go at a character: animated spaceman.

Reply #5 on: June 03, 2019, 03:46:26 pm
Also, a dusty Mars style surface was kinda what I was going for. :)

Offline eishiya

  • 0100
  • ***
  • Posts: 1266
  • Karma: +2/-0
    • http://pixeljoint.com/p/28889.htm
    • View Profile
    • Website

Re: A first go at a character: animated spaceman.

Reply #6 on: June 03, 2019, 04:22:28 pm
You can edit your posts, you don't have to double-post.


You probably won't need to create different sprites, you'll just have to come up with colouring generic enough to work for all of them. You could, perhaps, apply some palette swaps or a colour overlay though, to help ground the character colour-wise in the various settings.

You're right that on a planet surface, there will be scattering and thus softer shadows. Even if the atmosphere is thin or otherwise nothing like Earth's, the dust, and just light reflecting from the surface of the planet will serve to soften the shadows. Interiors often aren't that different from exteriors, aside from colours. Both typically have a dominant light source direction (e.g. from above) and perhaps some secondary light sources (bounce light from the ground/floor, maybe some extra lights in the environment). It would not be difficult to create shadows that work for all of these, by e.g. having a sprite lit from above. Since it doesn't look like your character will be doing any space-walks, you probably don't need to worry about having a stark shadow version.

The hard part will likely be, as it often is, making sure the character's colours feel like the character is in the setting that's around them, when you have a lot of different locations. With a white-ish suit, which is likely to reflect environmental colours, this may be tough. You can simplify things by giving all your environments the same dominant light colour. With clever design, this need not result in samey environments, as you can use different accent colours and different shapes to create different visual identities for each location. Alternatively, you can use palette swaps or colour overlays to make the character match environments with very different colour schemes.

Offline daramon

  • 0001
  • *
  • Posts: 73
  • Karma: +0/-0
    • View Profile

Re: A first go at a character: animated spaceman.

Reply #7 on: June 05, 2019, 08:21:42 am
Thanks, this is all great advice! Especially the palette swaps. I want most areas to have a similar dominant color, but there will be one or two that I really want to look different for story reasons.

I was playing a game recently that got the main character lighting wrong in some areas. The "80s Superman" feel of being cut and pasted in to the environment pulled me out of the immersive experience of the game briefly, so this stuff is important. :)
« Last Edit: June 06, 2019, 04:20:44 pm by daramon »

Offline daramon

  • 0001
  • *
  • Posts: 73
  • Karma: +0/-0
    • View Profile

Re: A first go at a character: animated spaceman.

Reply #8 on: June 06, 2019, 04:25:59 pm
OK, here's a first attempt at breathing. I like the look of how the legs bend, but it's a bit OTT.



Breathing attempt 2:



Better, but I'm still not sure. Any ideas for improvement would be really welcome.



AI controlled space-suit scanning left-right. I'm not sure the glint on the faceplate is doing the right thing.

Offline Kcilc

  • 0010
  • *
  • Posts: 217
  • Karma: +2/-0
    • View Profile

Re: A first go at a character: animated spaceman.

Reply #9 on: June 16, 2019, 07:29:10 pm
Hi daramon!

That's an adorable little spaceman.

Here are some thoughts about the animations:

  • Running animation

It appears as though the spaceman is stopping for a frame as his foot hits the ground. I think it would be helpful to make sure that for every frame that the spaceman's foot (do this for each foot) is touching the ground even partially, it is moving a specific amount of pixels. While the foot is in the air, though, definitely give it a bit of a pendulum motion.

In most cases, a person's gait is pretty constant throughout the entire cycle, and it's especially true for games where the sprite moves at a constant rate. Keeping the foot movement (while it's touching the ground at least) the same across all frames will help prevent a conveyor belt/stutter sort of effect from happening while the character is moving in the level.

  • Jumping animation

Right now the spaceman appears to be jumping forward. I'm not sure how the game is going to use the jumping mechanic, but usually, the animation is designed to be used for jumping straight up into the air as well as forward. If you're designing the jump mechanic to act like other platformers, I'd say try a straight up and down jumping animation because it'll look the best in-game while the player is bunny-hopping around and switching directions mid jump.

  • Breathing animation

Your spaceman is breathing too quickly for it to look natural at the moment. I'd say pause the animation for three frames at the point where his lungs are completely full and the point where his lungs are completely empty.

Also, it looks like his head is tilting back a frame before his lungs are full. Try swapping that so that the head tilts back one frame after his lungs are full instead. His diaphragm should be doing most of the work here, and his head should follow it not pull it.

  • Scanning animation

If you want to be a little extra, you could shorten the length of the reflection on the middle frame by a pixel or two to try to account for the curve of the visor, but I don't think it's necessary. I think you handled the reflection on his helmet great.  :y: