AuthorTopic: Here goes some library tiles  (Read 1558 times)

Offline Vinik

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

Here goes some library tiles

on: January 10, 2020, 02:32:34 am
When I work with a palette with considerable contrast between value levels (such as gameboy or gbc-like palettes), I often find it hard to texture floors without having the texture look too pronounced. If anyone has some experience with this, how do you handle it?
Comments and Critique appreciated :)

In this case I am using a palette with 4 gb-like values (but various hues) ending in a dark purple + black for extra contrast on outlines and detail on collision objects and walls, but any texture on floors feel to much, even with just the second value next to the one of the flat color. Should I leave it flat?
« Last Edit: January 10, 2020, 03:24:44 pm by Vinik »

Online eishiya

  • 0100
  • ***
  • Posts: 1236
  • Karma: +2/-0
    • http://pixeljoint.com/p/28889.htm
    • View Profile
    • Webcomic: Black Dram

Re: Here goes some library tiles

Reply #1 on: January 10, 2020, 02:53:35 pm
It looks fine, but whether it reads well really depends on your sprites, which you haven't included here.

If it is a problem once the sprites are there, then options include
- Breaking your general rule of hue-shifting for shadows and using *any* available slightly darker colour, such as one of the browns.
- Dithering (only a good idea if this is for a static scene or if it'll always be at 1x and never zoomed in)
- Implied shadows, e.g. showing edges between floor tiles only in the shadow, or having highlights on floor tiles only in the light.

Offline Vinik

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

Re: Here goes some library tiles

Reply #2 on: January 10, 2020, 04:14:00 pm
Oh, thanks eishiya! I am not a fan of dithering, but suggestions 1 and 3 sound like a plan.

By the "not doing hue shifting" I take that if there is only value contrast (instead of value AND hue contrast) any texturing should stand out a little less, that makes sense. As for the selective detail depending on shadows, that's a great idea. For other sets I was simply going up or down a step in the values depending on shadows, as here for example:


But having less information in larger unshaded areas sounds like a solution. In examples above, you can see the repetition make the textures tiresome. The second take works better I think, because the pattern is larger and not aligned with the props, but I cant make a game with a single floor pattern and that's the only one I am satisfied with so far lol

Online eishiya

  • 0100
  • ***
  • Posts: 1236
  • Karma: +2/-0
    • http://pixeljoint.com/p/28889.htm
    • View Profile
    • Webcomic: Black Dram

Re: Here goes some library tiles

Reply #3 on: January 11, 2020, 12:07:05 am
FWIW in your OP, the shadow contrast doesn't seem high enough to be a worry unless your sprites have poor contrast. Even 1bit B&W art, as high-contrast as it gets, can get away with having shadows on the floor, if the sprites are designed well.

And aye, I think avoiding texturing the whole floor is a good idea in general. Some games have their cake and eat it too by having small patches of detail in otherwise solid floors.

Offline Chonky Pixel

  • 0010
  • *
  • Posts: 227
  • Karma: +1/-0
    • tequila_ben
    • http://pixeljoint.com/p/187855.htm
    • https://www.facebook.com/chonkypixel/?modal=admin_todo_tour
    • View Profile
    • Chonky Pixel

Re: Here goes some library tiles

Reply #4 on: January 14, 2020, 11:29:03 am
Yes, there have been some great examples of creating texture without texture in these boards. Here's a small, simple one.

https://pixelation.org/index.php?topic=34799.0

Look at the edit on the door.

Probably all you'd need is a suggestion of detail around the edges of the area, then some patches of detail here and there to sell it. So maybe 2-3 tiles with slightly different bits of detail to be sparingly distributed.

You're right, having detail over the full extent of things like floors isn't great. It can feel really claustrophobic and oppressive.

Offline Chonky Pixel

  • 0010
  • *
  • Posts: 227
  • Karma: +1/-0
    • tequila_ben
    • http://pixeljoint.com/p/187855.htm
    • https://www.facebook.com/chonkypixel/?modal=admin_todo_tour
    • View Profile
    • Chonky Pixel

Re: Here goes some library tiles

Reply #5 on: January 14, 2020, 01:18:12 pm


5 minute edit to give you an idea of what I mean.

Offline Chonky Pixel

  • 0010
  • *
  • Posts: 227
  • Karma: +1/-0
    • tequila_ben
    • http://pixeljoint.com/p/187855.htm
    • https://www.facebook.com/chonkypixel/?modal=admin_todo_tour
    • View Profile
    • Chonky Pixel

Re: Here goes some library tiles

Reply #6 on: January 14, 2020, 01:31:26 pm
Odd things I noticed:

 - The books and stools are shadowless, or the shadows are different in behaviour to the bookcases. The books look like they're floating and the stools look like they're in a different space.
 - The stool near the top seems to have a double shadow. Is that necessary?
 - The way the bookshelf shadows go straight downwards makes me sometimes read them as grey pedestals that the bookcases are sitting on. (Especially at the extremes of left and right.) I have no idea how to fix that! Or even if it's a problem for anyone other than me. I guess you could angle the shadows to the left or right, or try softening their edges.

Online eishiya

  • 0100
  • ***
  • Posts: 1236
  • Karma: +2/-0
    • http://pixeljoint.com/p/28889.htm
    • View Profile
    • Webcomic: Black Dram

Re: Here goes some library tiles

Reply #7 on: January 14, 2020, 02:57:07 pm
Seconding Chonky Pixel's feedback about the shadows. Overall the shadows being on all three visible sides of the room and going straight down make them feel almost like reflections rather than shadows. If the light is coming from the north side, the side walls wouldn't cast shadows. I think angling the shadows would be the best solution. It would also make things look more dynamic since you'd have fewer vertical lines and tangents everywhere.

Offline Vinik

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

Re: Here goes some library tiles

Reply #8 on: January 17, 2020, 02:48:28 pm
@Chonky and @eishiya: thank you for pointing towards how wrong the shadows are, and sorry to the late reply, I was out of town these days! I was never trying to be too accurate with the shadow direction, but you are right. The idea was that I had a hard light casting shadows coming from the north and a softer/reflected front light illuminating the faces of objects, with equal falloff on either slanted faces of diagonal walls. However I'll need to check reference, I was under the impression that a north light would make the slanted walls cast shadows in this situation. Thanks again for pointing that!

Edit: uh, looking again, if I were to consider a single light source for this, it would be coming from the south and more from above, to give those highlights, so the shadows would actually be behind the objects and not visible at all  :blind:

@Chonky Pixel, yes that kind of subtle texture around the shades areas and randomly splashed as texture on the main surface is indeed what I plan after eishiya suggestion. However, I find it rather difficult to choose where to texture and where to leave it blank to achieve an organic look. To me it seems to be like a particular kind of skill that lack, and I mentioned in a previous thread that it feels like "Zen gardening" to me, and I am awfully bad with it :/

Sorry for not posting updates right now, I have something soon, and thank you very much for all the attention and critique :)

Edit: tried my best to use all input mentioned here. I tested generating shadows with a north facing light and the slanted ones did cast shadows, but I think my shadows were too long. I also switched the grey for another one in the palette which is a bit more greenish to simulate getting some diffuse light from the walls. I hope the books shelves look more caved in and the books more 3d. I tried some natural/random detail placement, too much?


« Last Edit: January 18, 2020, 04:05:49 am by Vinik »

Offline Vinik

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

Re: Here goes some library tiles

Reply #9 on: January 18, 2020, 04:15:42 pm
Dithered shadows, yes or no?

Offline Chonky Pixel

  • 0010
  • *
  • Posts: 227
  • Karma: +1/-0
    • tequila_ben
    • http://pixeljoint.com/p/187855.htm
    • https://www.facebook.com/chonkypixel/?modal=admin_todo_tour
    • View Profile
    • Chonky Pixel

Re: Here goes some library tiles

Reply #10 on: January 18, 2020, 05:00:46 pm
I love the floor detail, much more sensitive to your style than my edit! :D

I am usually a fan of dithering, but I don't think it fits here. Partly because your style is very clean and smooth. Partly because of the way it interacts with floor details.

Online eishiya

  • 0100
  • ***
  • Posts: 1236
  • Karma: +2/-0
    • http://pixeljoint.com/p/28889.htm
    • View Profile
    • Webcomic: Black Dram

Re: Here goes some library tiles

Reply #11 on: January 18, 2020, 07:17:51 pm
Seconding Chonky. Texture looks nice, dithering doesn't.

Most games with texture patches have whole texture tiles and separate texture-edge tiles for extra flexibility, but you seem to be trying to do it with only one set of tiles. If you go that route, consider having your detail floor tiles not have all the dark lines go all the way to the edge of the tile. It'll make the details more organic-looking by having them not line up as much, and by introducing gaps in the texture.

Offline Chonky Pixel

  • 0010
  • *
  • Posts: 227
  • Karma: +1/-0
    • tequila_ben
    • http://pixeljoint.com/p/187855.htm
    • https://www.facebook.com/chonkypixel/?modal=admin_todo_tour
    • View Profile
    • Chonky Pixel

Re: Here goes some library tiles

Reply #12 on: January 18, 2020, 08:22:05 pm
I thought I'd try some more very quick edits. The top-right bookcases have angled shadows.

I wanted to see if they read more like shadows to my eyes and they seem to. They can also be used to make the top bookcase look more like it's touching the wall. It seemed to me not to touch the wall before the edit.

You'd probably want to do some thinking about light sourcing and how the shadows would work if you wanted to go this route, it was just a proof of concept. It is opening up a bit of a can of worms though.



(There's a lot wrong with this edit, like the shadows on the right-hand wall, the shadow on the back wall being too narrow, some of the floor detail, etc. It's not meant to be a final product, more a test.)
« Last Edit: January 18, 2020, 10:12:40 pm by Chonky Pixel »

Offline Vinik

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

Re: Here goes some library tiles

Reply #13 on: January 19, 2020, 06:08:54 pm
Thanks for the edit chonky, I am seriously reconsidering straight down shadows. The reason I committed to front light from the beginning was pretty much to save time, since I'll be making a lot of assets in the same style, and front light allows for mirroring tiles. I have been given this same warning before, and perhaps I have underestimated how much angled lights impact in selling tridimensional volume. I'll have to munch on this for a while, it would change a lot of things.

Online eishiya

  • 0100
  • ***
  • Posts: 1236
  • Karma: +2/-0
    • http://pixeljoint.com/p/28889.htm
    • View Profile
    • Webcomic: Black Dram

Re: Here goes some library tiles

Reply #14 on: January 19, 2020, 07:50:40 pm
Depending on how this is implemented, you may be able to save time and space by having the shadows be their own solid-coloured tile layer that sits between the floor and the objects. If you choose its colour and opacity wisely, it could look as nice as bespoke shadow tiles, but with the ability to use the shadow tiles on any surface. Since it doesn't look like the floor texture affects the shadows anyway, there doesn't seem to be much need to have dedicated shadow/shadow-transition tiles for every floor type, and you can probably get away with some simple blocky shadows for most objects.

Offline Xenon02

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

Re: Here goes some library tiles

Reply #15 on: January 19, 2020, 09:57:35 pm
I think no, dithering doesn't look good, for me I guess.

Offline Vinik

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

Re: Here goes some library tiles

Reply #16 on: January 22, 2020, 03:01:49 pm
Depending on how this is implemented, you may be able to save time and space by having the shadows be their own solid-coloured tile layer that sits between the floor and the objects. If you choose its colour and opacity wisely, it could look as nice as bespoke shadow tiles, but with the ability to use the shadow tiles on any surface. Since it doesn't look like the floor texture affects the shadows anyway, there doesn't seem to be much need to have dedicated shadow/shadow-transition tiles for every floor type, and you can probably get away with some simple blocky shadows for most objects.
Now that's a good idea. In fact, since I have some sort of palette LUT to enforce showing colors from the palette for some effects, I really could try to make all shadows be on layer with alpha. If I have some fixed levels of black+ alpha matching the average value distance between the color steps, it "should" render with a fitting shadow color from the palette. Probably without much hueshifting, unless I can hack it by putting some red or blue in the black to make the LUT choose a shadow from a more distant hue lol. Great idea :y:

Online eishiya

  • 0100
  • ***
  • Posts: 1236
  • Karma: +2/-0
    • http://pixeljoint.com/p/28889.htm
    • View Profile
    • Webcomic: Black Dram

Re: Here goes some library tiles

Reply #17 on: January 22, 2020, 07:18:23 pm
With an enforced palette, getting hue-shifting isn't hard, it's easier to get good results that way than with just raw assets :D! If your source art has the same palette as the output palette, it's very easy for the code to know when it's dealing with blended colours and react appropriately. Two ways to go about it:
A. The option you mentioned: Colour the shadow layer so it isn't black (this could be done in-engine or as part of the source art, depending on how much flexibility you need) and let a basic colour-matcher do the rest.
B. Use a hand-crafted LUT that knows to hue-shift darker versions of certain colours towards certain other colours. This could even be combined with (A) to have different kinds of hue-shifting (this is what I do in my projects).
« Last Edit: January 22, 2020, 07:44:45 pm by eishiya »

Offline Guy Akiba

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

Re: Here goes some library tiles

Reply #18 on: February 20, 2020, 09:00:01 am
Dithered shadows, yes or no?

Both look good, but personally, I prefer the solid shadows.  Also depends on what you're going for and what your sprites look like, but yeah.  I deff like the solid ones