There is a lot of opinions and speculations about game graphics - how they look, how they affect gameplay, how easy they are to differentiate from each other, amongst others. Now this article may be a helpful guide to those who may feel they are lacking in the eye candy department.
I feel there are four main components that make graphics good, and without them, they will either interfere with the gameplay or just look muddy and unintriguing.
COLOR
Is the entire visual spectrum of color contained in a single sprite? That usually means you should tone down the color, or pick fewer colors. That deep azure isn't necessarily the best choice for all things blue, nor is a flaming red the right color for all things hot. A good selection of colors is important, especially in making things pop out from the background. Try to steer from warm colors in the backdrop, as they will visually appear closer to you than other colors, try to keep a harmony between colors, and use a few different colors per level to make it integrate with itself.
On the other hand, muddy colors all around can be depressing too, so you have to keep a balance both ways.
CLEANLINESS & SHADING
This is often overlooked, and this is important in making a game attractive. In cleanliness one has to ensure that the remnants of antialiasing (a sort of black outline) around 3d rendered objects are removed, and line art is cleaned up so that there aren't parts of the drawing that look dirty and thrown together. Shading is important to add detail and make the sprites look less flat. A few pixels of a darker color near the edges of an outline help to make it seem smoother too. Example:
The object on the left is a simple mouse-drawn outline filled with two shades of color, but the one on the right has cleaned-up outlines, shading, and darker colors near the edges of the line to give the illusion of anti-aliasing.
CONTRAST
This is arguably the most important part of graphics, and is often traded in for more eye candy. Although I will probably be flamed for posting a game-to-game comparison of graphics here on TDC, here goes:
The above is a good example of bad contrast. The objects are well detailed, the environment looks interesting, but what is going on?! You can't tell who's where, or what's what, what is active, and what is background, and what will your character collide with or land on, and what he can pick up.
I will now give you an example of good contrast in game graphics:
See? The backgrounds are subtle. The characters pop out like jack-in-the-boxes, there's no guessing involved as to what you can stand on, what is solid, what you could probably pick up, etc.
Now in my opinion, the second of these pictures has much superior graphics. Now you may say, 'This is blasphemy! This is madness!', but I will argue that I would have much more fun with the second game's graphics, as they are attractive as they are workable. Some game designers forget that word 'workable', and only remember the word 'eye candy'. Remember that there is a balance in everything. I tend not to use 3d rendered characters and objects for the simple reason as they do not translate into 2d very well.
DETAIL
This is actually a two-parter.
One is having actual details on your graphics, like a texture on your oranges instead of making them look like rubber balls. Adding ears to heads, making each object have two or three shades of color instead of one, and other things make your game world seem that much more fleshed out, and therefore that much more engaging. You should also tend to put more detail in your characters and objects, and a bit less detail in backgrounds, as it creates more contrast between them that way.
The other is presentation, the little things that make a game interesting and likable. Having menus scroll in and out instead of magically appear or disappear, making a little sparkle when you pick up an item instead of just using the Destroy command, all of these little additions make a more professional and enjoyable game.
------
The bottom line is, graphics should be as workable as they are pretty, because when you sacrifice playability for eye candy, you make it that much less game and that much more screenshot or trailer.
I hope you find something in this article that is useful, and if I missed anything in the above, please post a comment or mail me, and I will revise it.
Actually that AA you used makes the object look thicker, there's too much emphasis on the line. I'd have gone the other way and AA'ed the internal lines, replaced the outer black line with a darker shade of the block colour.
It all depends on how "thick" you want a line or object to look. Overall good article.
Very good points, especially the one on contrast. But I think like Dr. James said, you gave a bad example of cleanliness.
Posted by
22nd August, 2008
I think the shading of the bread is a stylistic choice. I never use black or dark outlines, but perhaps he's choosing to emulate the Gameboy/Nintendo feel.
Another point important to me is that you should use the same coloring technique for the whole game.
You often see quite good handmade sprites and then a background ripped from another game oder just a photo of a landscape. The graphics just dont match an the whole game looks like crap.
Also the design of the backgrounds are important. In a dropdown shooter recently uploaded here you just walk through nearly empty rooms a kill some enemys. Thats boring, personally i do spend alot of time for designing the background.
I guess, that even unshaded sprites work well, as long asa the whole game including the backgrounds are made this way.
Some good points here. I don't entirely agree with the graphics of eternal daughter being all that great though. Many of the environments were just endless expanses of repeated tiles with not enough variation to make them interesting.
I think the key to designing your backdrops is to make them varied yet of a consistent style, and interesting but not distracting when they aren't supposed to draw the players attention for a specific purpose. The top image would definitely benefeit from some better shading and possibly a depth of field style blur on the background.