Casting Shadow

Welcome to the Casting Shadow tutorial. This tutorial was designed to teach you how to create the
illusion of depth and perspective by altering the shape of your shadows. If you need help with it, or find it
confusing, don't hesitate to e-mail me, the information is at the bottom of the page.
Before we begin let's take a look at what a casted shadow
actually is. A lot of people could confuse this tutorial for your average drop shadow tutorial, but it's not,
it's actually very different. A drop shadow allows the viewer to recognize that the text or object is elevated
from the surface as shown in the image to the right, hence the name drop shadow, meaning it's a hovering
above the surface.
Casted shadows are shadows the you see everyday, the shadow that
your monitor is casting against the wall right now, or the shadow that follows you on a sunny day. In other
words casted shadow are basically a perspective shadow, which is what people sometimes call them.
Casted/Perspective shadows depend on two things;
1. The shape of the object creating the shadow, this will determine the shape of the shadow
2. The perspective/direction in which the light is shining on it, this will determine how the shadow is
distorted and how long/narrow the shadow will be.
Casting Shadows in Photoshop 5/5.5
1
Before you even think about creating a shadow, you
need to find out where the light will be coming from
and how the object or text will be sitting on that
surface. I will be using the surface to the left along
with text. Since the light is coming from the bottom
left corner, I'll make things easy and just face my text
toward the light as you'll see later on.
If you want to use the same background I used, you
can download it here.
If you don't want to use it, feel free to make your own
using the methods I used; the gradient tool with a
light Noise filter added to create the illusion of an
actual surface.
2
Create your text in the middle of the canvas. Make
sure that your text isn't too big because we are going
to stretch, skew, and distort the crap out of it to get
the look we want, so allow room. Choose a font that
is thick or the same thickness throughout the whole of
the letters, fonts with fat ends and thin curves tends to
become unrecognizable when they're on a slant, the
result is they are hard to read. I chose Arial with
Faux Bold checked.
3
Render your type layer by right
clicking on the type icon ( ) in the Layers palette and
choosing Render Layer. This allows you to apply a
lot more of Photoshop's commands and filters to your
text, which is what we will need to do.
With the type layer selected choose
Edit>Transform>Distort from the main menu, you
could also hold down Ctrl + T, right-click insidethe
box, and choose Distortfrom the menu as shown to
the left. Once youhave your bounding box, start
moving the handles and placing them where you
Casting Shadows in Photoshop 5/5.5
want,make sure your text doesn't look completely
skewed or unrealistic.
4
Right-click on your new type layer
and choose Effectsfrom the menu. Add a
drop-shadow, this should be the default. (you should
belooking at it straight away) It doesn't matter how
you apply your drop-shadowbecause we will be
changing it dramatically later on, just make sure it's
not tofar away from the text.
You can use the image to the left for reference.
5
Once you're happy with your
shadow, right-click on the effects icon ( ) at the
right of the layer and choose Create Layer from the
menu. (as shown to the right) Doing this separates the
shadow to another layer so we can modify it.
Casting Shadows in Photoshop 5/5.5
6
Select the shadow layer, choose
Edit>Transform>Distort from the main menu, grab
the handles an re-arrange them so that they fall behind
the letters. Here, I grabbed the top middle handle and
pulled it towards the top-right of the canvas, I then
adjusted the other handles accordingly. Make sure
that the letters shadow ends' match up exactly with
the bottom of the letters, an example is shown to the
left.
You can now blur your shadow layer to make it look
a little more realistic. Choose Filter>Blur>Gaussian
Blur and input a setting between 2-6 pixels.
7
Now we have a casted shadow on very flat text, to
add depth to the text, bevel it! Right-click on the text
layer in the Layers palette, and choose Effects from
the menu. Un-check Apply from the Drop Shadow
menu, choose Bevel and Embossfrom the pull-down
menu, check Apply and use the following settings;
(only use these settings if you are following along
using my example)
Style: Inner Bevel
Angle: -126
Depth: 20
Blur: 3
Inner Bevel was chosen because it looks more
realistic being as it doesn't blend the bevel in with it's
surroundings, the angle was set facing the same
direction from which the light is coming from, a large
depth was added to make the letters look more three
dimensional, and a low blurring was set to keep the
hard edge of the text but to eliminate the "jaggy-ness"
Once you've finished your image should look
something like the image to the left. Congratulations
you're done!
Casting Shadows in Photoshop 5/5.5
Discussion
When creating casted shadows remember the rules discussed above and everything should work out fine.
A great to practice your newly harnessed skill is to find pictures and place text in it and adding a shadow. I
find that landscapes, architecture and monumental landmarks are the best photos simply because they offer
lots of surfaces and wide open space to slip your text right in there. Some example of this are shown
below.If you have any questions, or there are any steps that I can further elaborate on, don't hesitate to
e-mail me using the information below.
E-mail: [email protected]
Examples
The same method was used to create the word
Josie on the bed sheets as was used in the
tutorial above. Incorporating text into images
is done a lot for billboards, posters, CD
covers, etc. See if you can spot it...
Casting Shadows in Photoshop 5/5.5
Dan Caylor
http://www.thinkdan.com
Email: [email protected]
Copyright 2000, 2001 Dan Caylor
Casting Shadows in Photoshop 5/5.5