Start up PhotoShop and fill
in the File menu New dialog box as follows.
We will create a command button for use on our web pages.
I
tried this with both White and Transparent settings for the Contents and either
one seems to work okay.
After
you have your new Button image, maximize the document window (not the
application window for PhotoShop) and then use Ctrl++ key chord a few times to
increase the zoom in on the object to about %200.
Click
on the Foreground color button and then select a light green or light blue or
light purple for the button color.
Hold
down the Alt key and press the Back Space key to fill the canvas with the
Foreground color.
Click on the Channels tab
(it is next to the Layers tab) to open up the Channels palette. Click on the new channel button, which looks
like a piece of paper being torn out of a tablet. The new channel icon is just to the left of the trash barrel
icon. After you finish, the Channels
palette will look like this:
Click
on the Default Foreground and Background Colors (or use the shortcut and type
D). Notice the colors are
reversed. White or a light gray appears
as the Foreground and Black appears as the Background color.
Use
Alt + Back Space key (key chord) to fill the new #4 Channel with the Foreground
color.
Select
menu, All command to select the entire 100-pixel by 50-pixel channel. Alt, S, A keystroke sequence invokes the
Select All command. Notice that Ctrl +
A key chord is the keyboard shortcut for the same command.
Click on the Foreground color
and from the Color Picker, choose a light gray color. Click OK to set that color.
Then from the Edit menu Stroke dialog box (Alt, E, S key sequence
invokes the dialog box), click OK after setting the arguments to look like the
following:
Repeat
the above process a 2nd time, but choose a darker gray and choose 6
pixels instead of 8 pixels for the Width setting.
Repeat
a 3rd time, with a darker gray yet and a Width setting of 4 pixels.
Repeat
a 4th and final time, with a dark gray that is almost black and
Width setting of 2 pixels.
At this point, you should see something that looks like the following on your canvas:
Notice
there are four different bands of gray that make up the channel. If we were to leave them like this, our new
custom 3-D command button wouldn’t look polished. Applying a Gaussian Blur filter to the Channel is the perfect
solution.
Filter
menu, Blur, Gaussian Blue and set the Radius to 1.0 Pixel. (Each gray unit is only 2 pixels wide, so a
radius of 1 pixel is plenty of smoothing and blending).
Press
Ctrl + D to deselect (turn off the marching ants). The Deselect command is on the Select menu.
Click
on the Layers tab to return to the Layers palette. Click on the Background layer name (Layer 1) to make it
active. Your original color shows up
again.
Pull down the Filter
menu. Use the Filter menu, Render
command, Lighting Effects subcommand.
Here is what your dialog box settings should be like just before you
click OK.
Using
the Text tool, which can be invoked by typing the letter T, click on top of
your command button. Type in your First
name of nickname. Click OK. If you do not like the font or the size,
Edit menu Undo and try again. The text
will be in a separate Layer, so you can also throw it away by dragging that
layer to the
Trash
Barrel icon of the Layers and Channels palette.
File menu, Export, GIF89a
Export command. Save the gif file as myButton and let PhotoShop add the .gif
suffix, making its name myButton.gif. Save on your Z: drive home directory, inside
your web folder.