Trying to teach myself pixel art

[Rahsennor]

Any suggestions?

[tokumaru]

Looks pretty good!

The dirty is a little boring with nothing but dots. It'd probably benefit from a less realistic design, like the green platforms, which have a cute wavy pattern.

The green platforms and the bushes could have more volume, seeing as there's hardly any shading on them.

The steps on the ladder look a little weird lit from below, considering that the light source in an open area like this would be the sun. Light generally comes from above in pixel art.

The character looks pretty cute, but since it uses 4 colors, you're gonna need overlays or two similar palettes (black, white and green + black, white and blue) to be able to draw it like that.

[Drag]

It looks like the character is already using two palettes, green for the top half and blue for the bottom half, so it'd work just fine on the NES.

The ground looks great, the green platforms should be shaded a little more because they look too flat right now. I'd argue that the bushes look fine how they are, because they're background scenery and don't need to be as emphasized as the obstacles.

From a theming point of view, the ladder is ok, but doesn't seem to fit as well as some other climbable things would. If you had brick platforms and walls or other manmade things along with what you have now, then the ladder would be fine there, but since everything else is organic, maybe try having vines instead?

Everything else looks nice.

[Dwedit]

Looks like an alteration of Super Mario 2, a little too close for comfort.

[tokumaru]

It looks like the character is already using two palettes, green for the top half and blue for the bottom half, so it'd work just fine on the NES.

It's a mock-up, so there's nothing concrete about palettes or sprites in this picture, so I pointed out that the implementation would need 2 palettes, like you said. It may sound silly, but many starter NES artists take the "4 colors" rule very literally, ignoring the fact that sprites need transparency and that the background color is shared among all palettes.

[Rahsennor]

Thanks for all the feedback!

The ground is almost identical to the start of Gimmick level 4. Definitely too close for comfort. I tried several times to make it more cartoony, but it ended up looking awful every time. I'll be giving it another shot for sure.

The ladder was based on free art by surt, which is in fact lit the same way. It looks like the front of a flat step to me. But Drag is right, it doesn't really fit the theme in the first place. I wanted to avoid vines, but I can't think of anything else I could use instead. I do plan on adding more man-made structures eventually.

The bushes, platforms and clouds are entirely my fault. I kind of like the bushes, personally, but every time I look at the platforms I see the watermelon block from Minecraft. I don't even know what they're supposed to be, I just needed a one-way platform that's visually distinct from the ground.

The character looks pretty cute, but since it uses 4 colors, you're gonna need overlays or two similar palettes (black, white and green + black, white and blue) to be able to draw it like that.

It's the latter. I spent four days getting the head and body neatly split into different sprites, just so I could get four colors with only two sprites per scanline. As a bonus, I can also shear the sprite horizontally to make her lean forward while running, without spending any extra tiles.

The colors shown here are pretty much random - the idea was to pick palettes that could be shared with enemies. Except I don't have any ideas for enemies yet.

I'm a programmer, not an artist, by the way. The technical restrictions are what got me interested in the first place.

Looks like an alteration of Super Mario 2, a little too close for comfort.

That's actually the look I was aiming for, within reason. That said, I didn't use any SMB2 art for reference, so I guess my subconscious knows something I don't.

[Rahsennor]

I replaced the copycat tiles, reduced the tile count (to around 40 unique 8x8 tiles), eased up on the hair dye and added some water.

mockup-2.png (1.88 KiB) Viewed 6379 times

I also managed to make a GIF of the runcycle I'm using in my prototype. It uses surprisingly few tiles, but still probably too many for an NROM game.

player-7-run.gif (2.41 KiB) Viewed 6379 times

[Drag]

The new scene looks much better on all counts.

I forgot, consistency is pretty important too. In your new mockup, the ground more closely matches the style of the other things in the scene, so that was a good change to make.

Just to throw another suggestion out there, it doesn't have to be a SMB2 style vine, it can be a really thick beanstalk, or it can be a tree that happens to grow into a ladder-like shape, or naturally grows ladder handles or something. That'd be pretty cartoony too. You can also just leave it as a plain ladder, I have no complaint with that. Regardless, it does look better with the new shading.

I think the running animation's fine. You can give the player character more frames of animation or more detail than the rest of the sprites, because that's what the player's going to be seeing the most of in your game. And even if you need some more tiles, that running animation can be cut down without losing the idea too much.

[rainwarrior]

I also managed to make a GIF of the runcycle I'm using in my prototype. It uses surprisingly few tiles, but still probably too many for an NROM game.

If the hands and foot are individual tiles, I think you could do that with just 6 tiles in CHR. It'd be 7 tiles in the metasprite, i.e. 2x2 for the main body, 1 for the foot, 2 for the hands (one behind, one in front). The big disadvantage though is you'd be eating up 4 sprites on the scanlines where the hands appear.

Instead of overlaid hands, though, it looks like you only have 3 positions, so that'd really just be 2 CHR tiles for the top half, 6 tiles for the bottom half (3 hand positions, 2 tiles wide), and then 1 more tile for the foot? 9 total? (The foot is fine on its own, since it appears only below the rest of the body it doesn't have to share a scanline with any of those sprites).

I think you've got plenty of room there anyway. Just look at how many tiles Mario uses in SMB. You're flyin'.

[Rahsennor]

The head is ten pixels tall thanks to the ribbon, so it takes 4 sprites. There's only three versions, though, so it's only 12 tiles.

The body is only eight pixels tall, so I can't seperate the feet without overlapping more than two sprites on a scanline somewhere. I'll have to see if I can stretch it up to ten pixels, so I can shift the feet onto their own tiles. But even then, the bottom of the dress overlaps it, so I can't just use one tile and slide it around... lots more tweaking needed. Or I could just live with it eating up 24 tiles.

I also just coded ladders into my SDL2 prototype, so now I have an entire climbing animation to draw.

[dullahan]

A couple notes that I keep in mind whenever I am pixeling or revising a piece:

1. Reduce/remove one pixel noise (which you already did a lot from your first to second iteration).

2. Experiment with "unorthodox" colors for objects. For example, non-blue sky, non-green grass, etc. This can really give character and depth.

3. Remove banding. For example, the grass tiles. (http://pixeljoint.com/forum/forum_posts ... 322#139322)

Overall, I like it. I think you should revisit the shading for the grass, bushes, and clouds. Either add more to create interesting detail or ditch the extra shading hues, use black instead, and then grab a warmer tone for fun details.

Also, I wouldn't worry about how similar your art is to existing stuff especially if that was your study and you are learning. Lastly, I recommend daily pixel art challenges like Pixel Dailies on twitter. You can see some of my attempts on twitter too https://twitter.com/cacciatc

[ClayAnderson]

It's roughly the same process you learn when doing conventional illustration or painting: start with a loose line drawing, fill in shapes of color, add detail. Derek gives a great outline of the overall process.
Going deeper, there are much more specific challenges in pixel art like isometric perspectives and sprite animation. This site has links to a bunch of different tutorials that cover topics like these, You'll discover all sorts of weird quirks to doing pixel art. Lines won't quite connect the way you hope, colors will have unexpected effects on each other. The great pixel artists have solutions for these problems, especially in the older games where they were working in very tight graphical constraints.

[Off-topic external link removed --MOD]

[Rahsennor]

Thank you for all the suggestions, and the link, even if most of it went right over my head.

Comparing pixel art to "conventional illustration" is rather meaningless to me, unfortunately. As I said before, I'm a programmer, not an artist. I'm only trying my hand at pixel art because it's a small enough search space to brute-force.

Since I'm here, I may as well post this.

player-8.png (272 Bytes) Viewed 6095 times

Making GIFs in the GIMP is an exercise in masochism, so no animated walkcycle this time. Is there a better free-software tool for doing this stuff?

[dullahan]

I use a licensed version of PyxelEdit (http://pyxeledit.com/) which also has a free version, but it is older and not as feature rich. JPixel (https://emad.itch.io/jpixel) can be downloaded for free; although, I haven't tried it yet.

[rainwarrior]

I'm a big fan of Aseprite, which is an animation tool designed for pixel stuff.

It's open source, and sort of free. Old versions are available for free on its website, but the author asks for $15 for the latest version binaries. (It's open source though, so you could build them yourself, or get these binaries elsewhere for free if you want.) I used it a lot, so I thought the $15 was well worth it, though.


Just in case you don't know about it, in GIMP there is "Filters > Animation > Playback" which opens a very rudimentary animation preview. It's not much, but it's a big step above trying to preview the motion by turning on and off layers.