FUBARgenre: The Genre of Fubar

taking the bar out of fubar

Dark Bronze Skin Tones and Other Simple Color Manipulation Tricks in Photoshop

By Yan • Jan 19th, 2008 • Category: Photoshop Tutorials, Top Picks
» Previous: More Photoshop Tutorials On the Way (Finally!) » Next: Quick Photoshop Photo Fix: Emphasizing the Foreground with a Desaturated Background »

skin tones - before and after

(Mark, get out of my face or I swear I won’t write this. Stop hovering, dammit! Love you! Now, scat!)

Changing skin tones and manipulating portrait colors in photoshop seem to be the craze these days. And I’ve been doing it for the longest time without really any conscious effort on my part. But I’ve been asked to write this basic photoshop tutorial, so I will attempt to retrace my steps.

After many false starts, I figured that the best way to write this is from a first person perspective. The didactic tone never really worked for me, anyway.

Step 1. I first created a new layer above my original background image and filled it with black (#000000).

Uncle Boy

Step 2. I then duplicated my background image and changed its layer style to Luminosity.

Uncle Boy

Step 3. Next, I made a second duplicate of my original background image and played with its brightness and contrast settings. You can do this by going to Image in your Top Menu, selecting Adjustments, and clicking on Brightness/Contrast (Image»Adjustments»Brightness/Contrast). I played with the Brightness and Contrast until I got something that looks like this:

Uncle Boy

Step 4. Still working on my second duplicate image layer, which I renamed “Background copy 2″, I changed the Layer Style to Luminosity. The result looked like this:

Uncle Boy

Step 5: I then made yet another duplicate of my original background image and named it “Background copy 3″. I then changed its Layer Style to Vivid Light and changed its Opacity to 34%.

Uncle Boy

Step 6: At this point, the photo was starting to shape up the way I wanted it. But the purple shirt was really bothering me. It stood out so horrendously that I just had to get rid of it. To do that, I made a fourth duplicate of my original background image. This time I (unimaginatively) named it “shirt”. I then desaturated the layer by going to my Image menu, hovering over Adjustments, and clicking on Desaturate (Image»Adjustments»Desaturate).

Uncle Boy

Step 7: That took care of the purple shirt, but it also got rid of the colors of the rest of the image. So, I needed to get rid of the rest of the desaturated areas and just retain the shirt. To do this, I used the Layer Mask Tool to mask out the area outside the shirt. You don’t have the be overly accurate. You may have noticed that my brush strokes are not exactly perfect. As long as you get rid of visible areas, that should do the trick.

Uncle Boy

Step 8: To add some highlights and textures, I created a fifth duplicate of my background image and named it “Background copy 4″. I then added some noise by going to Filter»Noise»Add Noise. Next, I added a bit of blur by going to Filter» Blur»Motion Blur. For the motion blur, I set my angle to 0 with a distance of 38 pixels. The noised and blurred layer looked like this:

Uncle Boy

Step 9: Using the same layer as in step 8 (noised and blurred), I changed the Layer Style to Overlay. Then, I changed the Layer Opacity to 47%.

Uncle Boy

Step 10: As a final touch, I created a new blank layer and filled it with orange. I used #f8c618 (R=248, G=198, B=24) for this particular image, but feel free to experiment. I then changed the Layer Style to Overlay and set the Opacity to 14%. And voila! Portrait manipulation in photoshop done.

Uncle Boy

Extras: You can even go the extra mile and create new backgrounds for your portrait. In the example below, I simply used the Radial Blur filter and Zoomed in on the blur.

Uncle Boy

Stunning portrait courtesy of BigMakoy, who annoys me no end but still manages to win me over every single time. Grrr.

Yan (a.k.a. Yannie, YanYan) is a young-ish entrepreneur, writer, poet, artist, graphic designer, web geek, lover, friend, daughter, connoisseur, gourmand, amateur chef, coffee addict, control freak, and incessant dreamer. Not necessarily in that order.
© 2008 FubarGenre | All posts by Yan

You may Leave a comment or Subscribe to Comments RSS or Trackback this entry.

34 Responses »

Comments

  1. makoy   on January 19th, 2008 at 4:17 pm:

    Yahoooo!!!! Thanks, Baby!!!

    Now, I can post process my photos without bugging you all the time! :P

    More, more, please!

  2. Yan   on January 19th, 2008 at 4:18 pm:

    bleeh ~ you still owe me! ;)

  3. belkacem   on January 28th, 2008 at 12:18 am:

    :mrgreen: nice randomly tutorila honey

  4. Yan   on January 28th, 2008 at 12:51 am:

    thanks, belkacem! hope it made sense somehowl! :razz:

  5. Bassem   on January 28th, 2008 at 3:08 am:

    In step 4, are u sure u played only with contrast and brightness? I didnt work for me! It looks like u saturated:S

  6. Yan   on January 28th, 2008 at 3:52 pm:

    hi, Bassem. You mean step 3, right? I tweaked the brightness/contrast in step 3 and changed its layer style to Luminosity in step 4. ;)

  7. kirbster   on February 6th, 2008 at 4:48 pm:

    hi yan, it seems that when a make a copy of the background in step 2, i’m getting a copy of the layer. all i get is a black canvas. would appriciate any help. thanks in advance.

  8. Yan   on February 6th, 2008 at 7:01 pm:

    hi, kirbster! Thanks for reading this tutorial. You have to copy your bottom layer - i.e., the layer with your original image, not the one with the black paint. :)

  9. kirbster   on February 7th, 2008 at 3:39 pm:

    thanks. this is an awesome tutorial. i’ll be waiting to see more awesome tutorials from you.

  10. momon   on March 2nd, 2008 at 8:40 am:

    great job here :)

  11. angel   on March 7th, 2008 at 12:15 am:

    hi yan can u help me how can i make the changes in my pic :cry:

  12. angel   on March 7th, 2008 at 12:16 am:

    help me how to download here pls

  13. Mark   on March 20th, 2008 at 3:07 am:

    Thanks for the tutorial. But it seems step 3 doesn’t work. (Image»Adjustments»Brightness/Contrast). Tried to duplicate the original image but adjusting brightness/contrast seems to ruin the whole image including the background. :shock: Would appreciate if you can give the values that you used for the brightness/contrast for step 3. Tried every adjustments on brightness/contrast but it’s nowhere near your example. Thanks in advance!

  14. Yan   on March 21st, 2008 at 12:20 pm:

    hi, angel. what exactly do you want to download? What kind of help do you need? :)

    hi, Mark. Unfortunately, I already flattened the image. Much as I want to retrace my steps, I can’t anymore. But I’ll try to dig it up. Maybe I kept a copy of the raw file somewhere.

    In the meantime, keep playing with the brightness/contrast settings. Even it you don’t achieve something identical, at least you’d have something that resembles the colors in my example.

    Do note that changing the brightness/contrast in a different image may work differently from the image I used.

  15. Tamer   on April 15th, 2008 at 11:06 pm:

    Step 3 not working for me.. I think Bassem is right.. You’re saturating in this step..

  16. Yan   on April 16th, 2008 at 4:15 am:

    I’m pretty sure I didn’t saturate. The output may also depend on the image you’re working on. I was lucky coz my image already had saturated colors in its original raw format. Do try playing with saturation settings and let me know if it works. As I said, the key is to keep playing and experimenting. Good luck! :razz:

  17. Tamer   on April 17th, 2008 at 1:42 am:

    Thanks Yan, great work!
    Keep the talents flowing :-)

  18. ai~   on May 9th, 2008 at 1:03 am:

    You are awesome, Yan :) Hi from a random bloghopper! :) Keep up the great work. God bless.

  19. VANESSA   on June 5th, 2008 at 11:16 pm:

    :?:

  20. VANESSA   on June 5th, 2008 at 11:20 pm:

    VERY NICE THANKS :grin: :lol: :mrgreen: :cool:

  21. shadow   on June 11th, 2008 at 9:14 pm:

    Did you use exposure on step 3? :smile: just askin? Nice tutorial by the way.

  22. CatNat   on July 6th, 2008 at 2:20 am:

    Yan RULES and boys DROOL..

    Yan, you rock girl keep up the great work and thank you for the Bronze skin tone tutorial. I would love to share with you some of the images that I used it in.

    Again Thanks.

  23. Yan   on July 6th, 2008 at 9:09 pm:

    @catnap: lol. I don’t see anyone drooling. but thanks! :mrgreen: I’d love to see your images. Do leave me links to some of your works. ;)

    @shadow: nope, no exposure on step 3. :neutral:

    …and to everyone else who dropped by, Hi.

    :cool:

  24. rodel   on July 12th, 2008 at 11:49 pm:

    cool kaau ang graphics! :shock:

    i know guile personally.. :wink:

  25. nix   on August 1st, 2008 at 1:16 am:

    hi. i have a question :)

    after doing the 3rd duplicate layer [the one with vivid light as blend mode], i get a high contrast image, even when turning the opacity down. the skin tone gets real bad. help please :) thanks!

  26. marisse   on August 1st, 2008 at 2:44 pm:

    amazing!!! i got lots of pictures for you to work on hehehehe
    nice work yan… miss you and makoy mwah mwah mwah! :roll:

  27. jonas   on August 3rd, 2008 at 6:09 pm:

    superb work! :wink: yan, do you have any tricks to share on how to enhance black and white photos?

  28. isteb   on September 4th, 2008 at 4:43 am:

    te, nice work! :shock:

  29. emily oldfield   on September 9th, 2008 at 10:30 pm:

    step 5 didnt work for me at all. went really weird, not like ur example…..so i just skipped that bit…..dont know why it went strange, as i did everything u said. went more dark with hardly any colour….x

  30. jake   on October 8th, 2008 at 11:48 pm:

    hi!

    i really enjoy your tutorial and it’s very helpful… i am still new to photoshop tweaks and post processing.

    yan, i’d like to know few questions…

    1>how do i save my work to include the history of my work for my future reference.
    2>how do i go back to edit example in step8..i would like to change the distance from 38 to lets say 45..

    what i do sometime is go back and redo all over again…sorry its so darn damn question…but i’m telling the truth… wahhh>>>

    thanks in advance

  31. hassona3d   on October 15th, 2008 at 11:23 am:

    nice one thnx for sharing :D

  32. davids   on October 26th, 2008 at 10:46 pm:

    Hey, thanks u are very talented in photoshop. :mrgreen:
    BTW great turtorila THANKS!

  33. nice review   on March 4th, 2009 at 9:18 am:

    Great post, thanks for the info

  34. Gaboss   on March 9th, 2009 at 5:59 am:

    Hey there, nice tut, but it kinda doesn’t work for me…:-( it needs to have almost the same skin tone properties like the picture here…:-( isn’t there any other more complex method??? thanks


Leave a Reply