Beach, rocks, and caves - some backgrounds from my game (updated)

Started by Batsy, Fri 09/02/2007 03:11:58

Previous topic - Next topic

Batsy

Hi all - I discovered AGS a few years ago, and was very excited because I grew up on LucasArts adventure games, and thought it was a great way to keep the genre alive. I've been playing fan-games for awhile, and now I think I'm ready to start putting my own game together.

I'm reasonably confident in my pixel-art skills regarding objects and people, but backgrounds have never been my strong suit. These are the first backgrounds for my game; I was wondering if I could get some feedback?

The dimensions are odd because a few of the rooms scroll, and I cropped out the black parts at the bottom of the screen I reserved for my GUI. Also linked to the big versions, because some of them might stretch out the forums otherwise.


200% magnification: Here


200% magnification: Here


200% magnification:
Here


200% magnification:
Here

I think the last one is probably the one I'm least satisfied with.

Thanks in advance!  :)
batbrigade -at- gmail

EllePollack

#1
You've got a bit of an interesting style going that I kinda like.Ã,  Good work so far.

I think, especialy in the last two, with the cave walls, you need more contrast of light and dark hues, especialy in the all-grey rockface.Ã,  Go darker than you think you need to.Ã,  Light you have to be more carefull with, but the strength of the hilights should depend on the strength of the light in the room and the reflectiveness of the surface.Ã,  (When I'm doing high-res stuff in Photoshop I tend to use a lot of gausian blur on lit areas, then play with the opacity until it looks right).

In the same vein as that...none of your stuff is casting any shadows!Ã,  Figure out where the light in each scene is comming from and try to get some in there.

In the second picture and maybe a bit in the first; objects in the distance tend to appear to have less saturated color, the further away they are from you.Ã,  This is only realy noticible over large distances like in landscapes but it's something to consider and experiment with.

All this is easier to show than describe but I don't have time to do a demo right now...maybe later, or maybe someone else will.

ETA the next morning: One quick smudge-over later...

Annotations:
1- Cast shadows!  This presumes the sun being on the left and the time somewhere around midday.  If it's early morning or late afternoon, they will be much longer.
2- This rock is colored lighter to make it look closer...(idealy it would be higher contrast in the detail too)
3- While this is dark and shadowy to make it look further away.
4- Compare the sharp contrast of this shadow to the smoother-looking boulder on the left.  Placing a bright light hue right next to a dark one gives the appearance of a sharp crease (that's also how you do stuff like wrinkles in fabric).

As an asside (and a mental exercise), pretend for a minute that it's night and there was a big campfire in the middle of this room.  What would happen to all these shadows?
First and most obvous, the color would change, since campfires emit an orange-yellow glow.
The cast shadows would radiate (if that's the word) in a circle pointing away from the fire.
The rock in front (number 2) would be backlit; the side facing us would be dark with light comming around the edges.
All the shadows will be even higher contrast, cause the light is close and bright and at night the shadows will be even darker.

Hope that helps!

Ubel

I REALLY like them! :D

The grass in the first picture looks a bit distracting. It's way too detailed. It should look more plain and simple so that it won't catch the players' eyes too much and distract them.

Other than that, looks really good. :)

Snarky

First of all, they look really good. I think you can improve them even further by making a few changes.

In the first picture, you see the path, then a line of trees, then nothing. This gives it a very fake look. The world should continue to the edge of your image (and beyond). Also, all the trees are behind the grass, instead of growing out of it. You would get more depth by placing them at different distances on the surface of the grass, like you've done with the rocks.

Also with the trees in the first image, look at the left and the right edge. It looks like there are no trees there just because that's where your screen ends. Try to imagine what's outside of the edges of your background, and make sure that you're not omitting things just because they would be cut off. One way to do this easily is to extend your image a bit on each side and draw there, then crop it back to the original size.

Still in your first screen, the grass looks like a repeating pattern, and this effect is very distracting. Make it more irregular. You should also tone down the contrast between the light and the dark green a bit. If you're able, try to consider the perspective: the detail on the grass would be different close up and far away, would it not?

On the second screen, the clouds are really nice. I love them. Again, the world seems to end just behind the green hills. Another line of hills in the distance, bluer and less saturated because they're far away, would make the landscape look more convincing. I'm not sure about the fuzz on top of the hills. Is it supposed to be trees? Grass? In any case, I'm pretty sure it shouldn't be as thick on the hills behind the path as on the hills in front of it. That's perspective, again. Oh, and the mountain on the left is just a straight line, while it really should have some jaggedness and detail to it.

I don't really have any major comments on your last two. The lines you draw on the rock aren't terribly effective, especially in the last image. You could take a look at this thread for some ideas of how to do rock. And I agree with EllePollack that you should use more contrast.

Batsy

#4
Thanks for the feedback, everyone--that should help a whole lot. I'll do some work on the backgrounds and then repost the new versions.  :)

EDIT - Here are the revisions:


- Darkened and desaturated, due to it being nighttime and the hills above blocking full moonlight
- Repainted trees and treeline so they extend off the screen and don't look so silly.
- Made grass less random and less detailed
- Added shadows


- Redrew treetops so that they actually look like trees (I hope).
- Added more hills into the background
- Added shadows, darkened and highlighted things. (Nighttime with full moon)


- Added lots of contrast to this picture in particular, given the moonlight
- Added shadows
- Lessened random lines on rocks
- Brightened ivy to stand out against darkness (player needs to interact with it, so it needs to stand out some)


- Darkened and smoothed out rock
- Added lanterns as a light source
- Gave pub a name
- Rock floor still needs some work, probably.

Thanks again for the critique, it really helped!
batbrigade -at- gmail

EllePollack

Yay, major improvement all around!

Few nitpicks:

- The trees in the first picture now suffer a bit from a similar problem to what your grass did before; it's all one patern and looks like a big flat clump sitting on top of all those trunks.Ã,  What you might try to make things easier is bring a few trees closer to the front, paint those in higher detail, maybe some branches showing to break it up.Ã,  Then you can make the trees further back less detailed, but use a coupple color variations to break them up a bit more.Ã,  Perhaps a coupple other trunks in the far distance too; it still looks a little flat.

- Something is bugging me about the perspective of the path in the second picture; it looks like it's tilted too far torward the viewer (but I know you can't have it completely straight-on and still have a place for the sprite to walk).Ã,  If you can bring the front up a bit and smoosh the back edge so the hump is smaller than the front...
- I'd also drop a lot of the texture on that big mountiany thing, or rework it like you did for the cave floor.

- the cave doorways should probably be darkened more

The tavern could use some more shading and shadowing, especialy on the roof which looks like it has no edge.Ã,  If you make it more 3-d looking, like this:

That will make it easier to figure out where the light needs to go.

zewb

Good improvements there; it looks more professional and less MSPainty.

SMF spam blocked by CleanTalk