A couple of years ago (yes years) someone asked me how to do a digital
goth
conversion..
I had no idea how to do it digitally or even how to do it in the real
world. Even the overall look escaped me.
Since then the concept has been floating around the back of my mind and
when I had the opportunity I would ask someone who was sporting the
look what needed to be included. As luck would have it I
found two young gals (Holly and Erin) who became my short term goth
consultants.
I've no idea how we started talking about it - after all these were two
gals in their early 20's while I'm a guy who is a few years older than
that.
Holly and Erin gave me some nice guidelines and encouraged me to write
the goth conversion tutorial as soon as possible.
My two friendly "consultants" moved on to other
opportunities and I lost track of them so I was at a bit of a loss
about where to go next. A few weeks back I bumped into a
young
lass named Bethany and she was all decked out in the "look" (a real
life goth conversion) - pale
skin, dark hair with colorful streaks and some piercings.
We got to talking and she was quite helpful. She said she had
tried to modify her look on her computer but could never get it to look
right - her biggest problem was selecting the area she wanted to
modify, especially the hair.
So let's look at the challenges and how to get around the challenges so
you can do a goth conversion with Photoshop Elements.
Fun all around, right?
Just
so you know - this may not be the best tutorial for you if you happen
to be a beginner with Photoshop Elements. If you know layers
and
layer masks and selecting complex areas and layer merging then you
should be fine.
There is also a lot of brush work so a graphics
tablet like the Bamboo or Intuos models are a good choice to make the
goth conversion
work easier and better looking as well.
Goth Conversion
Overall
Guidelines
The
overall look of a
goth conversion seems to be ...
Pale skin (moving toward white).
Dark hair (perhaps with some streaks).
Outlined eyes.
Dark red or black lips, and
Perhaps a piercing or two.
There is nothing in this list that cannot be completed quite easily in
Photoshop Elements.
There are a variety of different methods you can use to do this
conversion which is like most conversions you can do with Photoshop
Elements.
Hue and Saturation
Adjustment Layers
When I first started working on the Goth Conversion my method of choice
was to
select the different aspects of the picture, promote them to their own
layers and then use Hue and Saturation layers to apply the
colorization. This method works and the full instructions
can
be found farther down the page.
Gradient Map
Adjustment Layers
One day it occured to me that there is an easier method to achieve the
same results with the goth conversion and that's to use what
may be the single most useful, yet
under appreciated Adjustment Layer - the Gradient Map Adjustment Layer.
With the Hue and Saturation Adjustment Layer I used extensive
selections and with the Gradient Map I used mostly
Layer Masks
What took hours to complete with the
Selection/Hue
and Saturation technique took less than an hour with Gradient Maps and
Layer Masks and it seems to me that the results are much better!
When
all was said and done it turned out that the two techniques worked best
in combination with some parts of the goth conversion looking better
with Hue and Saturation adjustmest
and other parts of the goth conversion looking better with Gradient Map
adjustments.
This just goes to show that there are many different routes to arrive
at any point with Elements and this goth conversion is no
different. I suggest you try out both techniques to find the
one
you like the best and then keep the other one available for future
editing.
Here's a nice, simple shot that will
be converted and we will start with the Gradient Map technique.
Goth Conversion
Gradient
Map Technique
Are you at all familiar with the Gradient Map Adjustment
layer? If so then you know how useful they are and if you're
not
familiar with them well you're about to discover one of the real gems
in Photoshop Elements!
Gradients vs Gradient Maps
There may be some confusion here as the two sound pretty much the same, but they are not.
A gradient is applied with the Gradient Tool or with a Fill Layer (Gradient) and there are five different types of gradients ...
Linear
Radial
Angle
Reflected
Diamond
They
can be very useful and they have a specific beginning and end point.
These types of gradients do not take the underlying image into
consideration.
The first two types of gradients are pretty much the same other than
one is applied directly to the image and the other is a fill layer.
The Gradient Map is a different thing entirely - it could have been
called "A gradient that maps itself to the lightness values of an image
adjustment layer" but that seems kinda long so Adobe shortented it to
Gradient Map ...
The Gradient Map does take the underlying image
into account as the Gradient "MAPS" itself to the lightness values in
the image. So a black to white Gradient Map will apply black to
the darkest areas of an image and white to the lightest with varying
shades of gray wherever it is needed.
A Gradient Map Adjustment Layer will create a fabulous Goth conversion
in a few simple
steps.
The steps are ...
Duplicate the Background Layer just to have a good
copy available if you somehow mess up.
Select the Background Copy and add a Gradient Map
Adjustment Layer - Layer
> New Adjustment Layer > Gradient Map ...
or simply click on the little Adjustment Layer icon (it looks like a
Yin/Yang symbol) at the bottom of the Layers palette and select
Gradient Map. Make sure the Gradient is Black to
White
Adjust the Gradient to taste keeping your eye on the
area you are adjusting while ignoring the rest of the image.
Invert the Layer Mask, grab the brush tool and set
the
foreground and background colors to black and white and paint the
gradient back in where you want it to be.
When you're happy with the results then Merge Down
the
Gradient Map to the Background copy and start over again with the next
part you want to work.
Those are the steps so lets see how they work in real editing ...
The Face
Duplicate
the Background layer on the off chance that you mess up somehow. If
you're not sure how to do Step 1 then this tutorial may be a bit
beyond your skill level.
Step 2 - New
Gradient Map
Activate
the Background Copy layer and then add a Gradient Map Adjustment layer.
If your Gradient Map layer is set to black and white that's
what
you want! If it's not then the next step will set that right.
This is what the layers palette will look like - simple, huh?
This Gradient Map will turn the dark areas of the image black and the
light areas white with a complete range of gray tones between them.
Don't get lost admiring the beautiful black and white image that
appears when you add the Gradient Map!
Make sure the Layer Mask is selected (like this one with the little
white box around the Layer Mask).
Step
3 - Adjust the
Gradient
When the new Gradient Map Adjustment Layer is added it includes the
Adjustment panel which is quite boring in its simplicity.
Here's the panel - the gradient is what will be applied and if it is
not the one you want (black to white) then simply click on the gradient
to open up the Gradient
Editor.
Now you can select the correct gradient.
Put a check mark in the Dither box to prevent any banding that may
occur.
If you are starting on the skin then take a look at the image to see
how the skin looks.
Being the lightest part of the image (in
color) it should also be the lightest part with the gradient.
If it is too dark or too white (this is all your choice, you
know) then click on the gradient to open up the Gradient Editor.
The adjustments are done with this part of the editor ...
Click on either the black stop at the bottom left end of the gradient
or the white stop at the bottom right end of the gradient - this will
cause the little diamond in the middle of the gradient to appear.
To make everything darker grab the little diamond and move it to the
right along the gradient and to make things lighter grab the little
diamond and move it to the left along the gradient. It's a
nice simple adjustment.
If you goof and somehow add a new stop on the bottom of the gradient
just grab it and drag it down - it will disappear.
Here is how my first adjustment in the goth conversion looks with this image ...
That's a nice black and white, isn't it? Anyway I
figured that was a good place to start with the skin so now onto the
next step, which is ...
Step 4 -
Invert the Layer
Mask
By
default, Elements applies the adjustment from the Adjustment Layer so
you can see how it looks. In this technique we want to get
rid of
the adjustment and then paint it back in where we want it to be.
To do that first make sure the Layer Mask is highlighted and then
invert it by pressing Ctrl-I (Windows) or Cmd-I (Mac).
The
adjustment will disappear (the picture is its normal old colorful self
again) and the layer mask will turn from white to black.
Make
sure that white is the foreground color, grab the brush tool and very
carefull start painting around the face - it's best to be using a
Bamboo or Intuos tablet here just because they are so much more
accurate than a mouse or a trackpad.
The
brush should have a soft edge to prevent hard lines from
showing.
Now it's time to carefully paint in the face avoiding the lips and the
eyes - this is how the goth conversion looks after painting with white. It is starting to get "the look" ....
This is a good time to look at the eyebrows and eyelashes because in the goth conversion they should be nice and dark.
Select the Background Copy, zoom in on the eyebrows, select the burn
tool with these settings (soft edge brush that changes opacity with
pressure, Range: Shadows, Exposure - very low - I used 5%)
and
burn in first one eyebrow and then the other.
It's not a good idea to rush this part by increasing the Exposure - go
at it slowly so that the lashes and brows slowly become darker.
It's also a good idea at this point to save your work as a .psd file
(so
the layers will be saved intact).
Step
5 - Merge Down
When you're happy with the look up to now select the Gradient Map layer
and Merge it to the Background copy - Layer
> Merge Down or simply Ctrl-E
(Windows) or Cmd-E
(Mac). The two layers will combine into one layer with all
the
adjustments you just completed.
Now it's time to move onto the next step - do it all over again,
starting at step 2, for the hair.
Hair
Select the Background copy layer and add a second Gradient Map
Adjustment Layer.
Put a check mark in the Dither box, click on the Gradient and make sure
the Black,White gradient is selected.
Click on either the Black or White bottom stop to activate the Color
Midpoint, click on it and drag it back and forth while watching the
hair. Don't be concerned about anything else but the hair as
it
will be painted back in while the rest is ignored.
Find that one place where the hair is a nice black color and still
retains some details. When you're satisfied then ...
Click OK.
Ctrl-I or Cmd-I to invert the Layer mask.
Paint the hair back in with white using a
nice soft
edge brush.
It
is likely you'll get some hard edges where the hair and the skin meet.
They can be eliminated with the Smudge Tool on the
Gradient Map
layer. I set my Smudge tool to Size - 20 pixels, Mode - Normal,
Strength - 80%
and yours may need some experimentation to get it right. Now
carefully paint around the areas wherever there are hard edges
Once again save your goth conversion work and make sure there is a check mark in Save
as a copy.
As before, go to Layer
> Merge
Down.
Lips
The exact same procedure works with the lips as well ...
Add a new Gradient Map Adjustment layer and put a
check
mark in Dither and in Reverse (if everything looks like a black and
white negative).
Click the Gradient and when the editor comes up make
sure
the black to white gradient is selected and click one of the lower
stops to bing up the mid-point slider.
Move the mid-point towards the white end of the
gradient to
darken everything paying apecial attention to the lips.
Press Ctrl-I (Windows) or Cmd-I (Mac) to remove the
effect
of the adjustment layer, zoom in on the lips, select the brush tool,
set the foreground color to white and paint the lips back in - they
will turn a nice black. Keep at it until you are satisfied
with
your fabulous goth conversion.
I followed my own instructions and this is how the goth conversion
looks with three Gradient Map layers ...
Piercings, Hair
Tint, Darken and
Outline Eyes
Adding some piercings and a bit of hair tint are an important part of the goth conversion and they are generally straight
forward if you understand a few basic features of Photoshop Elements.
The piercing jewellry was found by doing an internet search for the
term piercing jewellry and if you can add a necklace then goth jewelly
will yield some amazing pieces.
A tad of hair tint can be added using the same Gradient Map technique
used up to this point but very sparingly.
In addition, I didn't feel the face was light enough so I added a Soft
Light layer filled with 50% gray, made white the foreground color,
lowered the Opacity of the brush tool and dodged the face just a bit
(to increase the contrast between the face and the hair).
In most of the Goth pictures I've collected, the area directly below the
eyes is darkend with makeup - this was achieved using the Soft Light
layer (big, soft brush at very low apacity).
After some additional work on the goth conversion here's where things
stand using the Gradient Map technique ...
An alternate method is to use Hue
and Saturation Adjustment layers on selections of the important parts
of the face and hair for the goth conversion.
This will begin with a selection which we'll look at first.
Goth Conversion
Selections
Babbling and Blabbing about Selections
From my point of view the best way to select complex areas with
Photoshop Elements is to use
the Selection Brush Tool and promote the different selections to their
own layers.
The first suggestion is to use the Selection Brush Tool to make your
selections and the second suggestion is to use a Wacom tablet (Bamboo
or Intuos) to do the selection.
You can, of course, use a mouse or a track pad but it's unlikely the
quality of the selections made will even be close to what you can
achieve with a pen and tablet.
This means the different elements of the conversion can be modified.
After looking at this image I decided to separate the following areas
into their own layers ...
Face.
Around the eyes.
Around the lips
Hair
The choice to move the areas around the eyes and around the mouth to
their own layer is personal decision.
The
reason I decided to go that way is because I have a terrible time
making selections that require horizontal motion but a vertical
movement is no problem at all. Even with my Wacom pen the
paint
strokes or selections I make using a horizontal motion are really,
really bad
See - the horizontal motion is not at all accurate while the vertical
motion is nice and tight with good edges and to do that some changes
need to be made.
Now if you are great both horizontally and vertically with the
Selection Brush tool or you prefer to work with another selection
method then forget all of the following and move onto the modifications
section further down the page.
What
I did was work away on the image without getting myself up close and
personal with horizontal edges around the eyes and the mouth.
After getting this far, I clicked on one of the other selection tools
to get the marching ants, inverted the selection (Shift-Ctrl-I or
Cmd-Shift-I) and moved it to a new layer by pressing Ctrl-J (Windows)
or Cmd-J (Mac).
The file was then saved as a Photoshop file (.psd) because it saves the
files with the layers intact. I also make sure that the "Save
in
Version Set with Original" is checked so that each iteration of the
file is saved with a new name.
"Why go to all this trouble" you may be asking
because the
obvious choice would be to get as much done as possible and then rotate
the image to make it easier to finish the overall selection.
What happens when the image is rotated is that the selection made up to
this point disappears - it just kind of goes away so the whole thing
has to be started over with the inherent horizontal brush motion
challenges there for me once again.
This was quite annoying so I left the project for a day to let my brain
mull it over in the background. As I was driving along today
the
answer came to me and this is it ...
Make the first selection nice and loose (like the image here) and then
save it as described ...
Click on one of the other selection tools.
Invert the Selection.
Promote this selection to a new layer.
Save the image with all of the layers intact as a
.psd file, and then ...
Rotate the Image.
Now you can finish the face part of the project.
Zoom in on one eye, do another selection, go to the
other eye and do it again.
Get out of the Selection Brush Tool by clicking on
any of
the other selection tools, Invert the Selections and promote them to a
new layer. Save as a .PSD file - now you've got the
Background,
the face and the eyes on their own layers.
Do the same thing for the mouth, leaving the lips and
the teeth out of the selection. Get
out of the Selection Brush Tool by clicking on any of the other
selection tools, Invert the Selections and promote it to a new
layer. Save as a .PSD file - now you've got the Background,
the
face, the eyes and the area close to the mouth on their own layers.
OK - so why go through all of this because it seems like a waste of
time and somewhat annoying?
Well - it may be over the top for you but for me it is really the only
way I can get a nice selection when a horizontal area is involved and
it is something I've done for most of the tutorials on this site - this
is just the first time I've admitted it and demonstrated one way to get
around this kind of problem.
Now it is a simple matter of Merging the mouth layer into the eyes
layer and then the new layer into the face layer. Do this by
going to the top layer and press Ctrl-E (Windows) or Cmd-E (Mac).
One more layer to add and that is to put the lips on their own layer
for some additional adjustments.
Here's the layers palette with the layers from top to bottom being ...
Lips.
Hair.
Face.
Background Copy.
Background.
This gives me nice edges with no holes anywhere in the face
layer.
The only thing to do now is to check the outside edges of the face
layer to
make sure that it does, in fact, conform to the outline of the
skin. If there is a problem then grab the eraser, give it a nice
soft edge and slowly erase the areas that need fixing.
Now do something similar to the hair (paint the hair with the Selection
Brush Tool, select another selection tool, invert the selection and
then promote the hair to its own layer) - by now you know what I'm
doing this for.
The advantage of all this work is that the important bits are now
isolated on their own layers and they can be modified and adjusted
independent of the rest of the image as you complete the goth conversion.
Having the important bits on their own layer is useful whether you are
doing a goth conversion, emo conversion, making your friend or yourself
into a vampire or even a glamor touch up.
As the saying goes - "the
devil is in the details" and moving the important parts
gives you access to the details.
Goth Conversion
Adjustments
Now that the heavy lifting is over and done with in this portion of the goth conversion, it's time to have
some
fun with these different layers. For the most part, the
following
adjustments were completed with a Hue and Saturation layer over each
selection, however you can also try out a Gradient Map Adjustment layer
- this worked particularly well with the Lips.
Face
Layer
From
my observations and from the comments of my friendly goth conversion
"consultants" the first order of business is to make the skin
much lighter.
This can be done using a variety of different techniques.
A couple of features need some additional work ...
In the first place the skin needs to be lightened towards a white cast,
and
The eyebrows and eyelashes could stand to be darker to conform with the
overall goth look, and finally ...
The area around the eyes may need some work as a bit of the color in
the eye has been picked up in the selection.
Lighten
The Skin
The first thing I did was add a Hue and Saturation adjustment layer
immediately above the skin layer and then clip the Hue and Saturation
adjustment layer to the skin layer.
There are two ways to clip an adjustment layer to - one is to got to Layers > Create Clipping
Mask ...
(Ctrl+G) and the second is to press and hold the Alt key then hover the
cursor immediately below the Hue and Saturation adjustment layer until
it changes into a little black thingy and then left click.
In either case the Adjustment Layer will jump a bit to the right and at
that point any adjustment applied to the Hue and Saturation layer will
only be applied to the skin layer.
Now simply desaturate the skin layer just a bit by moving the
Saturation slider slightly to the left.
Now add a Levels Adjustment Layer above the Hue and Saturation
adjustment layer and clip it to the Hue and Saturation adjustment layer
( Layers > Create
Clipping Mask ... (Ctrl+G). Firstly - set the Layer Blend Mode to Screen
by dropping down the little menu at the top of the layers palette, and
secondly adjust the sliders to lighten the over look of the face layer
to taste.
Here's the layers palette and the skin layer after these adjustments
...
Layers Levels
layer set to Screen Blend
Skin
layer lightened
And here's our project so far ...
Eyebrows
and
Eyelashes
Typically it seems that goth eyebrows and eyelashes are much darker
than they would normally be for any given person.
To darken the eyebrows and eyelashes I used the Burn Tool set at a very
small size, shadows and low exposure.
Eyebrow as shot
Eyebrow and Eyelashes
Burned in
This created a large difference - as stated earlier - the devil is in
the details ... The lighter skin contrasted with the darker
eyebrows and eyelashes make the face more dramatic.
Now normally I would use a soft light layer filled with 50% gray and
paint black over the eyebrow which is probably the best dodge and burn
technique. The problem with this method is that the burn
tends to
darken the skin under the eyebrow as well - unless - the brush is set
to Overlay.
This works well because it darkens the eyebrows and
eyelashes (the dark area) and leaves the light areas alone.
So Far ...
Here's our goth conversion to this
point. It's looking OK with a couple of problems with the
worst
being the sharp and somewhat uneven lip line which is a function of my
ability to draw a decent horizontal line.
The Hair
The typical goth conversion seems to have dark to black hair no matter what the
original hair color. Some have added a tint or
streak to
the hair
which is a relatively easy thing to do after the hard work is done and
the hard work is darkening the hair.
Here are the two layers involved in darkening the hair - the bottom
layer is the selection promoted in the first series of steps with the
Hue and Saturation Adjustment layer directly above the hair layer.
As
you can see the Hue and Saturation Adjustment layer is clipped to the
Hair layer by selecting the Hue and Saturation layer and then Layer > Create Clipping
Mask ...
so that only the hair is modified when the adjustment is done.
Here's the Hue and Saturation
Adjustment layer
adjustment panel to darken the hair.
Every image will be different so don't take these adjustments as the
perfect ones. It will likely take a bit of messing around to
get
the hair exactly the way you want it to look.
You can also play around with either the opacity of the Adjustment
Layer and/ or the Blend Mode to the Adjustment Layer.
Here's the image as it stands at this point ...
Lips
Back
to spinning the image ninety degrees, zooming in really close and using
the Selection Brush Tool with a soft edge brush to make a selection of
the lips.
When the selection is complete and inverted then the lips can be
promoted to their own layer and than moved to the top of the layers
stack. The selection has a much softer look and when they are
at
the top of the stack and this is how thing look now ...
This selection sure makes the overall appearance look better ...
The next thing to do with the lips in the goth conversion is
to recolor them and they can be any color you want because they're on
their own layer at the top of the layer stack. Add a Hue and
Saturation Adjustment Layer or a Levels Adjustment Layer above the Lips
layer and clip whatever you have chosen to the lips layer (as we did
earlier).
Now have some fun with this new layer! There are lots of
thing you can modify, such as ....
Modify the black, mid-point and white sliders with a
Levels Adjustment Layer.
Try a different Layer Blend Mode - multiply will
darken things nicely.
Modify one or all of the sliders (Hue, Saturation
and/or Lightness) with a Hue And Saturation Adjustment layer.
Try out a different Blend Mode with the Hue And
Saturation Adjustment layer.
Not surprisingly the lips seem to look much
better
(at least to me) when they are darkened with a Gradient Map Adjustment
layer rather than a Hue and Saturation |Adjustment layer.
Hue and Saturation Layer
The lips are flat and somewhat lifeless.
Gradient Map Layer
Much more life and sparke with the Gradient
Map
layer.
Embellishments
The
embellishments include the goth conversion piercings and the dark outliines around the
eyes. Be as creative or as conservative as you like (although
with a goth conversion it seems likely that being creative will
prevail).
Like every Photoshop Elements technique, there are a variety of
different routes to get where you want to be. The two goth
conversion techniques offered here both work well but for me the
Gradient Map techniqe is clearly superior.
Summary
There you go - two different methods of taking a normal portrait image
and doing a goth conversion. Both methods work well and perhaps
combining the two is the best way to work.
I admit to not being an expert on the look and if you have any
suggestions or recommendations please let me know. This page is a
good start and just maybe a bit of collaboration with some other
experts would be very useful.
And just for your viewing pleasure here is the final image ...
Comments and Suggestions
Goth Conversion Suggestions and Comments
This tutorial was a lot of fun - both researching and completing.
A lot of the time I felt overwhelmed by the subject matter but did manage to muddle through.
If you've any comments or suggestions about the look or the technique please use this section to let me know.