[WIP]Office Art

[BadMoodTaylor]

Game art in an office setting.  Threw together in an image to see how it looks together.  Didn't spend much time on shadows as object's shadows may vary by location.

Appreciate any feedback but looking to see how the walls, tiles, and kitchen objects look.



Thanks

[eishiya]

The characters on the yellow tiles are difficult to make out. Avoid having so much contrast in overlappable backgrounds.

The colours also feel kind of dull and lifeless overall. That might fit the theme (offices rarely have any life in them), but it's also unpleasant to look at for prolonged amounts of time. Try using slightly more saturated colours, and try to hue-shift towards a specific hue to unify them a little bit, especially the colours that are meant to be darker versions of other colours.

[BadMoodTaylor]

The characters on the yellow tiles are difficult to make out. Avoid having so much contrast in overlappable backgrounds.

By contrast are you referring to the two different colors of tile? or the shading/lighting of those tiles?

I actually started making that tile intending to the classic black and white tile for kitchens but didn't think I could make that work.

The colours also feel kind of dull and lifeless overall. That might fit the theme (offices rarely have any life in them), but it's also unpleasant to look at for prolonged amounts of time. Try using slightly more saturated colours, and try to hue-shift towards a specific hue to unify them a little bit, especially the colours that are meant to be darker versions of other colours.

Which pieces specifically or if all which would you change first?  Floors and walls?

Hue shift towards specific hue:
A specific hue for each color? each piece? or one specific hue for everything?
Then how is that done mathematically? Do you just move a certain number towards that hue's number?  Or if across the color wheel do you jump a larger number?


Thanks

[BadMoodTaylor]

Try using slightly more saturated colours...

This was a very quick edit:



Is that the direction you were recommending?

[eishiya]

I was referring to the tile colours, sorry for not being clearer. The shading contrast is fine, the specific colours are just boring because you don't seem to be hue-shifting the shadows. That said, tiles are flat, they probably shouldn't have shading on the edge of each tile.

I meant hue-shift everything towards a certain hue, to various degrees. It's common in pixel art to shift all the shadows and highlights more than the midtones, so that things can retain their colour identity, but the image feels more unified overall. This is part of why you often see palettes that have many different midtones but only a few bright and dark colours.

I think those saturated colours look nicer, but they're too contrasty. This isn't something you can fix with automated adjustments, you'll need to go in and tweak colours separately.
Even "B&W" tiles can work if you're careful with your colour choices. It's common for such tiles to be depicted so that the black is actually a light blue or grey. A good example of this is the opening scene of Who Framed Roger Rabbit, where the B&W kitchen tiles go from being B&W to being two very similar colours depending on the need of each particular shot. Of course, to make that work, other very dark colours in the background have to be light. Fortunately, this is actually beneficial since it makes the entire background low-contrast.

[BadMoodTaylor]

Thank you for the tips and I think I understand now which areas you were specifically referencing.

Just to be clear though, this comment is referencing only the tiles on the right in the kitchen?

I think those saturated colours look nicer, but they're too contrasty...

That quick edit I did isn't intended to be permanent but I do like how it looks except for the kitchen tiles which seem to be more distracting now.  But the walls and tiles on the left, and maybe some of the kitchen objects, I like with the adjustment.

Here are my two floor tiles: (original, not the adjusted)

[BadMoodTaylor]

Does the new tile on the right make it worse on the eyes?

[MysteryMeat]

A bit in terms of eyeglare, but not to a point where it's a problem I think. Visually it's an improvement I'd say, looks like classic ceramic kitchen tile now.

[BadMoodTaylor]

A bit in terms of eyeglare, but not to a point where it's a problem I think. Visually it's an improvement I'd say, looks like classic ceramic kitchen tile now.

Thanks!

Tried to reduce the eyeglare a bit and changed the counter's colors:



...not sure what color to make the wall—tried different shades of green, brown, beige, yellow...

[MysteryMeat]

You uj, actually made the eyeglare worse.go back to that previous green, it contrasted better so things weren't as hard to pick out at a glance.

[jun]

[MysteryMeat]

Yeah, the darker pallete is definitely an improvement.

[BadMoodTaylor]

You uj, actually made the eyeglare worse.go back to that previous green, it contrasted better so things weren't as hard to pick out at a glance.

I tried so many colors I didn't realize I didn't change it back to original:


I really don't know how to choose colors when there are so many already in the image    Tried different hues:



Also, what do you think about removing outlines on cabinets?  This is for a game so I would think not to outline objects that aren't important or aren't intractable?  Does it look okay with people outlined but not the counters?  (did quickly to test—I know I need to fill in the gaps)

[MysteryMeat]

Hm, hard to say. The counters are kind of blending in with the wall now visually, which is hard on the eyes. Try it with the colors from the bottom right example, its the best of the bunch I think.

[BadMoodTaylor]

Hm, hard to say. The counters are kind of blending in with the wall now visually, which is hard on the eyes. Try it with the colors from the bottom right example, its the best of the bunch I think.

The counters are blending with the wall on the green one or when the outline removed?

That's what started the color change attempts on the wall—I edited the counters to compliment the tile then it was too close to the wall.

By bottom right do you mean the last one?

[eishiya]

I think having the outlines on the counters and cabinets works nicely with the style of the sprites. However, you don't need outlines on the floor tiles, in my opinion. I often use "are objects overlapping?" to determine whether to have lineart somewhere or not. When there is no overlap, outlines are often unneeded and needlessly distracting. Of course, style is even more important, but I think this method might work for you in this case.

[BadMoodTaylor]

I think having the outlines on the counters and cabinets works nicely with the style of the sprites. However, you don't need outlines on the floor tiles, in my opinion. I often use "are objects overlapping?" to determine whether to have lineart somewhere or not. When there is no overlap, outlines are often unneeded and needlessly distracting. Of course, style is even more important, but I think this method might work for you in this case.

I was almost going to say: Outlines on the floor tiles? That's just the style (grout/space in between)

Then I realized a lot of kitchen tiles don't have that much space in between. Maybe these look more like outdoor tiles or entry way (of a home) than kitchen tiles. I like how they look but I'll try it without when I get a chance...

[BadMoodTaylor]

Well, I did find images like this when I googled kitchen floor tile:




What do you guys think about the line in-between the tiles?

[BadMoodTaylor]

You can see the scale I'm planning on using here:

http://bit.ly/janitor9316

I feel like that makes a little difference.

[eishiya]

There are tiles with and without spaces, some have spaces that are lighter in colour. So, whether you have visible spaces or not depends on the look you want. My main reason for recommending not having them is because they create unnecessary visual noise. If you keep the tiles flat (no shading) and don't have outlines, the characters and other foreground objects will stand out much better against them.

[BadMoodTaylor]

There are tiles with and without spaces, some have spaces that are lighter in colour. So, whether you have visible spaces or not depends on the look you want. My main reason for recommending not having them is because they create unnecessary visual noise. If you keep the tiles flat (no shading) and don't have outlines, the characters and other foreground objects will stand out much better against them.

That makes complete sense...maybe I have a unknown, secret love for floor tiles because I like them detailed.  I didn't remove the shading but altered the outline/grout (original, light grout, removed):





The light one I definitely chose too bright of a color to replace the grout with but probably won't choose that anyway.  I do kind of like the outlines removed—looks a little smoother.  But can't decide right now so will stare at these images for hours and come to a decision in a couple of months...

[Zia]

I feel like you picked each colour in a vacuum instead of relating it to other colours in the image. If you want a new color, instead of thinking "Oh, I need a green. Let's pick this green, sure why not?" take an existing colour you already have and hue/saturation shift it to become a green that matches it to an extent.

I did some colour swapping to make the image more harmonious. I've always liked this palette tutorial, which illustrates the concept of going from one colour to another.

I snagged the original image from the link to the html site, so apologies for the large scale. It didn't seem to play nice when I was resizing it in photochop.

[BadMoodTaylor]

I feel like you picked each colour in a vacuum instead of relating it to other colours in the image. If you want a new color, instead of thinking "Oh, I need a green. Let's pick this green, sure why not?" take an existing colour you already have and hue/saturation shift it to become a green that matches it to an extent.

I did some colour swapping to make the image more harmonious. I've always liked this palette tutorial, which illustrates the concept of going from one colour to another.

That is exactly what happened as this is all new to me.  Thanks for the tutorial link.  I've been looking to learn about color choice lately so if anyone else can link additional resources it would be much appreciated.

[BadMoodTaylor]

I feel like you picked each colour in a vacuum instead of relating it to other colours in the image. If you want a new color, instead of thinking "Oh, I need a green. Let's pick this green, sure why not?" take an existing colour you already have and hue/saturation shift it to become a green that matches it to an extent.

I did some colour swapping to make the image more harmonious. I've always liked this palette tutorial, which illustrates the concept of going from one colour to another.

So this is what I came up with for my first attempt to follow that tutorial:



Any critiques?  Not sure if I'm doing it correctly

[BadMoodTaylor]

Okay, so I tried to make a color palette and apply it to this image (or parts of it).  I don't think I like it better but after experimentation I understand how it can flow better (not necessarily captured here, but in the process):



My next goal is to learn how to build a palette large enough but the colors still flow.  I know on the point is to not use too many colors, but I would still need a decent amount for a full game, correct?  32 colors a good target?  Anyone know how many Earthbound (SNES) used?  Can I just steal theirs? lol