Creating Website Buttons Using Photoshop 5.5 and Earlier
There are many techniques
used for creating website interface elements and
dozens of programs available to simplify the
process.
The problem is many people are still using (or
will use) older copies of Photoshop which means
they will face challenges when it comes to creating
rounded rectangles (the shape of your typical website
button). It wasn't until Photoshop 6.0 that
a tool for creating rounded rectangles was introduced.
This "How to" focuses
on creating website
buttons with Photoshop 5.5
and earlier using one method I discovered a few
years
ago. Here I'm
going
to attempt to make this tutorial as visual as possible
with screenshots for
users unfamiliar with all the
menu options available within Photoshop. Please note: This "How to" was
actually created using Photoshop 7 so some menu
options I refer to may not appear (in examples)
exactly as they do in very early versions of Photoshop.
Step 1 - Create a new Photoshop document
for your web button. You will want some
good working space so it should be larger than
your actual website
button will end up being. Choose "FILE" and "NEW" to
create a new document. Specify size as
200 x 80. Think of this blank image as your canvas.
The website button you will be creating will be
relatively smaller within this working area. You
can go ahead and save this as "Web
Button"
or similar
so you don't lose any changes. It's recommended
you "SAVE" between steps.
Step
1 - Create a new Photoshop document for your
website button
 |
|
Step 2 - Create
a new Photoshop Layer. If you do not see your layers go
to the very top menu and choose "WINDOW" and
make sure
"LAYERS" is
selected with a check mark. You should see background with
white representing the default bottom layer. This bottom
layer will stay as it is. You simply need to create a new
one that will be stacked on top of it. The small arrow
that looks like this  is
what you need to click on to bring the drop-down menu options.
Select "NEW LAYER" and call it Left
Curve.
Step
2 - Create a new Photoshop layer
When
you are done you should see two layers. Make
sure the new layer you have created (Left
Curve) is highlighted blue
like the example below. It will need to be
selected for step 3.
 |
|
|