|
Dear
Friend, Hello
& welcome back to Firewire,
your friendly guide to the exciting world of web-design & web-solutions! Most
of the clients wants search engine friendly web site to be designed very quickly
at low cost. Best solution is to design a professional looking top panel, keeping
other area of page free for text. Designing top panel takes less time compare
to designing a full page, thus saves time & cost. This newsletter covers step-by-step
guide / tutorial to design professional looking fast loading top panel in Photoshop. Click
here
to download the source (.psd) file.
1.
Create new file with Dimensions 779px.
X 210px and
Resolution 72px
in
RGB mode
2.
Save the file as "Toppanel.psd"
1.
Set Foreground color to Hex value #E45D21
2. Set
Background Color to Hex value #AB1000
3. Select Gradient Tool
4. Select Window
>Show Options
& choose Linear Gradient
Icon.
5. Click to edit gradient.
Select Foreground to Background Option.
6. Press Shift
and drag Mouse from bottom to top as shown in image
2.
1. Set
Guides lines. Leave 18
px
margin
2. Select
Rectangular Marquee Tool and
set style "Fixed Size" in
Option bar Width 550px Height 174px
3. Click on Left hand side Guidelines and set Guidelines
to box.
4. Set all Guidelines as shown below.
1.
Select Rounded Rectangle Tool and
choose "Create New Work Path". Set
Radius to 12px.
2.
Create Rectangular path
550px X 174px
3.
Select
Window > Show Paths
4. Click on Third icon in path panel the "Loads
path as a selection"
5.
Insert new layer (Ctrl + Shift + N) and name the rectangle layer as
"Color Fill"
6. Set Foreground color to
#AB1000
7.
Fill Color in new layer. Select Edit
> Fill and
Set Foreground
Color
option.
8.
Insert New Layer for square border and name it as "Border"
9. Select
Edit
> Stroke
10.
Put Width 1px. Color Value as
#7C0E01 and
select Location as Inside
11.
Select Layer
> Duplicate Layer...
12.
Create duplicate of border layer (Layer
> Duplicate Layer...)
and name it as "Feather
Border"
13.
Select
Filter > Blur > Gaussian Blur. Set
Value as 2.4.
Click OK
1.
Create New file. Select File
> New (Ctrl+N)
and name it as "Pattern"
2. Set
Dimensions 10px
X 10px, Resolution
: 72,
Mode : RGB
Color,
Contents as Transparent
3.
Set Foreground color to #B0AFAE
4. Select
Pencil
Tool (B)
and draw "L"
shape.
5.
Select Edit
> Define Pattern
6.
Give Pattern Name and click OK button
7.
Again select "Toppanel.psd"
8.
Create New layer over the "Color Fill" layer and name it as
"Pattern"
9. Go
to
Edit > Fill. Select
Contents as
"pattern "
10.
Select Lines
Pattern and
click ok
11.
Go to Layer
> Group (Ctrl +G) and
group this layer
with Previous layer.
12. In
Layer Panel select Overlay
option
and decrease Opacity
to 50% .
| 
