Users browsing this thread: 3 Guest(s)
Sprite/Art for My OUYA Game
#1
Info
I am making my first game, mainly for my son, but am not the best artist in the world and this will be my first venture into pixelart Smile. To this end I'm hoping to get some opinions or suggestions from the community on how certain things look. I will try to keep the relevant items together, but if you do have a critique please be specific as to which image, just so I and others reading don't get confused heh.

I plan to add more as I create more for the game and your input is greatly appreciated.


Current Test Bed
[Image: test-scene-treeline.png?dl=1]
(this image will be updated each time I make an update. Please take a look and let me know what ya think.)

Stationary Sprites
[Image: player0-moving-right.png?dl=1][Image: player_0_standing.png?dl=1]
(The first image was my initial prototype to get the game controls going in game, I thought I would include it to show what I started with heh)

Animated Sprites
[Image: player_0_standing_0.gif?dl=1][Image: player_0_walking.gif?dl=1][Image: player_0_running.gif?dl=1]
Thanked by: Saltonara
#2
Well, let's see...

First off, I think you should take a look at our Spriting Dictionary, which can be found here: http://www.vg-resource.com/showthread.php?tid=13868
That will help familiarize you with some of the terms and techniques you'll inevitably be hearing about using.

That being said, The biggest issue that I notice first is that you seem to have three different syles going on here and all of them are clashing.

You have your character, who is somewhat cartoony, you have the ground, which is sort of flat, and then you have the trees and the flower and clouds which appear to have been made as vector art and don't fit at all.
The trees and the flower have gradients and pillow shading and look more like they belong in a flash game than anything. Not to mention that they have a wide, 3px outline while the ground and the character only have 1px outlines.

You'll need to take all of these things and put them in a single, unified style.
In other words, your first step is to get rid of those trees and clouds and stuff entirely. They might be "sprites", but they aren't pixel art.

also, if you don't mind, could you post your progress in new posts instead of just updating the OP image, that will help everyone to see your progress...
[Image: ndsMEF0.gif][Image: sig.gif]
Thanked by:
#3
Vipershark, I was actually reading through that when you replied :-) Thanks for the information. I made all of it in photoshop, so far the ground and character are all I have been using as imports to my game, I will add trees and what not later, but getting the game controls, gravity, friction, etc. are first.

All the images are raster, but the trees did use a gradient then added some noise for texture. I did take a try at doing dithering on the tree and base, but was none to fond of it and really think it would be overkill for what I'm trying to do.

Cheers for the feedback!
Thanked by:
#4
(01-01-2014, 07:26 PM)Eldon.McGuinness Wrote: I made all of it in photoshop

Ah, that explains a lot then!

Look at this blown-up version of your character.
[Image: KIxmeU0.png]
See those dots all around the outline? That's Anti-Aliasing, and you want to turn it off in PS. AA causes those "blurry" dots all around your sprite, because photoshop tries to blend it into the background.
That might look okay on a light background, but when put on a dark background...
[Image: player_0_running.gif?dl=1][Image: OAeyU3L.gif]
That doesn't look very nice, does it?

In addition, your sprite is using waaaaaaaaaaaay too many colors. 256 of them, to be exact, which is... well, 16 times the amount of colors that you need!
[Image: 7IwnnHq.png]
This is the palette that your sprite is using, and that's actually probably a LOWER amount of colors than are actually in your sprite because .gif files only support 256 colors.
You could do this entire sprite in 16 colors or less.
To emphasize this, look at the forward leg in the blown-up picture above. The forward leg alone has at least 8 shades (that I can actually see, it actually has a lot more judging by your palette), which is at least half the number of colors that should be in the sprite altogether!
In other words, when spriting, never use gradients, ever. ...at least not computer generated ones, as they add in a whole bunch of unnecessary colors.
[Image: ndsMEF0.gif][Image: sig.gif]
Thanked by: Virt
#5
Ok, well I'm gonna work with the head first and see what I can do, if your on in a bit ill post a blow up of it and see if I can do any better :-)

EDIT:
I got rid of the outer bits and tried to add a little dithering and light with out it looking too busy. Lemme know what ya think. I'm not trying to get the best art in the world but something OK would be nice :-P
Cheers!



Black BG
Transparent BG
Thanked by:
#6
Could you repost those at 1px scale so they're easier to see?
[Image: ndsMEF0.gif][Image: sig.gif]
Thanked by:
#7
Sure thing! I think this is what you wanted Tongue

[Image: evjmhBu.png]
[Image: UdJqO3m.png]
Thanked by:
#8
I'm personally not a fan of dithering, but that certainly looks better than the previous version.
What you need most now is contrast, though. You've got five shades for the skin color alone (with one of those shades only being used for a single pixel, as far as I can tell) and four shades for the hair, when you could make due with probably two for the hair and three for the skin.
Adding more contrast will allow you to get rid of redundant shades and keep your color amount down.
[Image: ndsMEF0.gif][Image: sig.gif]
Thanked by:
#9
A general rule of thumb, don't dither unless you really need to :p

Try not to use gradients for pixel art either. A sprite this small doesn't need many colors.
Simple is better in some cases, after all.
Edit:
Whoops, deleted the image
[Image: ULy23Kf.png]
Thanked by: Phaze
#10
That image is broken, Ploaj.
[Image: ndsMEF0.gif][Image: sig.gif]
Thanked by: Ploaj
#11
Perhaps this will be better, I got it down to 2 for hair and 3 for flesh.

[Image: b316.png]
[Image: 9KBUX4f.png]
Thanked by:
#12
Oh, Ploaj fixed his image. That's more or less the technique you want to go for; dithering looks pretty bad unless it's used in very specific contexts. Instead, you want your pixel clusters to be larger and more, uh... cartoony, I guess?
Ploaj's example is a pretty good way of looking at it, though I'd personally increase the contrast a little more, mostly on the hair.
[Image: ndsMEF0.gif][Image: sig.gif]
Thanked by:
#13
The contrast between the shades is almost nonexistant, at least when zoomed out. You're also using many more shades than you need, but that depends on what you're going for. As for the environment(grass, trees, etc) they look okay, but they look like they were made with the circle tool, the trees having an unnatural shape, the grass pattern, etc. Also, the right-hand edge of the grass is poking off the edge; there's no reason for it to not poke off the left-hand edge. Also, the curves in the grass have many jagged lines. The shading on the leaves of the tree is banding, whereas the shading on the log itself is reverse pillow shading(which makes the log look somewhat metallic). Sorry if this sounds rude, but your walk cycle looks more like his legs are jelly wobbling back and forth. The shading difference alone on the legs aren't enough to tell which leg is which. Also, the head should turn a little bit - not as much as the body, but just a little bit, to complement the body.
my fingers hurt a little now
@Vipershark: I wouldn't use the term "pixel cluster" when speaking to a beginner spriter(without describing it, of course). I know that I didn't understand it very much when Gors used it talking to me, aside from the context given.
Thanked by:
#14
Not a spriter or anything like that but if I can help, I'll see about doing that for ya. These guys are a lot better than I am in that respect.

If you need help organizing your ideas and such, I would recommend this website.
http://www.gamesprout.com/
Its honestly a very slow website traffic wise but its got great organization tools and such. I've been helping out a guy on there with his zombie tactics game with concept and story.
http://www.gamesprout.com/ideas/344
[Image: k0OsVum.png][Image: NXpkf1V.gif][Image: psychicspacecow.png]
Thanked by:
#15
Not sure if it's a little too late to mention what I'm gonna say but I couldn't help but notice what the OP said in this post:
(01-01-2014, 07:26 PM)Eldon.McGuinness Wrote: I made all of it in photoshop

I'm just going to make a suggestion for future reference, don't use photoshop if you want to use pixelated artwork in your sprites (and I'm assuming that's what your going for here). Unless you really know what you are doing you're more than likely to make the sprite end up looking like it's a JPEG image, and visually that doesn't look good.

You're better off using Microsoft Paint or a similar product to that if you don't have a PC on you (and to my understanding there is an alternate program for Mac that's just like paint but I don't remember the name for it.)

If Paint is a program that you feel you can't work with, I'm also going to suggest Graphics Gale. In my honest opinion that's the most powerful tool for spriting in pixel art there is because you have a variety of tools in that program, such as layers to help you out with doing the work on your sprites. Plus you can download it for free.

If you're interested in graphics gale, I'm gonna leave this link here in case you want to get it:
http://www.humanbalance.net/gale/us/
Discord is Dioshiba#9513
Thanked by: E-Man


Forum Jump: