Jump to content

  • Log In with Google      Sign In   
  • Create Account

We're offering banner ads on our site from just $5!

1. Details HERE. 2. GDNet+ Subscriptions HERE. 3. Ad upload HERE.


Don't forget to read Tuesday's email newsletter for your chance to win a free copy of Construct 2!


Why does this look so flat?


Old topic!
Guest, the last post of this topic is over 60 days old and at this point you may not reply in this topic. If you wish to continue this conversation start a new topic.

  • You cannot reply to this topic
5 replies to this topic

#1 nicksaiz65   Members   -  Reputation: 200

Like
1Likes
Like

Posted 27 October 2012 - 04:10 PM

I've been working on a pixel art piece to help myself get better. I am trying to draw an anchor. I am not finished yet, but I have noticed something. With the exception of the edges, it looks very flat. I tried to add some shading, but then it looks just plain bad. Can you guys tell me how to make it more 3d looking? Or can you help me out with the art itself? I've attached the image I am using as a reference, and my actual piece. Thanks.

Attached Thumbnails

  • Anchor.png
  • ResizedAnchor.png

I am the man who will become the pirate king!

Sponsor:

#2 JTippetts   Moderators   -  Reputation: 8582

Like
0Likes
Like

Posted 27 October 2012 - 05:47 PM

Shading is really the only way to make something look not flat. What do you mean by "it looks plain bad"?

#3 nicksaiz65   Members   -  Reputation: 200

Like
0Likes
Like

Posted 27 October 2012 - 06:15 PM

I guess I should be asking, "how should I shade this so that it looks good?" Especially on the top part of the anchor. Sorry I don't have any examples, I saved over my work Posted Image
I am the man who will become the pirate king!

#4 Dragonsoulj   Crossbones+   -  Reputation: 2117

Like
0Likes
Like

Posted 27 October 2012 - 06:58 PM

Search deviantART.com for some pixel art tutorials. They have a few good ones for shading, I'm at work, right now, so I can't check for the ones I found helpful.

#5 JTippetts   Moderators   -  Reputation: 8582

Like
4Likes
Like

Posted 27 October 2012 - 10:45 PM

If you're not yet skilled at pixel art, one trick you can do is to draw it several times larger than you want it to be, then scale it down to the size you need. If you are not good with form, you can try modeling with simple 3D shapes in something like Blender, then tracing over it with pen tools in Gimp to provide strokes and outlines. A quick (and pretty crappy) example of both techniques:

Posted Image

The anchor was quickly modeled by dragging some points in Blender and doing a Skin modifier plus a subdivision surface, then rendered and quickly traced with some outline, then scaled down. Working from a 3D render like this can also help you to work on your own hand-shading if that is the way you really want to go. The 3D render gives you a template to work from, and you can draw and shade on a layer over the top of it to practice your skills.

#6 Prinz Eugn   Crossbones+   -  Reputation: 3654

Like
9Likes
Like

Posted 30 October 2012 - 01:02 AM

This following is from a pixel art standpoint, JTippets' method is completely legitimate. You can also scale down the original and trace over it to see how it works, although that gets into murky legal territory with "derivative work" if you plan to use it in a project.

nicksaiz65, you have a good start, but I think you need to understand lighting better to get good results out of shading. Basically, you have to pick a light source and stick with it. The standard, more or less, is assuming the light source comes from the top right or the top left. Don't put down different shades without understanding where the light is supposed to be coming from. It looks like you put down the yellow circle to help you with that, but you have to carry that through your whole sprite. Parts facing the sun = lighter, parts facing away = darker, and parts parallel = no change or very light changes. Remember that and you'll be most of the way there!

Here's my shot at the anchor so you can see what I'm getting at:

big anchor.png

Actual size:
small anchor.png

One important thing to note is that it looks like your reference kind of cheated a little bit. They shaded parts against the theoretical lighting direction to make there was enough contrast, which is fine but you have to be very careful doing that. See how on the ring, the light's coming from the left, but one the hooks, the light is coming from the top? Sometimes to make sure things look round you'll have to bend the rules a little bit like they did, but remember that it shouldn't be noticeable- you want the main light source and direction to be absolutely dominant. Of course, you don't always have one light source, but that's another topic...

The ball-weight things are kind of a special case because sphere shading is a little tricky, so here's a thread that covers that specifically: http://www.gamedev.n...r-my-pixel-art/ Basically, the brightest part does not always go on the very edge of the object.
 

You should keep in mind a few basic limitations other than shading. You picked a challenging (that is, complicated) shape to start with, so don't get discouraged. That anchor is not the easiest to squeeze into a 40x40 sprite and preserve much detail. Some objects simply do not translate well, so don't be afraid to modify/simplify things away from the reference in order for the pixel art to work better. For example, the rope is going to be hard to shade since can only be a couple pixels wide at any one point without becoming too fat looking compared to anchor. I think it would be a good idea draw the anchor alone and save a copy, then put the rope over it. If it doesn't work, go back to the rope-less version. I would also be careful with changing the width of the rop, it looks like you exaggerated it too much, and remember it'll look cooler if some of the rope goes behind the anchor (you have it all flowing in front). I played it safe and didn't change the width any in my rope version:

Roped.png

Keep at it!

-Mark the Artist

Digital Art and Technical Design
Developer Journal





Old topic!
Guest, the last post of this topic is over 60 days old and at this point you may not reply in this topic. If you wish to continue this conversation start a new topic.



PARTNERS