Friday, June 12, 2009

AngstGoddess003 Embarasses Herself: Tech Q&A



Someone asks me a really fucking difficult question...


Q: Dear AngstGoddess003,

How do you make photos all shiny and pretty and kinda cartoon-like and all clean and all that (my description is pretty bad-- I mean the pictures of Edward and Bella like you did for Creature of Habit by Angel)? It's really cool and I would love to be able to do it, but I suspect it's really, really hard. Still, if you think it might be possible... (and on photoshop preferably cause gimp scares me).

Love,
~drift


A: Firstly, thank you for killing my Photoshop. Seriously. Is dead. Begging for mercy. "No more fucking screenshots, AG!" Well, FUCK YOU ADOBE 7.0! I knew I should have upgraded to CS. Damn me and my nostalgia for obsolete technology.

Well, I only have space to answer this question this week because it is painfully long and drawn out AND IF YOU DON'T USE IT I WILL HUNT YOU DOWN!

Glamorizing a Photo


There is one singular method I enjoy applying to just about every photo I touch. Glamorizing a photo isn't a science, it's an art. I can't give exact steps for anyone to use at all times, because photos, quality, colors, and perceptions vary, but I can offer a step-by-step using this photo of K-Stew. I will add a caveat that this process must be used in moderation with any photo of a male. Edward was meant to look flawless, but not pretty. We don't want to cut off his balls or anything, mkay?


Choosing a Photo:
High Quality is KEY when doing this! You want something large, even if you plan to minimize it for a banner or avatar. You can even apply this to personal photos taken with a good digital camera. Trust me. I do NOT look like my photos, EVER. I just have Adobe, time, imagination, and appallingly low self-esteem.

Rock the fuck on.

Prepping the image:
Open the photo you want to work with in Adobe Photoshop by going to "File>>Open."


1 - Duplicate Layer by right clicking on the photo in the layer's pallete, and choosing "Duplicate Layer."


2 - Go to Image>>Adjustments>>Brightness/Contrast. This image is already a little too flat for my tastes. A lot like Kstew's acting talent. OOOOOH! BURN! Just kidding (not totally). Leave brightness alone, and dick around with the contrast slider. Find something YOU like. I used the settings shown in the figure because they made me happy.

Softening Skin:
Skin is important to any manipulation. Especially when doing anything vampy, there can be -- quite literally -- no flaws. But also, softening the skin and giving it a porcelain type look is really rather classic, and gives the photo an almost painted quality. I'm also often told that the actress I'm manipulating rarely looks like the actress I'm manipulating once I've finished. This is probably the cause of that. This is a good thing, don't pout.

3 - Zoom in close ("Zoom Tool") and select the "Polygonal Lasso" tool. I'm using polygonal lasso because the plain Lasso is a motherfucking slore.
b. Click around the shape of the face. It doesn't have to be exact, just a general and rough outline. Avoid hair when possible, but don't go batshit if you have a few strands in there.

4 - Holding down the "ALT" button, click around the eyes, nose, and mouth. This will deselect these areas. Be certain to deselct and sharp lines or details. I wish I could be more exact here, but it's really just feeling out the shapes and lines of the form.

5 - Feather your selection by going to "Select>>Feather." I'm using 10px, but depending on the size of the picture you're using, you may need more or less. The general idea is to make the selection fuzzy.

6 - The good part! Go to "Filter>>Noise>>Median"

7 - HUZZAH! What the FUCK is happening? You aren't certain, but you like it, dontchya? Awesomeness, that's what. Play around with the radius here. We want enough to give it a softened look, but not so much that it's ugly and obvious. 13 pixels works well for this image's resolution.

8 - Now our face looks nice and soft, but chances are, there is more skin showing than JUST the face. Leaving other portions untouched will make the image look fake and comical. Repeat steps 3-7 with the lasso/feather/median with any arms, necks, hands, or chests. All skin must go!

9 - And that's the most effective method of softening skin...

Color and Tone:
Colors set the atmosphere for the peice, but skin should always be considered pale in these types of images, and you have to extract all previous color. Here's the totally ghetto method I use to accomplish this.

10 - Whorify by adding makeup! I'm emo, and us emos fucking love our eyeliner and lipstick. Don't skimp, now. Choose your "Burn" tool and set the range to something like 50% (soft brush). Apply to the outlines of the eyes and the lips. Avoid teeth and the whites of eyes.

11 - Flatten image by going to "Layer>>Flatten Image." I know you've been saving, right? RIGHT?

12 - Desaturate the photo by going to "Image>>Adjustments>>Desaturate." This removes all color.

13 - Okay. We're getting ten kinds of artsy fartsy with this step. I'm ghetto with my coloring habits (stop fucking laughing at me), so I open another image of the person in the picture I'm working on. In this case, it's just another HQ still of Kstew (though photo size and quality doesn't matter here). I do this because the skin tone is similar, and the randomness creates a good pallete of colors for me. Don't spend too long choosing. Get a picture of a fucking tree trunk if you have to.

14 - We're going to cover this random picture we've opened in a HEAVY Guassian Blur )"Filter>>Blur>>Guassian Blur"). We want the colors to bleed and merge fluidly. I'm a big fan of the highest possible setting, but I like to keep chunky shapes.

15 - Now we're going to just drag this blurred photo onto the canvas of the photo we've been working on. In the event that it doesn't cover the entire surface of the image, just "Edit>>Transform>>Scale" and force it to.

16 - We want to set this blurred layer to something like "Overlay." Though I like overlay, something else may look better depending on the combinations of pictures you're using. Don't be afraid to play around with it and find something that suits your inner lover-of-pretty-things.

17 - "Flatten Image" once again.

Refining the Image:
Now, it looks pretty fucking sweet, don't get me wrong, but... I need MOAR. This is the portion in which steps become less and less exact and more eye-trained. For example... Step 18...

18 - WHAT THE FUCK! THERE ARE ALL THESE MOTHERFUCKING RAGGED AND ALIASED GRADIENT LINES SULLYING MY PRECIOUS! Why? Well, I could get all technical with the program's internal interpretation of polar pallettes, but... I won't. It even bores me. The important thing is that the overlayed image has accentuated the proof of our manipulation, and now her cheek looks all funky foo. BOOOO. We're going to get our Polygonal Lasso once again and select the portion of the cheek that dissatifies us so.

19 - Feather your selection, as you did in Step 5 and just... Guassian blur the living dogshit out of that motherfucker. We don't take well to that type of blatant non-compliance, aliased gradient lines. Not fucking cool.

20 - Get out your "Blur" tool. There are little edges from our previous selections that will be grainy and really annoying to look at (Around the eyes, nose and mouth. Don't act like you haven't been secretly snubbing them). Set the strength to 100% and, using a small, feathered brush, blur around the fine edges of the lips, eyes, and nose. See image for the exact locations I blurred.

21 - Now, we don't necessarily want our imaggy all blurry. Quite the contrary. We just want to define what's smooth and not. So now that we have accomplished this, we are going to re-sharpen it by going to "Filter>>Sharpen>>Sharpen More." This gives it quality-pop.

The "Extra" Effort:
I take it even farther because 1.) I have no life, and 2.) This is a tutorial, and I'd remiss not to.

22 - I added a black frame to my image because I'm emo, and us emos love black. I then added some "Filter>>Render>>Lighting Effects". I... errr... didn't screenshot this process. Sorry. I just made a new layer and painted black around her face and hair to rid it of that previous, fugly background. And then I tweaked the lighting effects to my preference.

23 - Makeup again! I know, right? It's so much easier this way. Revlon doesn't have an "Undo" button. So, I'm getting a little ghetto once again and just painting on a new layer using a small brush. I chose my eyeshadow colors based solely on personal preference, but are lips ever anything other than red? I also utilized my smudge tool to pull it out over her eye a bit. I then set the layer to "Soft Light."

24 - Well, that looks better, yes?

25 - Eye Color, because you might have a vamp that needs gold or red eyes. I made a new layer and chose a soft paintbrush and a warm golden tone. I then painted one little dot on the eye, and use my "Smudge" tool to smudge it around the pupil.

Now you have a before and after to make yourself feel all accomplished and artsy. Go you!

You can apply this to just about anything. Add a Vampward in the background all kinda creepy and lurkish, and add some cool, textured background or something. Toss in some text, a cool quote, and hope Amethyst Jackson isn't pissed off that I used Bonne Foi without even asking her. (So sorry, bb. I fail at time management.)


Send all tech questions to angstgoddess003@tlydf.com. Thanks to tby789 for reccing Bonne Foi for this project, and suggesting the quote.

29 comments:

  1. okay...I'ma come visit you next and we're going to play with this shit cuz I'm a techno dummy and you make it look way to easy!

    :-)

    ReplyDelete
  2. Tis soooo pretty.

    And she makes it look easy but it ain't. The magic wand tool and select tools are hateful. Girl just has mad skillz.

    ReplyDelete
  3. Wow. I love it Sam. Your istruction is great and I'm sure Amethyst would love that for BF. It's amazing.

    xxoo

    ReplyDelete
  4. I love how you are always able to make your articles informative and entertaining. I also look forward to the tech articles.

    ...

    I'm such a nerd.

    ReplyDelete
  5. This is literally my first time on here but that banner/poster for BF was so f'ing hot that I had to say something.

    Seriously, wow.

    ReplyDelete
  6. Alright. So I THOUGHT that I was doing fairly well in the tech training AG had been providing me with - but holy hell chick. MY GADS!

    Excellent post. I do love when you share what's in that techie noodle. Ima try it, get annoyed, cuss a lot and then give up.

    ReplyDelete
  7. Wow, I was actually going to email you with almost the exact same question! Thanks, drift, for asking it!

    And thanks for that tutorial, AG! I'm gonna give this a shot this weekend.

    ReplyDelete
  8. I bow to your mad skillz. I won't even try this because I already know I would collapse from the pressure. I have zero ability and I am going to blame it on the fact that I am getting old.

    ..and thanks for helping me out with the thing, you rock hard.

    ReplyDelete
  9. I love artwork and thanks for the photoshop tips!

    ReplyDelete
  10. You are seriously talented, and your tutorials are fab. Thanks for more photoshop hints! I am totally out of practice and need the help.

    ReplyDelete
  11. Thank you so much, AG, it's absolutely fantastic and you explained it in a way that I could actually do it! Thanks so much for doing this, and I'm sorry about your photoshop :(

    So, I did use it:

    http://i123.photobucket.com/albums/o304/LCrules/k-stew.jpg
    (I did this one while reading the tutorial)

    http://i123.photobucket.com/albums/o304/LCrules/VampMecopy.jpg
    (I succeeded in making myself look like a whore, not much else...)

    http://i123.photobucket.com/albums/o304/LCrules/MainAlmostFinal_edited-2.jpg (My English assignment. I really can't be bothered to make it any better)

    This kept me entertained for hours. I'm still not that crash hot, but hopefully I'll get better.

    Thanks again :D
    ~Drift

    ReplyDelete
  12. YAY! You used! I'm all smiley now!

    (I succeeded in making myself look like a whore, not much else...)

    Dude, that's all any of us want. To look like whores. My sister-in-law... allll the time "Hey? Can you make me look like a whore?" in IM. But, I mean... she's also Team Jacob, so I don't even make her look like a classy whore anymore.

    Fantastic, bb! Simply fantastic. Thanks for asking the question that all others feared.

    I'm off to repair install my Adobe now.

    <3

    ReplyDelete
  13. Ahh I love this article! :)

    Original:

    http://ortizkristian.files.wordpress.com/2009/02/robert-pattinson-crazy-hair.jpg

    Mine:

    http://i330.photobucket.com/albums/l416/Michellephants/hum.jpg

    Now I would like a tutorial on how to frame hair :P LOL! So much fail there.

    ReplyDelete
  14. Oh, that gives me another question for next week :D I actually have a hell of a lot. Prepare the be bombarded. But, do you just do graphics or can you also give tutorials on fanvid making and stuff like that?

    ReplyDelete
  15. Friggity Frig, Michelle! That is AWESOME.

    Now I would like a tutorial on how to frame hair :P LOL! So much fail there.

    If it's Rob's hair?

    Step 1: Slit your wrists.

    js.

    But, do you just do graphics or can you also give tutorials on fanvid making and stuff like that?

    Video Production is admittedly not my forte. I could probably answer software related tech-fail, but anything beyond that, I'd be worried that I'd get wrong. I've used Adobe Premier and the default Windows Movie Maker a bit. RAM HOGS.

    Also, anything 3D Rendering sends me into convulsions.

    I can swing Flash, though. And, gifs (which is coming up next week), programming, etc.

    Thanks for the participation. I get all warm and fuzzy. :D

    <3

    ReplyDelete
  16. Oh my Gawd!!!!!

    I don't have photoshop, so I couldn't do this even if I wanted to attempt!

    AG, I am in awe of your skills. I showed my fiance this after I begged him to buy me photoshop, and he was like "We aren't getting photoshop, I promise you it is A LOT harder than it looks, and that chick is just pretty effin awesome!" See, AG, even my fiance knows of your awesomeness. It's undeniable.

    ReplyDelete
  17. Well, I had a go at this, and learned a lot. Still not pleased with the results, and can't really use it for a banner. Hmm.

    Here's my before:
    http://i705.photobucket.com/albums/ww55/istandcorrected/ksteww.jpg

    Here's my after:
    http://i705.photobucket.com/albums/ww55/istandcorrected/bellahairup.jpg

    Thanks so much for the info, I have learned a lot lot lot, and it's fun to play around.

    ReplyDelete
  18. I just want to say a huge THANKS! I've messed about with image editing/manipulation before but I've not really understood the importance of layers until I started your tutorials (also thanks to Moon.Witche for pointing me this way). Here's the link to my version of the above tutorial. :)

    http://i288.photobucket.com/albums/ll181/SapphireWitche/tutorial%20imgs/vamptesttut.jpg

    Looking forward to gifs! (I've also decided that I like the GIMP program.) :)

    [ This is the other tutorial that I used. Thanks again AG!

    http://i288.photobucket.com/albums/ll181/SapphireWitche/tutorial%20imgs/tutorial.jpg ]

    ReplyDelete
  19. AG... do these same principles work with paintshop pro?

    ReplyDelete
  20. I was also wondering if it's basically the same with GIMP?

    ReplyDelete
  21. Hey AG...so I gave this a shot, and made it work for the most part. I *did* however, have trouble with Step #16:

    "16 - We want to set this blurred layer to something like "Overlay." Though I like overlay, something else may look better depending on the combinations of pictures you're using."

    ...How does one do this?

    Thanks!

    ReplyDelete
  22. I've spent all weekend using this tutorial and while I haven't yet gotten it 100% the stuff I'm working on looks a hell of alot better than before. Thanks to everyone for posting what they've come up with. It gives me hope that it can be done! epecially those lips that keep looking like the joker after I've done them. lol
    Thanks for all the help AG :)

    ReplyDelete
  23. AG I am having far too much fun with your tutorial. Dude, seriously. I think I have lost at least 10 hours of my life to manip'ing photos left and right.

    This concept is so neat. I love playing in photoshop, and I've never used your skin softening technique; it's so much fun to see how you go about doing this!

    I swear this is my last comment, I need to stop spammin' the blog.

    http://i330.photobucket.com/albums/l416/Michellephants/kstew.jpg

    ReplyDelete
  24. Thanks so much for the tut AG.

    Here's what I managed to wrangle up. It's not particularly good, but I'm still learning:

    http://img35.imageshack.us/img35/8228/goldenwim.jpg

    ReplyDelete
  25. Here is my insanely late comment on this tutorial that I just realized was posted on my birthday. So now I know why I'm late on commenting.

    Anyway, I need to try this tutorial. You certainly make it seem much easier than it actually is. Or at least so much easier than the way I've been doing it - which I've still yet to master, btw - and I am jealous. Insanely so. This tutorial has made me rethink everything I thought I knew about photoshop.

    Frightening.

    Is it possible to both love and hate this program, because I do.

    ReplyDelete
  26. Okay, I am going to ask an utterly stupid question:

    Can this be done on GIMP? I am unfortunately not able to own the greatness that is Adobe Photoshop.

    ReplyDelete
  27. Amelie: You can do all this with Gimp, sure! The tools will be a little different, but the concept remains. XD

    ReplyDelete
  28. I absolutely adore this tutorial. I learned a whole lot with it, now i can either either vamp up pics, or colorize black and white ones.

    My Bella
    http://farm5.static.flickr.com/4001/4638881548_d7d8da8820_o.jpg -Original

    http://farm5.static.flickr.com/4048/4641214172_17332eb76c_o.jpg - After I got a hold of it.


    My Jasper
    http://farm4.static.flickr.com/3399/4646347806_d6ab0eaeb1_o.jpg -Original

    http://farm5.static.flickr.com/4035/4645574095_65b2b4be9e_o.jpg -After I got done with it.

    http://farm5.static.flickr.com/4015/4645733389_126c728eab_o.jpg -Original

    http://farm5.static.flickr.com/4019/4645695835_48e182e7b4_o.jpg -After I got done with it.

    I look forward to seeing more tutorials up here :).

    ReplyDelete
  29. Holy shit, awesome tutorial! Definitely will be giving this a shot very soon.

    ReplyDelete

Spread The Word