Background up for grabs
-
- Regular
- Posts: 41
- Joined: Sat Jun 04, 2005 7:47 pm
- Location: Singapore
- Contact:
-
- Regular
- Posts: 114
- Joined: Wed Jul 16, 2003 12:50 am
- Location: Toronto, Canada
- Contact:
Hey there, new around here ^^
I've tried turning photos into VN backgrounds for the last few days. I see someone found a very similar way already but just for the sake of it I'll post my results. All source pictures are from stock.xchng, see authors for commercial uses . (they're not all 4:3 format but a crop would do the trick)
My first try, I went for a cartoon background style and used some blur effect to help.
Rather loaded picture so I tried to simplify as much as possible.
First try at interior pics.
Used a slightly different technic here.
I've tried turning photos into VN backgrounds for the last few days. I see someone found a very similar way already but just for the sake of it I'll post my results. All source pictures are from stock.xchng, see authors for commercial uses . (they're not all 4:3 format but a crop would do the trick)
My first try, I went for a cartoon background style and used some blur effect to help.
Rather loaded picture so I tried to simplify as much as possible.
First try at interior pics.
Used a slightly different technic here.
-
- Miko-Class Veteran
- Posts: 651
- Joined: Sat May 21, 2005 12:28 pm
- Location: University of Utah
- Contact:
-
- Regular
- Posts: 114
- Joined: Wed Jul 16, 2003 12:50 am
- Location: Toronto, Canada
- Contact:
The details, the details.
I wouldn't suggest using this technique if the other (character) artwork is fine. I would rather suggest that you add splines to make it "look drawn", but degrading the amount of shadows and value...nah.
Not that these photos are degraded TOO much, but it's degraded nonetheless. Doesn't make them unusable, so...uhh...
Hey, the first picture looks like my University! (Hart House, U of Toronto?)
Finally, about the crop...DON'T. Program the game engine to select where to display instead. This may even allow room for a few flexible tricks.
I wouldn't suggest using this technique if the other (character) artwork is fine. I would rather suggest that you add splines to make it "look drawn", but degrading the amount of shadows and value...nah.
Not that these photos are degraded TOO much, but it's degraded nonetheless. Doesn't make them unusable, so...uhh...
Hey, the first picture looks like my University! (Hart House, U of Toronto?)
Finally, about the crop...DON'T. Program the game engine to select where to display instead. This may even allow room for a few flexible tricks.
=/| ClearWind Design Studios |\=
- PyTom
- Ren'Py Creator
- Posts: 16096
- Joined: Mon Feb 02, 2004 10:58 am
- Completed: Moonlight Walks
- Projects: Ren'Py
- IRC Nick: renpytom
- Github: renpytom
- itch: renpytom
- Location: Kings Park, NY
- Contact:
A better idea is to work with the images at full resolution, and then crop or rescale them as the final step in the process. You don't want to ship images with portions that aren't being used, as that will make the download bigger and consume ram at runtime.Yang Sei Fu wrote:Finally, about the crop...DON'T. Program the game engine to select where to display instead. This may even allow room for a few flexible tricks.
Of course, if you are going to show the entire image (say, because you're moving the image around), then it does make sense to ship the whole thing. But that's a directoral decision.
Supporting creators since 2004
(When was the last time you backed up your game?)
"Do good work." - Virgil Ivan "Gus" Grissom(When was the last time you backed up your game?)
Software > Drama • https://www.patreon.com/renpytom
Well my idea was that photos used in games just scream "photooo!" a bit too much compared to hand/vector drawn characters. Hence why I tried to simplify the bg too. Adding splines.... you mean having some contours in there mh ? Like this ?Yang Sei Fu wrote:The details, the details.
I wouldn't suggest using this technique if the other (character) artwork is fine. I would rather suggest that you add splines to make it "look drawn", but degrading the amount of shadows and value...nah.
I don't think I've tried having contours yet not simplifying content. I'll do that tonight probably.
I take it it's mostly a matter of taste tooNot that these photos are degraded TOO much, but it's degraded nonetheless. Doesn't make them unusable, so...uhh...
Supposed to be some abbey hosting a school... Don't know much else (but checking stock.xchng and looking for "school" should helpHey, the first picture looks like my University! (Hart House, U of Toronto?)
Well this has been answered and again, it's up to the author. I worked with high res stock photos so I could make it into 800x600 or even 1024x768 actually.Finally, about the crop...DON'T. Program the game engine to select where to display instead. This may even allow room for a few flexible tricks.
Ok, very quick tuto, I might go in-depth later tonight :
I'm using Photoshop, so... sorry but I'm not sure how to get it right using another program.
Get your pic, duplicate your main layer three times.
For the first copy, use Filter > Artistic > Cutout. For the first pics I used a 6, 0, 2 setting most of the time. Test it out and change to 5, 0, 2 or 8, 0, 2 as needed (depends how many dominant colors there are). It should give you a very simplified version with large patch of plain colors.
For the second copy, use Filter > Blur > Smart blur. 25, 40, high settings give a picture where all simple parts (patch of grass, sky) get all fuzzy blurry. Looks like cutout but it keeps color details.
Third copy, use Filter > Blur > Gaussian Blur. Here it depends on the size of your source and how much haze effect you want. I used "5.0" for all pics except the first one (which settings I lost ;_; ).
The order of layers should be (from top to bottom) : gaussian blur, smart blur, cutout.
Put the gblur layer in Darken mode, the smart blur layer in Lighten mode and play with each opacity level (usually 50% for both in above examples).
Smart blur layer will add light colors and some "gradients". Gaussian blur layer will bring back shadows and give the blurry dreamy effect.
If you want shadows/lights without blurs, replace these layers with a copy of the source layer without any effect applied, just Lighten/Darken mode and a lower opacity.
Alright, that's for the main cartoony effect, but there's still a color step :
Add an effect layer (the black/white cookie button in the layer panel) and choose "Levels". I use 20, 1.30, 235 settings but it's up to you. Goal : lighten up the picture yet keep some contrast.
Add another effect layer of type "Hue/Saturation". Here's the most free and case by case part : you'll have to spot dominant colors, or at least those you deem the most important, then select this range (for grass, select green, for sky select cyan...) and up the saturation (I tend to use 30). You can also play with the Hue setting to make grass greener, or turn green leaves into red ones for autumn settings .
And finally add a "Brightness/Contrast" effect layer. I tend to lower contrast so all the harsh colors don't kill my eyes, but then also lower brightness so it doesn't look too washed out.
-
- Regular
- Posts: 41
- Joined: Sat Jun 04, 2005 7:47 pm
- Location: Singapore
- Contact:
I'm definitely still around, sorry for the long hiatus - I was studying for and taking exams these past few weeks. sorry about that. in any case, for that school gate picture, i've removed the chimney, but i'm new to photoshop so i don't really have confidence in altering that particular picture too much. just wondering, so you happen to have other bgs you need? i think i'll hopefully be able to finish them faster than that one, since i'm currently stuck. if you want, i can post it here.
monele: great work, I'm loving that third picture as well. looks awfully authentic. i'll be trying out your technique on some of my stock photos as well, hope you don't mind.
monele: great work, I'm loving that third picture as well. looks awfully authentic. i'll be trying out your technique on some of my stock photos as well, hope you don't mind.
Mikey : I suspect Flash's vectorize function is very similar to the cutout filter in Photoshop actually . Thanks for the cheers, makes us keep rolling
bardsmanship : Sure, I wouldn't reveal the trick if I wanted to keep it to myself
The strange thing is that a lot of people like the third one whereas it's the one I thought worked the worst XD... I guess I'm not looking for the same "feeling" in the backgrounds .
bardsmanship : Sure, I wouldn't reveal the trick if I wanted to keep it to myself
The strange thing is that a lot of people like the third one whereas it's the one I thought worked the worst XD... I guess I'm not looking for the same "feeling" in the backgrounds .
-
- Regular
- Posts: 114
- Joined: Wed Jul 16, 2003 12:50 am
- Location: Toronto, Canada
- Contact:
- Glasskitten
- Regular
- Posts: 138
- Joined: Fri Jul 22, 2005 6:19 pm
- Completed: I confess to nothing! \(>o<)/
- Location: Inside a parcel of air
- Contact:
The pictures are very impressive, especially to me since I have never gotten that far. Is there a known set of techniques to do similar things on the GIMP program thing?
Sometimes I wonder what would happen if the entire forum united their most prized talents into an enormous collaborative ren'ai project...Heh...
Sometimes I wonder what would happen if the entire forum united their most prized talents into an enormous collaborative ren'ai project...Heh...
Grand list of things not officially canceled:
Salt -- the heartwarming story of brain-eating space worms
Tangent -- an epic poem and/or novel about a borderline-autistic Martian imp and her relationship with God
Kittens of the Darned -- a grimdark soap opera about sexy catgirls (Indefinitely postponed until I learn to draw and color realistically)
The Other Mary -- the most perfect fic about the most perfect Mary Sue EVER
Rockheart -- a short story about a monster who kills everyone
Corrupted -- a completely different short story about a monster who kills everyone (late Worst Visual Novel Ever)
Checkpoint 36a -- the transcription of a short multi-ending dream about time travel and undead schoolgirls
In Which the Princess is Kidnapped -- an entry in the "ordinary girl ends up in an alien universe and tries to save it" genre
Pictogram Scramble: Magical Friendship Bunny Ivy -- a Flash game about a magical girl making friends (Indefinitely postponed until I learn how friendship works)
Salt -- the heartwarming story of brain-eating space worms
Tangent -- an epic poem and/or novel about a borderline-autistic Martian imp and her relationship with God
Kittens of the Darned -- a grimdark soap opera about sexy catgirls (Indefinitely postponed until I learn to draw and color realistically)
The Other Mary -- the most perfect fic about the most perfect Mary Sue EVER
Rockheart -- a short story about a monster who kills everyone
Corrupted -- a completely different short story about a monster who kills everyone (late Worst Visual Novel Ever)
Checkpoint 36a -- the transcription of a short multi-ending dream about time travel and undead schoolgirls
In Which the Princess is Kidnapped -- an entry in the "ordinary girl ends up in an alien universe and tries to save it" genre
Pictogram Scramble: Magical Friendship Bunny Ivy -- a Flash game about a magical girl making friends (Indefinitely postponed until I learn how friendship works)
Who is online
Users browsing this forum: No registered users