Lighting a room

[Demicrusaius]

I'd like some opinion's on a room and some advice on how to light it.



This is my room. Right now, I use GIMP for pretty much everything, but the lighting effects look very fake and cheesy.



This is the best I've managed to do and I'm not happy with it. What are some of the methods you guys have used to add lighting effects to your rooms?

[Snarky]

Just drawing transparent white on top of the picture is pretty much guaranteed to suck. You end up with smoke, not light. There are two basic approaches to lighting in adventure game backgrounds: flat/simplified, and "realistic"/light source-based. Lots of games use flat lighting, where most things are assumed to be equally lit (apart from distinguishing horizontal and vertical surfaces, usually), and flat surfaces have a uniform color. Your background is currently closer to that style, and that's fine. So you might not really need to do anything.

The more accomplished artists on the forum have posted a lot of examples, paintovers and tutorials about how to do more realistic lighting and shadows. I would particularly recommend posts by loominous and theo, who both focus particularly on these aspects. (Unfortunately, theo's image links are mostly broken. He writes a little bit about it here.)

Also, check out these threads for some examples:
http://www.adventuregamestudio.co.uk/forums/index.php?topic=42783.0
http://www.adventuregamestudio.co.uk/forums/index.php?topic=40038.0

I'd first of all suggest that you decide on a main light source. Lighting objects from a particular direction tends to give them volume and "realness." With lots of light coming from different directions, things look flatter and less interesting, and it's hard to work out just how bright different parts should be. Use your main light source to emphasize the important parts of the background.

The other piece of advice I'd give you is to focus on the big picture first, which overall areas should be light and dark, rather than small details and highlights. If the general lighting isn't right, you can't fix it by small edits here and there.

In your picture, the big question is whether the room is only lit by those candles, or if there's light coming from somewhere else as well. If it's just the candles, the overall lighting of the 3D render is totally wrong, and you need to redo it/paint over it. If there's some other light source, what is it? Where is it coming from? What color of light is it?

[Anian]

Maybe try Kerkythea, it's a free renderer that can be integrated in SketchUp. It'll calculate the shadows for you after you set up the lights where you want. Then you can use that render or just use it as a guide to draw over the image yourself.

If not that then go the other way around - instead of lighting up the area around the light source, use a multiply/darkened layer with a mask and draw those shadows where you think they should be. Instead of lit areas, draw the shadowed areas.

[Demicrusaius]

I agree that the white looks like smoke, the built in light effects for Gimp are terrible.
I'm trying to make a horror game, so lighting and atmosphere are really important.
The only light source in the room is the candles (It's night, so no window light) but they are candle light bulbs (so they don't flicker).
What do you mean by "Select a main light source"? Are you saying that one lantern will be brighter than the rest?
I haven't actually used any layers to light the image. I tried a few different things, but I'm definitely a graphics noob. I can't seem to find any relevant tutorials online either.
I'll check out Kerkythea tonight. I'm surprised at how hard this is.

[KBlaney]

(Disclaimer: I generally use Photoshop not Gimp, but I believe they have a lot of similar features in this regard. However, my terminology might be off.)

You might consider making two mask layers, one for the areas that need to be lit and another for the shadows, and then applying brightness/contrast changes to get the effect you want.

Alternatively, you could take the areas you want in shadow, double them up on a new layer and then blend using color burn. Similarly, for the areas you want lighter, double them up and then blend using color dodge. Then, change to opacity on the burn/dodge layers to get the effect you want. To ramp up the obscuring effect that bright light or deep shadows have, you can also apply a blur filter to the burn/dodge layers.

If you want to find some tutorials about this, look for tutorials about balancing the exposure levels in a photo or removing shadows from a photo. Basically, you are looking to do the exact opposite but many of the same techniques would work (it will just require a lot of tinkering with sliders).

[Snarky]

I agree that the white looks like smoke, the built in light effects for Gimp are terrible.
I'm trying to make a horror game, so lighting and atmosphere are really important.

Built-in light effects are terrible in all 2D paint programs. The program needs to know about the 3D shapes of objects if it's going to light them properly. If you're trying to do lighting that looks like it belongs as part of a 3D-rendered background, you're best off doing the lighting in the 3D program itself. For example Kerkythea, like Anian recommended. You can make additional edits/tweaks in Gimp afterwards, but if you're going to completely draw the shadows in 2D, you'll probably end up having to paint over the entire background.

The only light source in the room is the candles (It's night, so no window light) but they are candle light bulbs (so they don't flicker).
What do you mean by "Select a main light source"? Are you saying that one lantern will be brighter than the rest?

I mean that you should start by thinking about how you want the light in the room to look, and only then place/create lights that will give you the right effect (instead of the other way around, placing lamps and other lightsources around "at random" without thinking about what effect they'll have). As you say, in a horror game, the atmosphere is really important: don't make it an afterthought. If having the lamps where they are isn't going to give the best lighting for the scene, just move them.

I haven't actually used any layers to light the image. I tried a few different things, but I'm definitely a graphics noob. I can't seem to find any relevant tutorials online either.
I'll check out Kerkythea tonight. I'm surprised at how hard this is.

These articles talk about using light as a way to direct attention in adventure game backgrounds:
http://www.hardydev.com/2010/09/11/the-journey-down-background-art/
http://www.hardydev.com/2009/11/18/visually-directing-the-player/

Loominous has posted a lot about how to light backgrounds; these might be some examples to start from.

http://www.adventuregamestudio.co.uk/forums/index.php?topic=34542.0
http://www.adventuregamestudio.co.uk/forums/index.php?topic=22270.msg272417#msg272417
http://www.adventuregamestudio.co.uk/forums/index.php?topic=18483.msg225000#msg225000
http://www.adventuregamestudio.co.uk/forums/index.php?topic=28116.msg358089#msg358089

Here's a very rough paintover. It didn't come out very well, but it might give you some ideas:

[Demicrusaius]

That picture you did is amazing! Crazy inspiring. I'd like to figure out how to do something like that, rather than relying on Kerkythea, but we'll see how well I can get it to work. I'll definitely check out those tutorials too (when I'm not stuck at college *grumble*). Just out of curiosity, how long did that mock up take you? I think applying some of those techniques manually might be the way to go. Would it be possible to do a little video tutorial showing some of the methods that you used? I absolutely love what you did to it. I understand the core concept of how it should look now, but I'm still not sure of the techniques I need to use.

[Armageddon]

It's just bright yellow brush strokes smudged and set to multiply or overlay and dark shadow strokes set to normal and probably erased a little bit of some.

Just start drawing, there is no proper technique to use.

[Eric]

Snarky, do you have all of these former threads and blog posts saved for yourself somewhere, or are you finding them on an as-needed-in-this-thread basis? Because it strikes me that it would make a nice sticky to have all of these sorts of threads linked from one post.

[Demicrusaius]

Just start drawing, there is no proper technique to use.

Ok, I tried to add some light and shadows myself and... My god. The horror.
I don't understand how to use dodge and burn over a transparent layer, but I was able to use a transparent yellow for the light source. I'm particularly perplexed by the bright spot Snarky added to the floor. Mine looks embarassing and I don't even want to post it here.

Now, this was about ten minutes of work and about thirty minutes of trying random stuff and undoing it. I know it's terrible, but I'm not sure how to get these tools to work right. How many different layers should I be using? The tools don't stack on each other very well. I feel like each time I release the mouse button I need a new layer. Should I be using only yellow and white paintbrush tools with transparencies?

I'm not sure which is worse! The second one is using transparent brushes of white and yellow using various opacities and the smudge tool. I know this isn't a GIMP help thread, but all the tutorials posted are design suggestions and not technique suggestions. Maybe someone could point me in the right direction?

[Armageddon]

You have zero sense of perspective, try learning some things like perspective and color theory and just photoshop in general.

[Eric]

Also, it might help to set the transparency on your layers, not on the brush settings. That's why you

feel like each time I release the mouse button I need a new layer

.

[Demicrusaius]

Now that is a helpful tip. Thank you.

[KBlaney]

https://www.youtube.com/watch?v=bDSk7O5GOqY

This is geared more towards kids, but it is a good introduction to lots of basic art techniques like foreshortening (which is the technique Snarky used to make it look like the circle was sitting flat on the floor). Part way through the video you will also see that he chooses a dominant light source which then informs where his shadows go. If we was using highlights, the location of that dominant light would also inform where the highlights would go.

[Lasca]

It feels a bit like your trying to put the light ON the image instead of IN the image. Remember that light is reflection, and is rarely visible in the air, so to speak.
My best tip would be to turn of the lights in your room and light a candle. Then just have a look around on what happens to the coulours of the room.
It feels like your looking for an easy solution for putting lights and shadows in a room, but there's no ssuch thing. You can work with multiply, burn, fill layers and whatever, but the best way to learn, in my opinion, is to choose a brush, pick a colour and then PAINT on the shadows and light.
If you look in your first posted bg, you've already started on the shadowing with the different coulours of the wall, the panels on the wall, the door frames. Start from there and you can do wonders!

[Demicrusaius]

It's really not an issue of "Not knowing what light looks like in a room" or having "Zero sense of perspective" It's that I don't understand photoshop tools. So, I tried to do what you guys said. Use dodge and burn and layers and transparencies and yellow brushes. I'm not looking for a quick fix. I don't shy away from work at all when I know what I'm doing. Everything I'm doing looks fake and awful. Just ignore my attempts, I'm just trying out techniques. Once I understand the basics of HOW then I can conquer the WHAT.
So, I'm just gonna take this to a photoshop forum.

[Snarky]

That picture you did is amazing! Crazy inspiring. I'd like to figure out how to do something like that, rather than relying on Kerkythea, but we'll see how well I can get it to work. I'll definitely check out those tutorials too (when I'm not stuck at college *grumble*). Just out of curiosity, how long did that mock up take you?

Oh, maybe 15 minutes. (I wasted some time playing with curves, but it didn't really add anything.)
It is not a very good paintover; painting with black over colors doesn't give the right look, and the highlights have wiped out details and texture, and are probably wrong anyway. I think what you're responding to is rather the overall sense of light and gloom, which provides depth and atmosphere just by virtue of using a single, defined light source.

I think applying some of those techniques manually might be the way to go. Would it be possible to do a little video tutorial showing some of the methods that you used? I absolutely love what you did to it. I understand the core concept of how it should look now, but I'm still not sure of the techniques I need to use.

I'd be embarrassed to, when there are so many better artists around. (Although sometimes seeing how someone not-amazingly-good does it can be helpful because it's easier to notice the actual technique when you're not completely taken in by the illusion of reality.)

Ok, I tried to add some light and shadows myself and... My god. The horror.
I don't understand how to use dodge and burn over a transparent layer, but I was able to use a transparent yellow for the light source. I'm particularly perplexed by the bright spot Snarky added to the floor. Mine looks embarassing and I don't even want to post it here.

I don't like dodge and burn myself. Burn in particular gives this weird, oversaturated look, just as if the edges had been burned. I didn't have a chance to see what you posted before you took it down; in general I'd say that you shouldn't feel bad about having difficulties at first. It does require a good deal of practice to be able to make something decent (both in terms of knowing what you should try to make it look like, the technique in getting it to look that way, and knowledge of the tools).

I'm not sure which is worse! The second one is using transparent brushes of white and yellow using various opacities and the smudge tool. I know this isn't a GIMP help thread, but all the tutorials posted are design suggestions and not technique suggestions. Maybe someone could point me in the right direction?

It's really not an issue of "Not knowing what light looks like in a room" or having "Zero sense of perspective" It's that I don't understand photoshop tools. So, I tried to do what you guys said. Use dodge and burn and layers and transparencies and yellow brushes. I'm not looking for a quick fix. I don't shy away from work at all when I know what I'm doing. Everything I'm doing looks fake and awful. Just ignore my attempts, I'm just trying out techniques. Once I understand the basics of HOW then I can conquer the WHAT.
So, I'm just gonna take this to a photoshop forum.

Again, not having seen your attempts, I can't really commment. But the critics lounge is meant for this kind of question, so don't feel you have to go elsewhere.

One thing that really helped me improve was to work in black and white. The effect of light and shadow on color can be confusing, but when it's all grey, you just have to worry about the lightness.

[Snarky]

Snarky, do you have all of these former threads and blog posts saved for yourself somewhere, or are you finding them on an as-needed-in-this-thread basis? Because it strikes me that it would make a nice sticky to have all of these sorts of threads linked from one post.

I recently saved some tutorials on my own computer, which I used to dig up the outside links, but I also just went through loominous' posting history to dig up some of his paintovers. I feel like some of the best stuff is missing or I haven't found it. (Also, I'd like to make clear that I don't think loominous and theo are the only artists on the forum worth learning from; it's just that I remember them posting a lot about light, with demonstrations and paintovers.)

[Lasca]

I hope my comment didn't put you down!
I just remember going through the same thing and realising I need to learn how to do it with a pen and paper before doing it in photoshop. Just to be sure of what I was trying to accomplish.
And the base of your background is really good! So don't be to hard on yourself.
i remember someone posting this link http://www.schoolism.com/school.php?id=3 to the forums a while a go, and I thought it was really good. Keep on keeping on!

[Demicrusaius]

That school was $400 dollars, lol.
I already checked my college to see if they offer Photoshop classes, but you have to have all these stupid art history prerequisites.
The first two images were me trying out different tools, but now I have an honest to god attempt. Now, before you advise suicide, let me acknowledge that I know it is terrible, but a step in the right direction. At this rate, If I can't get any better at this, I'm just gonna leave it flat. But, all good things take time and I'm willing to practice.



I added a new layer that was identical to the first and then reduced it's brightness by 50%. I used an eraser at 50% and lower opacity in order to gradient the light spot on the floor.
I did the same thing to the lantern, but then I added a new layer and started painting yellow and white highlights (with a high opacity) over the brightest spots.
I definitely over did the white on the wall, but I'm not sure how to get the right shape of the gradient. It just looks like squares of light are emerging on both directions of the wall opposed to an orb of light coming from the lantern.
When I tried to draw circles, it just looked like I was painting ON the room instead of IN it (as Lasca pointed out), but both look terrible!
Looking at it now, it could use some smudging to smooth the gradient, but since I used a darker layer, smudging would affect the base layer too. I guess I should be painting on black instead of erasing it?