Adventure Game Studio

Creative Production => Critics' Lounge => Topic started by: creatorlars on Tue 21/10/2008 19:47:08

Title: Apartment Sketch [Updated w/Colored Version]
Post by: creatorlars on Tue 21/10/2008 19:47:08
I've been meaning to learn how to draw for many years, and when recently deciding to surmount an adventure game project, I decided it was time to try.  This forum and many of the links from it have proved to be incredibly helpful, and I'm very grateful for the resources and knowledge I've gleaned here.

Here's a room sketch for a location in the game I want to make.  I am still trying to find out what direction to go in terms of resolution and artistic style.  I know there aren't any "right ways", but currently I like the look of 640x400 backgrounds with digitally colored pencil drawings.  I would do 320x200 pixel art, but am afraid to lose the natural quality of the lines.  I tried inking by hand before scanning, but realized pretty quick I need more practice at that, and it seemed to flatten out the pencil lines too much.

(http://www.larsattacks.com/D2020/apt_int.jpg)

I am stumped where to begin with color.  This room is supposed to be dark and moody, lit only by the candles in the foreground. 

Anyway, any critiques of my drawing and suggestions on how to improve it, as well as suggestions on a fitting color pallet are greatly appreciated.  I am planning to redraw this scene much cleaner for a finished version, but as I'm very much a beginner and don't have anyone else to go to for critiques, I'd love your feedback. :)

Lars
Title: Re: Apartment Sketch
Post by: Paper Carnival on Tue 21/10/2008 20:32:24
I can't really give any coloring advice, but I believe you are on the right track with the sketch.

I like it a lot, it has enough detail while still giving a lot of room for the character. It doesn't feel "empty" of anything. The perspective, on the first glance, seemed just right but then I noticed some details that were slightly off (like the top of the door, or its knob). Oh, it also has an interesting angle and is generally well-composed.
Title: Re: Apartment Sketch
Post by: DanielH on Tue 21/10/2008 21:06:02
It looks great. My only qualm is the (i presume) fridge, which looks way too wide. Dunno, maybe it's just me.
Title: Re: Apartment Sketch
Post by: Tuomas on Tue 21/10/2008 21:44:13
You're right, while the table in front of it looks WAY too small and is also fairly oddly placed, next to the fridge.

This got me wondering actually. The door has a sign, "Do Not Enter". Usually in an apartment this means there's someone's own room there, right? So I was wondering, if the person living there has his/her bed in the same livingroom/kitchen he/she has their fridge and stove etc, what would be behind the door. Aside from a bathroom of course. But then the "Do not enter" sign would seem a bit odd. Of course I'm not to decide who puts what where, but still. This looks like a 1-person flat with a combined kitchen, a bathroom and a door to the hallway. Could be a room upstairs of a big house too though, renovated for rental, with the stove and all.
The latter actually seems more like it since the floor is obviously made of wood, which is usually not the case with flats, at least not where I come from.

I think I'd personally place the table next to the entrance door right in front of the pov, but I reckon that would take something away from the functionality of the background :)
Title: Re: Apartment Sketch
Post by: creatorlars on Tue 21/10/2008 22:05:19
Awesome, thanks for the feedback!  Yes, there are definitely a few perspective issues I need to work on in the final drawing... this was drawn fairly small on paper, but I am going to draw it bigger for the next go.  Thanks for pointing out the proportion issues on the table and fridge, I had not realized it. 

The "Do Not Enter" sign is the bathroom.  In the world of this game, there is (as of recently) no electricity, gas, running water, etc -- so our protagonist's bathroom is not a place anyone wants to be right now. :)  Also good excuse to not draw the bathroom, which is irrelevant to the plot (same for the "kitchen", which I framed out of view.)   I tried to hint at this in a couple places in the design of the room, such as with the unplugged lamp, candle-light, battery-powered mini-fan above the bed, etc.   So in addition to dark/moody, I guess my coloring job needs to reflect a very dirty, stained, dusty appearance.

You're right though, it's a 1 person flat or as we call them in Texas, a "loft" or "efficiency".  Some of the older buildings around here are converted into apartments, and those do have wooden-planked floors, so that's what I'm going for here.  I will save rambling about my game for another thread, once I have a demo or something, though. :)
Title: Re: Apartment Sketch
Post by: Tuomas on Tue 21/10/2008 22:21:27
I just wanted to add, as I saved the image in order to do some paintover, to show what i meant in case I wasn't clear... Yes, wanted to add, that you might want to save the image as .gif or .png instead of a .jpeg. Even though it provides you with smaller sizes, it can really hurt the image with the compression, and you might get unwanted artefacts, that'll ruin the image for good. It was basically meant for compressing huge pictures, like photoes for the internet. Perhaps you knew this already though.

Aside fromt hat I forgot to mention, that the sketch is very nice, and you obviously have a very stable hand, which is a good thing. One that I always lacked when ti came to background drawing :)
Title: Re: Apartment Sketch
Post by: creatorlars on Tue 21/10/2008 23:25:38
Tuomas -- I'll post as a 24-bit PNG next time. :)  Thanks for the tip.  The original scans are in PSD format and 300dpi, so I'll probably work off those when actually getting into the painting...

Thanks for the compliments on the sketch, however I must admit that my "steady hand" is a ruler... ;)

Title: Re: Apartment Sketch
Post by: Mr Flibble on Wed 22/10/2008 17:17:00
I adore "Wet Retina".
Title: Re: Apartment Sketch
Post by: creatorlars on Wed 22/10/2008 19:39:44
Due to an artist friend's suggestion, I decided to start with a value painting of the scene with just grayscale values.  The idea would be then to smooth out the gradations (due to diffused candlelight) and then set the "value layer" to multiply in Photoshop while painting pure color values underneath.   Something seems weird about it to me so far though... thoughts?

(http://www.larsattacks.com/D2020/apt_int.png)

And for fun, the sketch of the exterior... very rough.

(http://www.larsattacks.com/D2020/apt_ext.png)

For this game I needed a band name that sounded over the top, but in a cool/ridiculous way rather than a corny/cheesy way.  If that makes sense. :)  Hence, "Wet Retina".
Title: Re: Apartment Sketch
Post by: Tuomas on Wed 22/10/2008 21:16:18
Hi, I know there's alot of people around here who know much more of lighting than me. I like it though, can't see anything wrong with it at the moment. But about the rough scetch below, I was thinking, you might want to experiment with different stairs. The ones there look like they were going straight down to the street. See here for example of what I meant: http://i174.photobucket.com/albums/w103/kaushen79/DSC00018.jpg Making them bend a bit at the upper end of them. Also, going up the stairs, you'll notice, that in most cases, the last step is below the level of the hallway floor, not the way there. I know it's only nitpicking, but since I can't give any artistical suggestions at this point, I thought I'd just bring these up for consideration.
Title: Re: Apartment Sketch
Post by: GarageGothic on Wed 22/10/2008 21:40:57
I think you have a lovely drawing style and good sense of composition. If you could clean up the pencil sketch a bit (either with an eraser or in Photoshop - the former may actually be easier), you wouldn't need to ink or draw over the original drawing. Just make the original linework as a multiply layer and add color in layers below it. I think it would suit your style not to cover up or refine the sketchy quality of the scanned artwork.

I wrote a tutorial on a similar technique which can be found at the AGS Ezine website (http://agsezine.wordpress.com/2007/07/22/do-it-garagegothic-style/).

Good work on the value map, by the way. After hearing Loominous go on and on about it in the critics lounge I want to try it myself for my next background.
Title: Re: Apartment Sketch
Post by: Kweepa on Wed 22/10/2008 23:54:10
It's a nice sketch.
Personally I would choose a side view of a room for an adventure game background.
Placing the light source in the foreground could be a problem. Generally you don't want to draw too much attention to the foreground objects since they are non-interactive, particularly at the expense of highlighting what IS important. It might also lead to the impression that it's a first person view, shining a lamp or flashlight into a darkened room. Finally it leads to a rather boring value distribution.
Title: Re: Apartment Sketch
Post by: creatorlars on Thu 23/10/2008 00:07:52
Thanks again for the great advice!

Those stairs have been a pain in the brain -- thanks for the reference photo.  I did another version of this scene and am still playing with it, but i like the general composition.  I think it will help to work on it in the right resolution, so that i have some sort of judge of how much detail to add to the background buildings.  

GarageGothic, that tutorial was very helpful -- I thought I'd read just about everything to be found around here... ;)  Been going through all the posts in this subforum slowly.  I agree that I don't want to lose the pencil texture -- the setting needs to be gritty (but not "realistic") and the pencil seems to work well for that.  I will do some of the coloring and then decide if I need to redraw it or not.  I was going to make a lightbox this weekend for this purpose.  

Steve, yeah -- it does kind of look like a flashlight right now.  I plan to blend the hard edges, and probably decrease the value range a little bit so that it looks more like candlelight.  For this scene I really wanted to emphasize what an "ordinary apartment" would be like after a few days without electricity -- so from a narrative viewpoint, the candles and lack of electric light are what I want the player to notice first.  The two items you will be able to interact with will be a pile of clothes on the floor and the fan on the wall.  Since these are things you are supposed to "look for", I didn't want to place them right dead center in a spotlight (you do know you're looking for them, so it's not an unmotivated pixel hunt.)  While I definitely see your point about a boring value distribution, I think the insinuation of a "first person" angle sutures the player into the character's viewpoint a little (within the context of the candlelit room as a whole.)  Let me know if I've misunderstood you. :)

Just for kicks, does anyone have any suggestions/ideas on what kind of sprites you imagine in this sort of environment?  I really have no idea at all.  I've got a sprite/animation artist, but it'd be good to give her some references to work from as this isn't her usual area of expertise.
Title: Re: Apartment Sketch
Post by: Tuomas on Thu 23/10/2008 07:58:51
Haha, well, for instance, in the exterior image, the character sprite should at least be 600 pixels high. Well, 500, if you cut the top of the door there. :) Just squeeze him into the room bg then later on. The style is very detailed, so, well I guess she should know already, that the most important thing is to make the sprites, objects and stuff look like they were originally part of the background.
Title: Re: Apartment Sketch
Post by: creatorlars on Wed 29/10/2008 22:20:46
For the life of me, I am having a really hard time with colors for this scene.  I guess part of it is indecision on my part of how I want the entire game to "look".  Here is a version inked by hand and then colored in Photoshop.  I do like the grungy/messy inking job to add some texture.  There will be animated candle flickering going on, but for now just imagine those candles are lit... the colors are supposed to be surreal, but what do you guys think?  What are the weak points and problem areas?  It still seems very unfinished but I don't know what to try next.

I colored by doing a grayscale value map and then painting over on a "Color" layer in Photoshop.

(http://www.larsattacks.com/D2020/apt_int_color.png)
Title: Re: Apartment Sketch [Updated w/Colored Version]
Post by: creatorlars on Wed 29/10/2008 22:28:04
Here is the PSD if anyone would like to screw with it:
http://www.larsattacks.com/apt_int.psd (http://www.larsattacks.com/apt_int.psd)

There are layers for Background tint, Grayscale values, Colors, and the Line work.
Title: Re: Apartment Sketch [Updated w/Colored Version]
Post by: goldensox on Wed 29/10/2008 23:27:15
http://i33.tinypic.com/33y3ith.jpg tried a bit of my style, strong lightning with almost liquid shadows and color watering.
Title: Re: Apartment Sketch [Updated w/Colored Version]
Post by: Ryan Timothy B on Wed 29/10/2008 23:43:10
Honestly, I see your sketch and instantly say that you're onto something there.  It looks great, has a great composition, and other than the floor on the left side there isn't any 'empty' space in the layout.

But then I see it after the photoshop touchups and coloring.  I think your black outlines are really really bold.  Too bold.  It kinda takes the realism out of the images (that you once had in the sketch) and gives it this Comic book style.
(Also) The further the objects the smaller the black line should be.  It helps gives depth.

I noticed you chose a lot of light colors.  The floor looks like it's planks painted white.  Even the desk and walls are white.

It's alright for a game, but honestly, looking at your great sketch I'd love to see you do better.  With less black lines, and perhaps stronger detail on the coloring to make it look less water colored.
Title: Re: Apartment Sketch [Updated w/Colored Version]
Post by: Phemar on Wed 29/10/2008 23:44:25
I love the background style you got going there, it's awesome.

Only thing I can think of is that the lighting is drawing all the attention to the bathroom door, which as you said earlier has no function in the game. Could be a bit of a red herring ;)
Title: Re: Apartment Sketch [Updated w/Colored Version]
Post by: creatorlars on Thu 30/10/2008 00:24:14
Thanks very much for the feedback.  Ryan, I agree with you -- I think this could be much better and with stronger detail.  I am a complete newbie, so I'm trying to figure this out from the ground floor -- I know nothing about painting other than the dozens of tutorials I've read over the past several weeks, and my idea of coloring is still not much past "coloring book". :)  I guess I should find more stuff I like and replicate it as close as possible.  If you could see an alternate direction for this sketch/bg please post some examples! :)  I'd love to give some different methods a try.
Title: Re: Apartment Sketch [Updated w/Colored Version]
Post by: Moresco on Thu 30/10/2008 00:29:55
I'm playing with the colors a bit...I'll have something to show you soon I hope, gotta make dinner and do some other things here but I like this background a lot!  You know, for being new to this, you're doing a fine job...better than I had.  Anyway I'll try to get that edit done to show you here soon.

Is the reason you chose light colors because of the color layer? Because no matter how much you attempt to saturate or darken, you cannot unless you apply those changes to the layer below it, the Values layer or the BG layer.  I've never seen anyone do this before, but I guess it works for the most part...but how to change color value easily?  That's why I put everything on its own layer, which may be tedious but it works for me.  Alright back in a while with that edit.

Update
Here's the quick edit...I didn't know how to approach things with your current layers, so I made new layers via selection-copy as new layer from the color layer.  Then, I set it back at normal, adjusted the colors with your color layer on and went from there.  If it doesn't look right over the color layer, you can just grab a color with the picker, color it in, then smudge at low opacity to smooth the gradations out.

(http://www.novellice.com/art/tRP%20apt_int%20Edit.png)

Thanks for letting me mess with that, was fun!
Title: Re: Apartment Sketch [Updated w/Colored Version]
Post by: Snarky on Thu 30/10/2008 02:47:50
Yeah, I don't think the coloring works at all. Which is a shame, because the sketch is great and I think the linework works fine. It does look very much like everything has been colored brightly, and then just had a darkening layer put on top... which I suppose is pretty much exactly what you did, or equivalent to it.

You need to think more about the shadows and how the light defines the shapes and surfaces. Currently I see no shadows at all. Since your lightsource is very close to the camera (which I'm not sure is a good choice), that's correct in most cases, but in places like under the table where the candle is sitting would be in darkness. As for defining the shapes, that's what I usually work in grayscale for. You don't have a lot of complex shapes, though (mostly just flat surfaces), and you use hatching for most of the other shapes, so I'm not sure how useful that is to you.

This might be a perceptual thing, but I don't think the dark areas look that much darker than the light areas. They're just shaded blue instead of yellow-green. Especially in the dark corners, I would go murkier.

You're also having saturation issues, I think. Candles cast very warm, orange light, so I would use bolder colors for things in the vicinity. The light should also bring out the color of the surface, not leave everything a hospital gray-green-brown. The poster looks like a missed opportunity for a splash of highly-saturated color.

If you're going to use this grayscale-first method, you can't simply use the values to define the regions of light. You also need to consider the inherent brightness of each surface. With all the walls, the floor and the furniture sharing the same values, you get a very washed-out look. Essentially, the grayscale version should be able to stand as a realistic black and white image.

Oh, finally, the unplugged lamp(?) on the desk completely blends in with the eyeball poster (there even seems to be some color bleed), to the extent that it looks like a big fan upon first glance. Unless you change the values and colors to make it pop more, I think you need to move it.
Title: Re: Apartment Sketch [Updated w/Colored Version]
Post by: creatorlars on Thu 30/10/2008 14:55:33
Thanks so much!  This is some great feedback.  Part of what I'm struggling with, i think, is that I want the room to have an otherworldly, cold atmosphere -- but instead I've chosen a lot of wooden surfaces and candlelight, which suggest browns -- and "earthy/warm" is not the impression I want to give.   Something like the character's previously inviting/warm home has now been turned into a cold, dark, uninviting place.  Maybe it's just going to be a matter of me deciding the surfaces should be painted other colors, or turning the "candles" into glowing jars of radioactive goo or something -- and/or slapping myself in the face and moving the light source, like several of you have suggested.

I think I'm going to try another one, abandoning the value map for now and trying to lay in flat colors under the line art first.  I realize that doing the "value map" method is just an excuse for not knowing what the hell I'm doing with colors yet.  I've also considered just doing a 320x200 pixel art version over the sketch.  I'll have more to show soon. :)  Thanks again for all your help so far.
Title: Re: Apartment Sketch [Updated w/Colored Version]
Post by: InCreator on Thu 30/10/2008 15:58:47
Sorry to say, I totally hate what you did with good-looking sketch.
I don't like that "scratch shading" at all!

It looks terrible and could be used only in some kind of dark horror game, and then too only with appropriate spooky lighting...

Also, how do you use character in a room with so strong perspective? Sounds like alot of zooming to me.

This way or another, you have to shade the picture. I mean, bed columns have same color on different sides, doesn't look like there's any light source or shadows at all. But going horror here, strong shadows are a must!
Title: Re: Apartment Sketch [Updated w/Colored Version]
Post by: Ryan Timothy B on Thu 30/10/2008 20:18:17
(http://www.bryvis.com/images/other/agsf/theredpress.png)

Alright I made a very long edit on the color edit by TheRedPress.  I have to go right now, but later I'll try to respond as to why I changed some things (The only thing I didn't touch were the candles.  Mostly because I also believe they should be moved to the other table by the poster).
Title: Re: Apartment Sketch [Updated w/Colored Version]
Post by: creatorlars on Thu 30/10/2008 20:27:05
Wow, thanks for taking the time... that helps me see the scene in a whole new light (pardon the pun.)  Looking forward to hearing your comments.
Title: Re: Apartment Sketch [Updated w/Colored Version]
Post by: Ryan Timothy B on Thu 30/10/2008 22:45:16
I figured I may as well just upload a gif to help show the difference between the two.
(http://www.bryvis.com/images/other/agsf/creatorlars.gif)

1: The first thing I wanted to remove were the squiggly lines you had throughout the background.  The lines on the bed were the worst.  I imagine you were trying to go for a cartoony look, or it was some kind of hand cut wood?  Either way, I didn't like them and they were really excessive.  Even on the walls.

2: The second thing I REALLY wanted to remove were all those black lines you had throughout the background.  I prefer darker colored lines (but if you want to draw great backgrounds; objects don't have dark lines around the edges in real life).

3: I really had no idea what that item on top of the bathroom door was, so I removed it.  I was going to place a vent there instead, but didn't get around to it.  I also removed the lamp on the wicker table.
I removed the fan.  It didn't look like a fan, and if it's going to be an interactive object (I imagine you pick it up), it should be drawn separately.

4: I resized the fridge to a more normal size.

The only thing I didn't play with were shadows.  But since I don't think the candle should be where it is, I didn't bother.  The candle should either be on the table, or/and on the bunk bed support beam.  It's not safe, bed sheets + fire, but it would be a nice spot for one.

Other than the things you can probably visually see why I changed, I can't think of anything else.

Edit: Oh.  Some magnets and stuff on the fridge would be absolutely excellent (just don't over do it).
I was also thinking that you should include a ladder for the bunk bed under where the sheet is hanging down.
Title: Re: Apartment Sketch [Updated w/Colored Version]
Post by: Krazy on Fri 31/10/2008 11:30:06
I don't know, I feel like you've kind of chiseled a lot of the life out of the image and made it very rigidly geometric and boring.
Title: Re: Apartment Sketch [Updated w/Colored Version]
Post by: Matti on Fri 31/10/2008 12:18:13
Yeah, you've taken the (pure) comicstyle out of it with clearing the wobbly lines and making everything more realistic and geometric.

But it's neither good nor bad, it just depends on what creatorlars was aiming for. But it seems that he likes it. I don't know, I like both. The important thing is how the characters will look like since they should fit the background.
Title: Re: Apartment Sketch [Updated w/Colored Version]
Post by: creatorlars on Fri 31/10/2008 14:45:24
Thanks again for the feedback.

Part of my issue right now is that I don't have a very specific style/direction in mind --  I'm just trying to develop my skills (from nothing) to the point at which I know what I'm capable of before trying to see the big picture.  I would definitely say that I was going for a comic book style look (to the point of being abstract -- think late 80's MTV)  and not realism with the pen scratch shading and bold lines.  But Ryan's redraw and feedback were immensely helpful at noticing a few things with my own image I could reconsider and I definitely learned a lot.  I think that if I am going to go with the pen & ink style, things should be colored minimally, flat and less realistic, with some bold pure black shadows -- and, I need to get better at it. :)
Title: Re: Apartment Sketch [Updated w/Colored Version]
Post by: Ryan Timothy B on Fri 31/10/2008 20:28:31
Ya, I was mainly just messing around.  I had a day off work and I really liked your sketch so I wanted to see where I could take it (and I definitely have no idea what I'm doing. just playing).
I'll agree that the wacky squiggly lines do give the background this comical feel to it.  But from the sketch I saw mainly straight ruler lined edges and figured that was the direction you wanted to go.
Either way you take it, that's alright.  I had my fun. :)
Title: Re: Apartment Sketch [Updated w/Colored Version]
Post by: auriond on Sat 01/11/2008 02:32:42
I couldn't resist giving it a go either, so here you are :)

(http://www.agspace.ws/apartment.png)

I went with your earlier statement that you wanted a normally warm, cosy apartment turned into an otherworldly space. In other words, your colours are a given. One way I know of to create otherworldliness is to have incredible contrast in light and shadow. Go on, turn off the lights and hold a flashlight under your face... you get the idea :)

So I did the same to your picture, leaving the original colours the way they were. I just turned up the candlelight and shadow. I may have overdone the shadows a little, because they're pretty much obliterating some of the details (e.g. under the bed), but I hope those weren't important details anyway. This way it also helps to draw the eye towards the centre of the picture, where I presume most of the action will be taking place.

I also added a lot of shadows - under the table/bench, near the fridge, around the poster... to be realistic, the pool of light shouldn't have been able to reach the fridge, but I liked the effect :)
Title: Re: Apartment Sketch [Updated w/Colored Version]
Post by: Questionable on Sun 02/11/2008 05:55:33
I was going to write a long post but I think most of it can be summed up by the following:








Wow... those are some bright candles.
Title: Re: Apartment Sketch [Updated w/Colored Version]
Post by: Trent R on Sun 02/11/2008 06:02:59
Have you ever been in a black room (no windows) with a candle being the only light? It's pretty bright.

~Trent
Title: Re: Apartment Sketch [Updated w/Colored Version]
Post by: Stupot on Mon 03/11/2008 12:03:09
Those are some pretty bright candles considering they have no flame  :P
Title: Re: Apartment Sketch [Updated w/Colored Version]
Post by: creatorlars on Mon 03/11/2008 15:16:42
Presumably, the flame(s) would be animation frames, so I didn't draw them as part of the background.  As far as realism goes, I think it would depend on the game as a whole, whether or not the candle's lighting would hurt suspension of disbelief at all.  Probably not, in this case. 

auriond -- i really like the direction of your edit, it's very atmospheric and spooky, which is definitely more in lines with my original intentions.  thanks for taking the time. :)

i'm going to go back to my design docs again pretty heavily and hopefully have some more finished backgrounds to share in a few weeks.