Beginner - Lights, shadows, borders etc.

[Kroan]

Hi all,

I'm very new to making pixel art myself but we started on a game we want to make and so I have to understand and learn it.

I made some stuff but something seems odd with it but I can not figure what exactly.
My guess it that the light and shadows that  I try to apply are just not good.

I read about it and tried to follow the advices I found but still I can not get it right...

Before we start, I also have to admit that I'm not that creative so what I do is for example if I need a car I Google for a picture of a car and then use it as the template for my resources. That means that perhaps something is also wrong with my borders of the sprites.
Also with the borders, I'm not sure what is the best practice here, I always use black lines but I saw that many are using darker colored lines instead so when to use what and what's more common?

Anyway here are some examples that I made and feel that something is wrong but can not really figure what it is

A mushroom house


A car


A front door


A tree I made (I feel this one looks quite ok)


Who can give me tips what's wrong and how to improve it?

Thank you all and many greetings

Kroan

[EduardoPras]

Hello Kroan!

First of all welcome to Pixelation.
I hope you find what you are looking for.

I’ll try to help you a bit.

First let me start with things I think you got right.

1)Using reference:
This is great. It will allow you to understand how reality works.
But don’t just trace it. Try to interpret it.(It is hard at first but you’ll get the hang of it.) 

2)Clean Lines:
Your outlines are really clean in the car piece and that means you’ve already studied a bit about the medium. Nice Job!

Now for some things i think you can improve upon:

1)Avoid Pillow Shading like you've done on the mushroom tree (Google this term. It will be more clear than I am able to explain)
2)Pixelart does not have the same resolution as reality. You must simplify your forms and shapes, try to make them as effective as you can.

I am still studying metals and probably someone else can explain them to you better but...
That aside, I’ve made a paint over of your car and made some more notes.
Here are the notes:



And here’s my take on it:


I’ve tried to avoid using the outline color in the inside and simplified the shapes.
It could use more work but I think you can get the idea.
I’ve also enhanced the contrast.

Hope it helps.

[Kroan]

Hi EduardoPras,

thank you very much for the feedback!

Your car looks much better than mine. I will give it a shot again tomorrow, unfortunately I don't have time today. But I'll let you know the result

What you say makes sense and I already read about the pillow shading problem but, for me personally, it is hard to understand how to place the light and shadows in order to follow the 3D shape.
On the mushroom house as you mentioned for example, how to understand what's good to do?

I see that the roof is over the base of the house so it will throw a shadow onto the house. The base is like a cylinder so my idea now is that to the sides the house must become darker (as it goes around).
But what about the light? The roof is on top so it will get a lot of light (which I tried to show with the pillow shading ) and perhaps if I make the "base" of the house like a cylinder the middle will be lightened?

I don't know I will give it a shot tomorrow, too!

Thank you for your help very nice!

Greetings

Kroan

[Kroan]

Hi again, I tried and here are the results:

The house



I removed the chimney as I felt it is interrupting the sprite somehow. Also I replaced the big window in the middle with a clock. I think it looks more interesting that way. I straightened the lines a bit (for example the stone wall around the center, the roff a little)
and tried to follow your advice with thr 1,1,1,2,2,3 etc.
With the light and shadows I'm still not sure, the car I had your great example so it was easier to do.
I did as I said put the dark on the sides in order to go around and tried to lighten up the center (but one can not see it that easily)

The car


I decided to make it blue. Also I have to admit I followed a lot your example with the light and shadows therefore I feel they are good here of course some stuff I had to change as I didn't make the lines one to one with yours.
I also straightened the lines of the rear seat window, and tried to make the lines in general a bit more smooth.
I'm quite happy with the result but on the other hand, this wouldn't be that great without your example ^^

Thoughts?

Thank you and greetings

Kroan

[Zanorin]

Alright, I had redone the whole house but my editor just crashed  so I just redid the roof which demonstrates best what "should be done".

The way you shaded the roof makes it look very much like a cone, and not like something round and full. When you shade, not only you need to determine a light source (I guess you chose top-right corner there ?), but you need to think "How would a real-world object of this kind of shape react when lit this way ?". And since you don't necessarily know the answer, use references.
If you google "ball shading" (since the roof has a roundish general shape), you'll see this :
Spoiler

Analyze and apply that to your mushroom roofs, and you've already got something that looks more like something round and less like a cone (quick and dirty but you see what I mean) :

[Kroan]

Thank you Zanorin,

that was what I tried to do in my first version but ended up falling into the pillow shading trap.

I made a new version of the house.
I tried to do what you suggested, I also tried to apply it to the stairs and I removed the gras from the house as I felt it looks more like a bulk of green than anything else.



I have the impression we're getting close perhaps some final touches (like making the stones of the door and the ring around the house like the ones of the wall I made now) thank you very much so far!

Greetings

Kroan

[EduardoPras]

I am Glad to be able to help Kroan.

The problem I see in your lighting in the mushroom is that it is gradually radiating in circles.
I interpret that it means that the light source is a small point in space really close to the object.

If you are representing sunlight it comes as straight rays directly from the sun. Imagine you have a giant plane emmiting light from every inch of its surface from far away.

That said, the sun makes hard shadows if the day has no clouds.(Due to the way light behaves.)
Remember, light always travels in straight lines.

So, I guess your main problem is choosing a lightsource and sticking with it.

Don’t be afraid of using big shapes of color and always follow the geometry of your forms.

You seem to be missing what a teacher of mine once called “Depth Opportunities”.
Whenever you can suggest volume do it! It will make your shapes more readable.
How does that translates to drawing?
For example(There are infinite more examples):
Make sure when one thing is overlaping another there is space to its suggested mass.
If it feels like a 3D game clipping you lost depth.

Also, I’ve give a bit more of space between the mushrooms’s features. Information needs breathing space.

I’ve also removed the inner outlines, I personally feel that the “outlines” work better on the outside but this is not a rule. There are artists that use internal lines with the same weight of the outlines. I just happen to think it is a bit distracting and color changes can do the same work.

Zanorin also gave a very valuable tip that I think it is fundamental:
If you can’t find an exact reference find something similar. That saved my hide many times now since it is almost impossible for an artist to know the bahavior of every single material by heart.

Here’s my take on the Mushroom House you posted yesterday I started editing it before you posted your new version:



I’ve cheated a little bit in the lighting but I did not have the time to find a better solution.

Hope it helps you a bit.

[Kroan]

EduardoPras you're killing me!
This looks amazing!

I tried to make my own version just like that. I really liked your window in the roof that gives an aditional shadow so I tried to make that one, too!



I didn't change the roof anymore and I kept the third light point on the roof, too.
I made the house a bit higher to give the clock in the middle more room and made the windows on the sides a bit smaller to have more room to the frontdoor.

Greetings

Kroan

[Zanorin]

The horizontal row of stones in the middle of the tower is completely straight, but the tower is supposed to be cylindrical. You should bend it so it follows the curve.

[Kroan]

Thank you Zanorin you're right I missed that one!
I fixed it now and it looks good
Thank you all.

One question, more from a organizing point of view:

How does it work here at Pixelation? If in the future I have more stuff that I want to discuss about, is it better to open a new Thread for it or should I use this one as my "showroom"?

Thank you again and greetings

Kroan

[Zanorin]

From my experience you probbaly should create one new thread per art piece, or else it'll become confusing and you'll get less feedback.

[eishiya]

From my experience you probbaly should create one new thread per art piece, or else it'll become confusing and you'll get less feedback.

I disagree. It's much easier to effectively critique things when there's easy access to earlier work and critique, to see what the consistent problems are and how the artist has responded to them.
What's confusing is when someone wants critiques on multiple pieces at the same time, instead of posting one, getting it done, then posting another in the same thread.

I think Kroan did the smart thing here though, since it sounds like they're not looking for specific help for each piece, but are looking for feedback on what they're doing poorly consistently.

[Zanorin]

You probably know these sort of things better than I do considering you posted 10 times more than me haha. I guess I was thinking that, if a person has already visited a certain topic and is not interested in it, that person probably won't visit that same topic again even if he sees it's been updated, since he doesn't know there's brand new art in it.

[Kroan]

Ok so I will try to continue here. If there's not enough response I'll try with a new one.

I dared to do my very first character sprite. It's supposed to show a young man (around 20) with some headphones around his neck.
What do you think? Anything to do better? I admit that I followed a tutorial but I changed a lot. Different shirt, different hair, different eyes, happier, a bit more muscular . I also tried to give it a bit more comic like look (The tutorial one especially the face looks to realistic for me)

This is my sprite:


And this is the tutorial version (just for the comparsion):


Thank you and many greetings

Kroan

[eishiya]

The character looks off-balance, like he's going to fall backwards.

The things you didn't copy are the hue-shifting and good contrast - the stuff that's really helpful. The smaller the sprite, the more contrast you generally need for the different colours to read well.

The headphones are smaller than his ears. You exaggerated the head size, why not also exaggerate the headphones?

[Kroan]

Thank you eishiya.

Here is my second try



I tried to move the character a bit forward. I also used darker and lighter colors to give a better contrast, was it what you meant?
I increased the size of the headphones but I'm not 100% confident with the positioning of it.

Greetings

Kroan

[eishiya]

This is better!

You can create contrast through more than just darker/lighter colours, you can also use the hue. Changing the hues of the shadows not only creates contrast, it makes the colours feel livelier.

The character's neck blends into their chin. I recommend putting the neck in shadow, so that it's clearly distinct from the chin.

[Kroan]

Thank you one more time eishiya!

I made a version where I tried to work with the hue shifiting



also I made the neck darker you were right about that one.

Thanks and greetings

Kroan