Do People Still Like Pixel Art in Games?

[GeekNProud]

Hi, everyone

I am currently working on a game called "Heroes of Earth" almost entirely on my own, with occasional support from a friend working on the story. Of course, this means I am also creating graphics for the game, which is unfortunate because I am not much of an artist.

I decided on pixel art to make characters and objects, because it has ended up with the best results for me so far, but I don't know if this style is still appealing to people.


Here are a few screenshots to show what they look like in-game.


And a more recent version...





Thank you in advance for any feedback.

[AlexWeldon]

Personally, I find bad pixel art less offensive than bad 3D rendering. However, I've always found it a cop-out when people claim to be "not much of an artist." It's true that real artistic genius requires a certain fluke of genetics, but any old schmuck can make something that looks decent if they take a couple of art classes and practice. To be honest, what you've got in your screenshots looks more like "I'm too lazy to take more than 30 seconds on a drawing" than "I don't have any formal art training, but I'll do my best."

If you want to sell your game, you're going to need to find some cash and hire an artist, but even for a DIY hobby game you could do much better if you took a little time on it and used a program other than MS Paint.

[Christian]

I recommend if you want to make your own art, to first get better at drawing, you dont need to be an artistic genius to paint or draw well, you just need to make an effort to learn.

Heres is a site where you can study the excellent Andrew Loomis books: www.fineart.sk i recommend you to start with "succesfull drawing".

How old are you? Do you have experience making other games?, do you plan to release this as a comercial game?.

[GeekNProud]

Originally Posted by AlexWeldon

To be honest, what you've got in your screenshots looks more like "I'm too lazy to take more than 30 seconds on a drawing" than "I don't have any formal art training, but I'll do my best."

At this point, yes I did blow off the visual aspect a little too much, as I wanted to focus mostly on the programming, and it is still in the *very* early stages on development.

Originally Posted by AlexWeldon

a program other than MS Paint.

I used Pixen, but your point is still valid.



And Christian, thanks for the suggestion. As for your questions, I will be 18 later this month, and have been toying around with game programming for a couple years. This was more of a "in my spare time" kind of project and a few of my friends have been interested in it, so that will probably be about as far as it goes.

[AlexWeldon]

Originally Posted by GeekNProud

At this point, yes I did blow off the visual aspect a little too much, as I wanted to focus mostly on the programming, and it is still in the *very* early stages on development.

Fair enough... do the easy stuff first in case you have to change it later. It seemed like you were asking what we thought of the screenshots though; I imagine we're in agreement that you can do better once you take your time for it.

As Christian says, for the artistic side of things, just take a class.

For the technical side of things, here's how I've been creating 2D art for my game, using Photoshop:

* For small sprites, less than, say, 50x50 pixels, I set the grid increment to 5 pixels with 5 subdivisions, so I can turn it on and count individual pixels easily. When doing things that small, a certain amount of problem solving and math goes into cramming all the detail you want into the limited space.

* For these small sprites, I use the pencil tool and draw everything pixel by pixel. Rather than manually setting a specific color for each pixel though, I tend to work over things several times. I do the first draft at 100% opacity, but after that go back and forth between the eyedropper and a ~25% opacity pencil to smooth the transitions and get rid of jaggy edges.

* For larger images, I sketch by hand first and scan the image in. I make that the top layer of my canvas and set the layer mode to Darken (or, if the image is going to be dark, I invert the sketch and set the layer mode to Lighten). That way I can see the lines of my sketch without obscuring what I'm working on.

* For the larger images, I use a wider variety of techniques.

* For smooth things, I mostly just paint them.

* For things with texture, I create the texture incrementally, scribbling with the pencil in various colours, then using Gaussian Blur and/or Median to smooth it out, then scribbling again until I have the level of detail I want. Then I use the clone brush to paint with the texture, and use a combination of painting, dodging and burning to add light and shadow.

* After you've got all the individual objects in your art done, you can tie it together by adding extra layers (with modes like Hard Light, Soft Light, Multiply, etc.) and painting with a soft brush at low opacity to create ambient lighting effects.

----

Here's the sketch I did for the tutorial illustration in my game (you can see the finished art in this thread). As you can see, you don't need a whole lot of artistic talent up front if you're willing to take your time on the finished piece.

[electronicStar]

Crappy art can work, but whatever style you choose, there must be some sort of coherence.
In your screenshot , some objects are heavily pixelled (characters) while other are smoothed (road, radar). And it seems also that the pixel size isn't the same for all objects.
I think if you tried to fix these two problems the result would be better already.
And as other said, if you want to have some success you need to polish eveything, even crappy art needs to be polished.
If you want to see a good example of what you're trying to achieve, take a look at the Cactus' games

[Mattias Gustavsson]

Yes, consistency is very important. You can't have all those blurred objects, you can't have tilted pixels, and you can't have pixels of different size. It will just look strange compared to other pixel art.

Originally Posted by GeekNProud

This was more of a "in my spare time" kind of project and a few of my friends have been interested in it, so that will probably be about as far as it goes.

So.. Are you saying you're not planning on selling this?

[GeekNProud]

Alex- Thank you for those tips; your work is truely impressive. I plan to take some art courses next year in college, but in the meantime I'm going to put more effort into graphics with GIMP (I haven't bitten the bullet and paid for PhotoShop yet...)

Originally Posted by Mattias Gustavsson

So.. Are you saying you're not planning on selling this?

Yes, at least for the time being.

[GeekNProud]

Oh yes, and I forgot to address the difference of the "smooth" road and RADAR... The paths are generated in each level from a series of points and drawing the path between them (no pre-rendered images for the ground), just another facet of my poor design/planning >.<

[Reactor]

Don't worry about Photoshop for now. Grab Graphics Gale.

[Bad Sector]

I think GIMP is way more than enough for making pixel art :-).

[Reactor]

Graphics Gale is free, and allows you to see your sprite animations as you make them. That's something Gimp lacks.

[Bad Sector]

Unless you make them as GIFs :-). I save my animation frames in layers (its easier to animate when you have the previous frame in 50% opacity - and very similar to how traditional animation is done) and when i save as a gif file, it uses the layers as animation frames.

Of course a dedicated program is probably better. However he mentioned he uses Pixen, which is a Mac-only product therefore his only other (free) solution is GIMP, which is pretty good for that.

[Reactor]

Right you are.

[GeekNProud]

I spent about an hour last night re-doing the Cruiser that appears in the game using some of the things Alex suggested.


New


Old

Still almost painful to look at, but I think with practice I should be able to get the visuals to a reasonable state. Thanks for the help everyone.

[AlexWeldon]

Originally Posted by GeekNProud

I spent about an hour last night re-doing the Cruiser that appears in the game using some of the things Alex suggested.

What you've got is a good base layer... having something smudgy like that underneath keeps it from looking too flat, pixelated and artificial, which is the problem you had with the first one.

However, it's a bit too smudgy to be finished... you've gone too far the other way. What you need now is to straighten out the edges a bit (polygon lasso, delete), fix up the fire (use the smudge tool to pull out little flames and then play around with the clone brush), and most importantly add some sharp highlights to the colorful bits to make them pop. For the highlights I just created a new layer, selected triangles with the polygon lasso, filled with white, reduced the opacity, and then used the smudge tool to round the ends. Something like this:

[Spore Man]

BLEAH.

In pixel form it has a STYLE. The other red ones are just "bad art". If you can't make good art, make "stylish art".

The pixel look is fine, but you have to turn off anti-aliasing so it stays chunky and jagged.

[AlexWeldon]

Originally Posted by Spore Man

BLEAH.

In pixel form it has a STYLE. The other red ones are just "bad art". If you can't make good art, make "stylish art".

The pixel look is fine, but you have to turn off anti-aliasing so it stays chunky and jagged.

I kind of agree and kind of disagree. It's true that his red thing is uglier than the other one, but it's a step in the right direction. When it comes to art, things often get uglier before they get prettier, and if you stick to drawing squares and stick figures and pretend that it's "stylish," you won't get any practice making actual art.

Maybe it was backwards of me to say the smudgy thing was a good base layer though. I sometimes work that way, because I like a more organic look for certain things, but the conventional wisdom is to go sketch -> shapes -> detail. So, if I was doing that kind of triangle ship thing, it might go something like this (just a 20 minute job mind you... I'd spend more time on it if I was doing it for one of my games):



Do a crappy sketch and scan it. Use the pen tool, polygon lasso or whatever to make your basic shapes. Then add some lower-opacity layers and paint in highlights and shadows. Maybe give it a little drop shadow to separate it from the background, but don't overdo it. Definitely don't put a drop shadow on the flames, like I did. ;-)

Of course, this way it looks like shiny plastic and doesn't have much texture... but if you're going for "stylized," that's fine... and this kind of thing is definitely easier to pull off than trying for something with too much detail.

[GeekNProud]

I started all over again and ended up with this.



Is this any improvement at all? I think it looks a little too flat and I tried to highlight the top half and keep the bottom in shadow, but I need to do some more work on it.

I really do appreciate all the honesty and the "Art for N00Bs 101" lessons

[AlexWeldon]

Originally Posted by GeekNProud

I started all over again and ended up with this.

Is this any improvement at all? I think it looks a little too flat and I tried to highlight the top half and keep the bottom in shadow, but I need to do some more work on it.

I really do appreciate all the honesty and the "Art for N00Bs 101" lessons

Getting better. Assuming that you're going for a more stylized than realistic look (which I think you should), you're going to want to be sharper and more bold, which is why it does, as you say, look flat now.

The biggest problem is that the contrast in your texture is greater than the contrast between your light and shadow. You need it the other way around. Assuming you're doing the shading on a separate layer as I suggested, turn up the opacity, and turn down the contrast on the texture layer.

I'd also make the strokes darker (100% black, I'd say). If you're going to do something, don't do it halfway.

[Christian]

Its getting better, heres a little advice. When designing things its allways a good idea to get a lot of references of the things you want to make, in this case is aircrafts, so you should get a lot of pictures of different aircrafts and play with their features to build your own special custom made aircraft. If for example you wanted to make tanks, you would also gather lots of tanks and manchinery pictures to get features that you like from all of them and form a new design.

Heres are a few picture i found for you to use:

http://ram-home.com/ram-old/spitfire-9-draw.jpg
http://bevhoward.com/BuDraw.gif
http://home.mit.bme.hu/~tade/pages/drawings/draw2.gif
http://www.airportjournals.com/Photo.../0607016_5.jpg

As a reminder, the objective is not to copy-paste their design, but to see their structure, its features, characteristics, proportions, parts and the things they do, and be inspired by them to design your own aircraft, so by borrowing and "interpreting" ideas you can imitate that sense of realism that these have.

Good luck!.

[Jason Chong]

Personally, in my humble opinion, the best way to get faster results is to learn up 3D modeling/animation.


Pixel art is too hard to make them look good, but when they do look good they look awesome.


I've never had art training and I self taught myself 3D modeling/animation so I'll let the renderer do the drawing for me from different angle, style, color change (easily).

This is how my programmer art looks like after a few years of learning 3D animation/modeling.

[electronicStar]

Yeah 3D is an option, but not everybody can do good 3D, even if it's easier than drawing. It still requires skills.

[Bad Sector]

Its probably because i didn't spend my school years modelling in the books (not having a 3D modelling interface embedded in the books helped here), but i still find 2D easier to handle than 3D when it comes to creating art :-).

In both cases, though, you need skills. And these are gained only by practice :-).

[GeekNProud]

I smoothed out the textures and the lighting a bit



Is this what you meant for making the strokes darker? I originally had it with black lines but I thought the outline made it look cartoon-y again. Maybe just black around the the yellow details and the cockpit with just shadow around the outline, like this?

[AlexWeldon]

Originally Posted by GeekNProud

Is this what you meant for making the strokes darker? I originally had it with black lines but I thought the outline made it look cartoon-y again. Maybe just black around the the yellow details and the cockpit with just shadow around the outline, like this?

Things don't have lines around them in real life, so you're right: putting a stroke on things makes them less realistic, either cartoonier or more technical, depending on the overall look. However, that's part of the "style" thing that Spore Man was talking about. If you want realism, you're probably better going the 3D route. If you're going to stick to 2D, you want to make stylistic choices that jive with the feel of the game itself - for instance, in my game, I tried to make it look and feel like a board game, and wanted the characters to be cute and cartoony but just a little bit dark.

Look at the various pieces of art here:

http://kotaku.com/photogallery/sftribute/

They're a sample of the stuff in an upcoming coffee table book in which many different artists draw their take on the arcade classic Street Fighter II. Of course, the game being what it is, most of the drawings have a bit of Japanese flavor to them in one way or another, but they're all very stylized. Try to think about why each one looks the way it does - what tricks the artist used.

Since we're on the subject of strokes, look at those:

The first drawing is the most cartoony, but actually has no strokes - the color contrast makes strong separations, so strokes would be overkill.

The second has small strokes, but some are light and some are dark, so they work with the shading for a more realistic overall look.

The third has thin strokes, and they're necessary because of the low contrast. Without them, she'd disappear into the background. Here, though, if they were black, it would be too much.

The fourth has strokes, but used selectively where they're needed, and some thicker than others, which makes the illustration more dynamic.

The fifth has some seriously stylized (and seriously awesome) strokes.

The last, by Penny Arcade's "Gabe," has the most conventional "cartoon"-style strokes, combined with a digital technique that's meant to look a bit like a handmade silkscreen, where the fill never quite lines up with the outline... quite a popular style among graphic designers and commercial illustrators, who dream of the old days when posters were made by hand.

[Christian]

Originally Posted by Jason Chong

Personally, in my humble opinion, the best way to get faster results is to learn up 3D modeling/animation.


Pixel art is too hard to make them look good, but when they do look good they look awesome.


I've never had art training and I self taught myself 3D modeling/animation so I'll let the renderer do the drawing for me from different angle, style, color change (easily).

This is how my programmer art looks like after a few years of learning 3D animation/modeling.

Its inspiring for me to see this kind of stuff, it demonstrates what one can do if they set a goal, its encouraging, good job.

[berserker]

Yes, Jason is right, pixel art is way more complicated than 3D modelling and naturally pixel artists are more rare than regular 3D artists. That's why we decided to make only characters in pixel art and rest in 3D in our latest project called GUNROX instead of doing whole game in pixel:

[Bad Sector]

And the last screenshot is a good indication why you shouldn't mix two different art types. They clash :-). The characters look a bit out of place and i think that using 3D characters (or fully pixel art scenes) would be better.

Of course if the game is very good it doesn't matter very much (early 3D final fantasies looked awful, but after a few minutes you were sucked in the game because the rest was very good). But it helps if you stick to a style. Inconsistency is worse than bad art.

[AlexWeldon]

Originally Posted by Bad Sector

And the last screenshot is a good indication why you shouldn't mix two different art types. They clash :-). The characters look a bit out of place and i think that using 3D characters (or fully pixel art scenes) would be better.

Of course if the game is very good it doesn't matter very much (early 3D final fantasies looked awful, but after a few minutes you were sucked in the game because the rest was very good). But it helps if you stick to a style. Inconsistency is worse than bad art.

I agree that inconsistency is often worse than bad art, but I don't know if I'd agree that the characters clash with the background there... they stick out, for sure, but that's a good thing in my books. As I've argued in a lot of threads, the worst thing of all from a UI perspective is when you can't tell the characters and interactive objects from the background.

Actually, I really dislike most 3D stuff, but I don't mind what he's got. It's simple and matte enough that I find it inoffensive. What I really hate about 3D is when things are excessively shiny and over-textured.