AuthorTopic: Help with Tileset / Scenery [C+C]  (Read 15768 times)

Offline TheShard1994

  • 0001
  • *
  • Posts: 30
  • Karma: +0/-0
    • View Profile

Help with Tileset / Scenery [C+C]

on: March 14, 2011, 06:29:54 am
Hey,
I'm working on a tileset of a house with a thatch roof, but I have NO idea how to properly shade the roof...
I got this:


Please note that the tiles which are exact copies of eachother will have variations later on.
I would like some comments/critics :)

Greets,
Shard
« Last Edit: March 25, 2011, 06:40:39 pm by TheShard1994 »

Offline TheShard1994

  • 0001
  • *
  • Posts: 30
  • Karma: +0/-0
    • View Profile

Re: Tileset House & Thatch roof[C+C]

Reply #1 on: March 14, 2011, 03:04:22 pm
Added some details to give u guys a better vision of what Im doing

Offline Jad

  • 0100
  • ***
  • Posts: 1048
  • Karma: +0/-0
    • View Profile

Re: Tileset House & Thatch roof[C+C]

Reply #2 on: March 14, 2011, 03:15:47 pm
First of all it's hella hard to get a good feel for the colors with those dang magenta lines, they're seriously in the way

Same goes for yellow background. Make it something like a toned-town sky blue or something so we can get a natural atmosphere in the picture.

The roof looks mighty weird as you say, but one of the most important things would be to let the roof change color according to angle. The whole top tile would be much brighter, right? The whole row, I mean. Since it's facing upwards. While the vertically aligned tile would be something like the color it is now. Change that, for starters
' _ '

Offline TheShard1994

  • 0001
  • *
  • Posts: 30
  • Karma: +0/-0
    • View Profile

Re: Tileset House & Thatch roof[C+C]

Reply #3 on: March 14, 2011, 03:23:14 pm
Thx for the help. I just think it's a bit easier to work with those bright colors, but they might indeed be obstructing a natural feeling.

Offline malkomk

  • 0001
  • *
  • Posts: 39
  • Karma: +0/-0
    • View Profile

Re: Tileset House & Thatch roof[C+C]

Reply #4 on: March 16, 2011, 05:04:25 pm
Aah, much better. I think it improves the look of the picture dramatically.
Sorry I can't help you with roof shading as I'm a beginner at this myself.

Offline TheShard1994

  • 0001
  • *
  • Posts: 30
  • Karma: +0/-0
    • View Profile

Re: Tileset House & Thatch roof[C+C]

Reply #5 on: March 17, 2011, 06:12:03 am
yeah it does improve a bit.

Also, I think it's best if i make some reed(?) stick out of the bottom of the roof, now it's all straight..

Offline pistachio

  • 0011
  • **
  • Posts: 638
  • Karma: +4/-0
  • Mostly lurking
    • http://pixeljoint.com/p/125138.htm
    • View Profile

Re: Tileset House & Thatch roof[C+C]

Reply #6 on: March 17, 2011, 06:45:14 am
It seems like you're using a lot of colors on the roof and brickwork, but I don't know how many exactly though. The curtains seem flat (stuck to the window?), the cause of which is probably that most of the shading lies around the edges. The colors on the vase could use some more contrast to make it seem like it's actually shaded. There are also a lot of black outlines, and this applies to the whole image, especially the lanterns.
« Last Edit: March 17, 2011, 06:56:49 am by pistachio »

Offline TheShard1994

  • 0001
  • *
  • Posts: 30
  • Karma: +0/-0
    • View Profile

Re: Tileset House & Thatch roof[C+C]

Reply #7 on: March 18, 2011, 06:07:46 am
The style of my game has the black outlines, a lot, so that's why they're so many :P
Why does the vase need more contrast? then It'd look a bit gray, instead of white?

Offline pistachio

  • 0011
  • **
  • Posts: 638
  • Karma: +4/-0
  • Mostly lurking
    • http://pixeljoint.com/p/125138.htm
    • View Profile

Re: Tileset House & Thatch roof[C+C]

Reply #8 on: March 18, 2011, 07:14:17 am
The style of my game has the black outlines, a lot, so that's why they're so many :P
Why does the vase need more contrast? then It'd look a bit gray, instead of white?

Darn, post accidentally got deleted. Let's see what I can forage from memory...

I've heard of the "it's that way because it's my style" argument many times before. Usually doesn't end well. The end result is almost always a lot of critique being rejected.

What I mean is black outlines everywhere... Well it doesn't always look good. Colored outlines, maybe. Or perhaps it's just that most of the lighting is on the edges. Here's an edit on the lantern, to show you what I mean...



As for the vases, contrast doesn't necessarily mean dragging everything down a shade. It basically means that the darker colors get darker, and the lighter colors get lighter, but just slightly in this case. And what hue shifting is making the darker colors tint towards a certain color. The darker they get the more intense the color is. Here's another edit:



I kinda ruined the selout.
« Last Edit: March 18, 2011, 07:24:28 am by pistachio »

Offline Jad

  • 0100
  • ***
  • Posts: 1048
  • Karma: +0/-0
    • View Profile

Re: Tileset House & Thatch roof[C+C]

Reply #9 on: March 18, 2011, 08:29:51 am
The style of my game has the black outlines, a lot, so that's why they're so many :P
Why does the vase need more contrast? then It'd look a bit gray, instead of white?

Naaaah, you can trick the brain more than that, bro. The power of contrast works on a bigger scale than that. Just cause something has gray shades in it won't make it look gray. And if it does, it's probabl because the bricks surrouding it are too bright. Which, incidentally, they probably are.

 ' 3 ' you should read up on this, and contrast between colors, et cetera, how it all works, this way you'll soon be able to paint a whole scene in orange and still make the human brain register a yellow-orangeish vase as 'white'. ' U ' the best artists have mastered this, so learn it, don't question it.
' _ '

Offline SimTheDog

  • 0001
  • *
  • Posts: 15
  • Karma: +0/-0
    • View Profile

Re: Tileset House & Thatch roof[C+C]

Reply #10 on: March 18, 2011, 10:43:32 am
I don't like the existance of black outlines in your picture. I think that it would look better if you either thickened the black outlines or removed them altogether.

Offline TheShard1994

  • 0001
  • *
  • Posts: 30
  • Karma: +0/-0
    • View Profile

Re: Tileset House & Thatch roof[C+C]

Reply #11 on: March 19, 2011, 07:29:37 am
It does look nice indeed :) But first I prefer to fix the roof a bit ^^

EDIT:
Thought I'd give you an idea of stuff to design with the tileset :)


(don't pay attention to the ""glass"", it sucks.
« Last Edit: March 19, 2011, 01:49:35 pm by TheShard1994 »

Offline TheShard1994

  • 0001
  • *
  • Posts: 30
  • Karma: +0/-0
    • View Profile

Re: Tileset House & Thatch roof[C+C]

Reply #12 on: March 20, 2011, 03:25:25 pm
another mock-up, please help me out with the roof, I want to continue working on my game XD


Background(the sky) is temporary, as is the water, as are the foreground tiles (the ones that are waaaaay too bright)

EDIT: And some of the tiles lost some color values >.< In-game it's no problem
« Last Edit: March 20, 2011, 03:35:49 pm by TheShard1994 »

Offline Ixis

  • 0001
  • *
  • Posts: 35
  • Karma: +0/-0
    • View Profile
    • Ixis' dA site

Re: Tileset House & Thatch roof[C+C]

Reply #13 on: March 20, 2011, 04:48:54 pm
Click on the image if you're having a hard time reading it. I'm a freak for the 04b3 font. :lol:

Offline TheShard1994

  • 0001
  • *
  • Posts: 30
  • Karma: +0/-0
    • View Profile

Re: Tileset House & Thatch roof[C+C]

Reply #14 on: March 20, 2011, 05:39:29 pm
Awesome ^^

-I'll check Secret of Mana ;)
-Is the lighter brown a big problem? I did this with everything in the game: the right side always has a one-line highlight, looked like a cool style :)
-The curtains do suck indeed :/
-I'll try to redo the lamps
-The background is just a picture from internet, and since I saved the final mock-up as .gif, it messed up XD
-The thinner streams ARE resized XD Were just to try it out. The broadest stream to the left also sucks, looks too blocky.
-The plants, would they need to be a bit/way darker?
-The dithering on the face was because the character never shows his eyes. NEVER. I used a black shading there, and tried to make it a bit smoother with dithering.
-I'll also recolor the darker/lighter tilelayers. I just poorly shifted their hues :/ Lazy ^^


Also: I love that font too ^^

EDIT: How could I fit blue/purple in the roof ? :/ I tried it, it just messes up
« Last Edit: March 20, 2011, 08:30:52 pm by TheShard1994 »

Offline Ixis

  • 0001
  • *
  • Posts: 35
  • Karma: +0/-0
    • View Profile
    • Ixis' dA site

Re: Tileset House & Thatch roof[C+C]

Reply #15 on: March 21, 2011, 10:13:38 pm
- The light brown line gives everything a subtle embossed look. This is because there's also a black outline. If it was just the light brown line it would be somewhat similar to sel-out (scroll down till you find the section).
- The plants don't need to be darker, check this out,

If you notice the plants, they're thicker and instead of using blacks they simply have darker greens in the shadowy areas. Plants usually are small in pixel art, and putting a black outline around them would make them stand out (and they're already a little bit dark.) So using dark/desaturated greens will allow you to give the plants volume and form without having to use black pixels. Visually your eye will combine them.
- Dithering is fine, you just need to use dithering elsewhere instead of just one place.
- Zoom in on the same trees in that image to get an idea of what I mean about using purple (or blue.) Actually, you might be better off using a very dark saturated brown or maroon (similar to how the grass is done.)

Offline TheShard1994

  • 0001
  • *
  • Posts: 30
  • Karma: +0/-0
    • View Profile

Re: Tileset House & Thatch roof[C+C]

Reply #16 on: March 22, 2011, 08:09:38 am
I think that'd only work if I used a blackish color to make the transition to the other color :/

Ya, don't even know WHY I thought giving the tiny flowers black pixels was a good idea XD

Offline TheShard1994

  • 0001
  • *
  • Posts: 30
  • Karma: +0/-0
    • View Profile

Re: Tileset House & Thatch roof[C+C]

Reply #17 on: March 22, 2011, 06:57:11 pm
Removing the darkest shade seemed to do pretty well:

Offline TheShard1994

  • 0001
  • *
  • Posts: 30
  • Karma: +0/-0
    • View Profile

Re: Tileset House & Thatch roof[C+C]

Reply #18 on: March 24, 2011, 03:19:43 pm
New foreground


Also, gave the roof a more wavey bottom.


Did not change the black pixels on the small flowers yet

Offline TheChannel

  • 0001
  • *
  • Posts: 53
  • Karma: +0/-0
  • Sky Rockets in Flight, Afternoon Delight.
    • View Profile

Re: Tileset House & Thatch roof[C+C]

Reply #19 on: March 24, 2011, 03:26:57 pm
Where is your light source,  The roof shadow shows a light is from directly above while the mushroom and character show a light directly in front of them

Offline TheShard1994

  • 0001
  • *
  • Posts: 30
  • Karma: +0/-0
    • View Profile

Re: Tileset House & Thatch roof[C+C]

Reply #20 on: March 24, 2011, 03:34:03 pm
ya i think i messed up the shading on the roof a bit
gotta remove the top highlight?

The lightsource is actually somewhere at the right :P

Offline TheShard1994

  • 0001
  • *
  • Posts: 30
  • Karma: +0/-0
    • View Profile

Re: Help with Tileset / Scenery [C+C]

Reply #21 on: March 28, 2011, 04:24:21 pm
Here's the newest pic:

Offline Mush

  • 0010
  • *
  • Posts: 175
  • Karma: +0/-0
    • View Profile
    • MushSauce

Re: Help with Tileset / Scenery [C+C]

Reply #22 on: March 30, 2011, 06:37:32 am
Some notes (my brain can't organize thoughts right now):

-That bg really needs to go (is it a placeholder?)
-Everything is way too bright for a night scene.
-I love the colors/shading/contrast of the mushrooms - you should apply the same techniques to other parts of the scene.
-Internal black lines (on the flowers, rocks, and grass? for example) are flattening your forms.
-Avoid single-pixel highlighting against outlines (creates banding)
-Where's the water coming from  ???

But really, you need to address what Ixis posted; it doesn't seem like you've taken any of his suggestions. I'll repost it for good measure.

Quote

Offline TheShard1994

  • 0001
  • *
  • Posts: 30
  • Karma: +0/-0
    • View Profile

Re: Help with Tileset / Scenery [C+C]

Reply #23 on: April 08, 2011, 10:22:59 am
I did use some of his tips, don't know if the screenshots I've posted already had that.

But for now, I'm stuck on the trees.
The wood isn't the best, but it's acceptable. However the leaves.. well.. they look awful.
« Last Edit: April 08, 2011, 10:24:40 am by TheShard1994 »

Offline Savick

  • 0001
  • *
  • Posts: 39
  • Karma: +0/-0
    • View Profile

Re: Help with Tileset / Scenery [C+C]

Reply #24 on: April 08, 2011, 12:43:04 pm
Try imagining that everything is being lit from the upper right with a spot light and shade from that direction maybe? Right now you have a lot of flatness in the sprites, but that's not always a bad thing? I'm learning, yay.

Offline infinitegames

  • 0010
  • *
  • Posts: 130
  • Karma: +0/-0
    • View Profile

Re: Help with Tileset / Scenery [C+C]

Reply #25 on: April 09, 2011, 06:30:35 pm
For one thing, I'd suggest getting rid of the black outlines. It makes everything look even flatter than your shading does. While that's your artistic choice, I think it'd look better if you used the outlines to help shade the forms instead of simply defining and outlining them.

Offline TheShard1994

  • 0001
  • *
  • Posts: 30
  • Karma: +0/-0
    • View Profile

Re: Help with Tileset / Scenery [C+C]

Reply #26 on: April 09, 2011, 07:38:15 pm
I'll do any changes that'll make anything look better, except removing the black outlines. I already got way too much sprites to change it and I prefer it this way :/

Offline Greger

  • 0001
  • *
  • Posts: 84
  • Karma: +0/-0
    • View Profile

Re: Help with Tileset / Scenery [C+C]

Reply #27 on: April 10, 2011, 01:43:13 am
I'll do any changes that'll make anything look better, except removing the black outlines. I already got way too much sprites to change it and I prefer it this way :/

The time you'll have to invest will reward itself tenfold, the overall quality will become a lot better :)
What bothers me with the character still is the anatomy, he looks really, really stiff and those arms are almost as long as the character itself. Is that something you're going to change?

Offline TheShard1994

  • 0001
  • *
  • Posts: 30
  • Karma: +0/-0
    • View Profile

Re: Help with Tileset / Scenery [C+C]

Reply #28 on: April 16, 2011, 01:15:54 pm


Tried removing the black outlines. I do not want to remove them all together, so I made them a darker color than the base color (that kind of outline, yes)
Does it look better?

Maybe the character itself is not the best example to compare the styles

Offline PypeBros

  • 0100
  • ***
  • Posts: 1220
  • Karma: +2/-0
  • Pixel Padawan
    • PypeBros
    • View Profile
    • Bilou Homebrew's Blog.

Re: Help with Tileset / Scenery [C+C]

Reply #29 on: April 17, 2011, 12:05:53 pm
Tried removing the black outlines. I do not want to remove them all together, so I made them a darker color than the base color (that kind of outline, yes)
Does it look better?
That's an improvement, in my eyes. He looks much more colourful. There is still a lot of banding in his cape and arm, though.
Quote
Maybe the character itself is not the best example to compare the styles
Good readability of the character usually requires higher contrast than your background ... A outlined character on a outline-less background works well (Mario & Luigi series in mind) while an outline-less character on an outlined background would be a mess for the eye.

Offline TheShard1994

  • 0001
  • *
  • Posts: 30
  • Karma: +0/-0
    • View Profile

Re: Help with Tileset / Scenery [C+C]

Reply #30 on: April 18, 2011, 10:42:15 am
I'll try something with the environment ^^

But please, some help with the tree leaves? I'm stuck with the project now :(

Offline PypeBros

  • 0100
  • ***
  • Posts: 1220
  • Karma: +2/-0
  • Pixel Padawan
    • PypeBros
    • View Profile
    • Bilou Homebrew's Blog.

Re: Help with Tileset / Scenery [C+C]

Reply #31 on: April 18, 2011, 12:32:55 pm
But please, some help with the tree leaves? I'm stuck with the project now :(
Well, right now, I could point you at some Minish cap or NSMB trees for some references, not mentionning the comparison of techniques available on these boards. I previously gathered a few of them on my blog. However, if you set the scene during a starfull night, you might as well just drop the colors together and go for a dark silouhetto of the tree. You wouldn't see browns, grey and greens like that at the time suggested by your background.

Offline TheShard1994

  • 0001
  • *
  • Posts: 30
  • Karma: +0/-0
    • View Profile

Re: Help with Tileset / Scenery [C+C]

Reply #32 on: April 19, 2011, 04:57:16 pm
I tried the leaves, but they still didn't work out. Will try again (pc crashed when i wanted to save.. >.<)

However, I got a style comparison on the environment:



I think the one without outlines looks blurry ? :/

Offline PypeBros

  • 0100
  • ***
  • Posts: 1220
  • Karma: +2/-0
  • Pixel Padawan
    • PypeBros
    • View Profile
    • Bilou Homebrew's Blog.

Re: Help with Tileset / Scenery [C+C]

Reply #33 on: April 19, 2011, 07:38:29 pm
I think the one without outlines looks blurry ? :/
Not blurry: faded out. That's because pure black "burns" all the colours it touches. If that was on the layer on which the action happens, you'd now have to compensate with some stronger hue shift, darker shadows (move the shadow of the mushrooms towards the blue/purple, for instance) and some warmer highlight spots. But this isn't the main layer, so I bet you don't want to distract the player.

Offline TheShard1994

  • 0001
  • *
  • Posts: 30
  • Karma: +0/-0
    • View Profile

Re: Help with Tileset / Scenery [C+C]

Reply #34 on: April 19, 2011, 07:51:50 pm
So the main layer can have black outlines (or atleast a darker outline), and the other layers are better when faded out ?

Offline TheShard1994

  • 0001
  • *
  • Posts: 30
  • Karma: +0/-0
    • View Profile

Re: Help with Tileset / Scenery [C+C]

Reply #35 on: April 20, 2011, 05:36:35 pm



Soo... heh... I think I owe you guys an apology for not listening about removing the black outlines  :-X
It does look way better, thank you :)

Offline Sinistral Erim

  • 0001
  • *
  • Posts: 49
  • Karma: +0/-0
    • View Profile

Re: Help with Tileset / Scenery [C+C]

Reply #36 on: April 20, 2011, 10:55:16 pm
Currently, it strikes as as if everything was huge, but somehow all the textures were tiny and did not belong to the object they are applied over; example: the hay roof should have larger patches of visible hay instead of that small stick texture.

Offline PypeBros

  • 0100
  • ***
  • Posts: 1220
  • Karma: +2/-0
  • Pixel Padawan
    • PypeBros
    • View Profile
    • Bilou Homebrew's Blog.

Re: Help with Tileset / Scenery [C+C]

Reply #37 on: April 21, 2011, 06:53:28 pm
I'll try something with the environment ^^

But please, some help with the tree leaves? I'm stuck with the project now :(

Unless your tree is some interactive foreground object, I'd suggest you get a look at http://www.lamemoiredupad.net/wp-content/img/tests/incantation/incantation-man-03-big.png and try to follow that technique. That's not the best, but it should be easier to start with.

Offline TheShard1994

  • 0001
  • *
  • Posts: 30
  • Karma: +0/-0
    • View Profile

Re: Help with Tileset / Scenery [C+C]

Reply #38 on: April 22, 2011, 07:32:19 pm
I love this new style of trees I have now:

Offline Greger

  • 0001
  • *
  • Posts: 84
  • Karma: +0/-0
    • View Profile

Re: Help with Tileset / Scenery [C+C]

Reply #39 on: April 22, 2011, 07:36:42 pm
The leaves looks like they're ASCII and I like it a lot, adds a lot to the surreal feeling :) Still hating the anatomy of your character however, the arms are almost as long as the character himself :v

Offline TheShard1994

  • 0001
  • *
  • Posts: 30
  • Karma: +0/-0
    • View Profile

Re: Help with Tileset / Scenery [C+C]

Reply #40 on: April 22, 2011, 08:12:31 pm
Is it also a problem with this animation?



EDIT:
No idea why it doesn't show the animation. --Fixing--

EDIT2:
*sigh* Imageshack's fault. Here's a link to the animated piece on pixeljoint: http://www.pixeljoint.com/pixelart/60693.htm
« Last Edit: April 22, 2011, 08:19:44 pm by TheShard1994 »

Offline PypeBros

  • 0100
  • ***
  • Posts: 1220
  • Karma: +2/-0
  • Pixel Padawan
    • PypeBros
    • View Profile
    • Bilou Homebrew's Blog.

Re: Help with Tileset / Scenery [C+C]

Reply #41 on: May 03, 2011, 07:49:23 am
There's room for improvement in your leaves, but they already do a good job. I'd just recommend that you ensure they cast shadow on the trunk: that will make them better connected and less flat for a small increment.

As for the walk animation, It's a bit surprising that such a slim-and-high lad
1) keeps his spine so straight and vertical while walking.
2) is doing such small steps
3) has such small legs. -- yeah, by animating, you now show us where knees and bums are, and they are both off-proportionated compared to the torso and head size, imho.