Step 1:
Open up your forum skin .psd, or a fresh document. I’ll be working in a separate document, for the sake of smaller images. 640×280 pixel should be enough room.
Open up your forum skin .psd, or a fresh document. I’ll be working in a separate document, for the sake of smaller images. 640×280 pixel should be enough room.
Step 2:
Set your foreground color to #363636, and grab the rounded rectangle tool, with a radius of 5 pixels. Create a rounded rectangle 640×55 pixels in size. Delete the bottom 5 pixels so only the top corners are rounded.
Set your foreground color to #363636, and grab the rounded rectangle tool, with a radius of 5 pixels. Create a rounded rectangle 640×55 pixels in size. Delete the bottom 5 pixels so only the top corners are rounded.
Step 3:
Open up blending options, on this layer, and apply a white to transparent gradient overlay, with the following settings.
Open up blending options, on this layer, and apply a white to transparent gradient overlay, with the following settings.
Step 4:
Create a new layer (ctrl+shift+n), set your foreground color to #51cdd1, and grab the polygon tool. Now set the number of sides to 3 and make a triangle pointing down. Place it on the right side of our category header.
Create a new layer (ctrl+shift+n), set your foreground color to #51cdd1, and grab the polygon tool. Now set the number of sides to 3 and make a triangle pointing down. Place it on the right side of our category header.
Step 5:
Apply gradient overlay just like in step 3 to this layer.
Apply gradient overlay just like in step 3 to this layer.
Step 6:
Create another new layer. Now set your foreground color to white, and make another small triangle, this time pointing right. Place it on the left side like I did.
Create another new layer. Now set your foreground color to white, and make another small triangle, this time pointing right. Place it on the left side like I did.
Step 7:
Create a new layer and grab the rectangle tool. Set your foreground color to #d6d6d6 and make a rectangle right below the last one 30 pixels in height.
Create a new layer and grab the rectangle tool. Set your foreground color to #d6d6d6 and make a rectangle right below the last one 30 pixels in height.
Step 8:
Open up blending options and bevel and emboss without he following settings.
Open up blending options and bevel and emboss without he following settings.
Step 9:
Create a new layer and make a selection of the light grey rectangle (ctrl+click on the layers pallet). Move the selection down 1 pixel (press the down arrow key once). Now grab a white 50 pixel soft brush and lightly brush across the selection.
Create a new layer and make a selection of the light grey rectangle (ctrl+click on the layers pallet). Move the selection down 1 pixel (press the down arrow key once). Now grab a white 50 pixel soft brush and lightly brush across the selection.
Step 10:
Though all current layers in a folder labeled “Forum Head”. Now create white boxes to hold our text, well need one for the post icon, our forum/description, thread count, and post count. Create each one on a separate layer (so we can move them), then merge theme (ctrl+j). All sizes are labeled in the picture below.
Though all current layers in a folder labeled “Forum Head”. Now create white boxes to hold our text, well need one for the post icon, our forum/description, thread count, and post count. Create each one on a separate layer (so we can move them), then merge theme (ctrl+j). All sizes are labeled in the picture below.
Step 11:
On the boxes layer apply blending bevel and emboss with the following settings.
On the boxes layer apply blending bevel and emboss with the following settings.
Step 12:
Make a selection of the boxes. Then contract the selection by 1 pixel (select>modify>contract). Grab a 150 pixel soft brush #e3e3e3, and lightly brush the bottom of the selection.
Make a selection of the boxes. Then contract the selection by 1 pixel (select>modify>contract). Grab a 150 pixel soft brush #e3e3e3, and lightly brush the bottom of the selection.
Step 13:
Now lets create a new post icon. I used the techniques shown in “Stylish Forum Buttons”. All elements are labeled below.
Now lets create a new post icon. I used the techniques shown in “Stylish Forum Buttons”. All elements are labeled below.
Step 14:
Now add text like shown below. Though all these layers into a folder labeled “Forum1″.
Now add text like shown below. Though all these layers into a folder labeled “Forum1″.
Step 15:
Duplicate the “Forum1″ folder and drag it down below the original with a 1pixel gab. You can change the text to make it look more legit if you want.
Duplicate the “Forum1″ folder and drag it down below the original with a 1pixel gab. You can change the text to make it look more legit if you want.
Step 16:
Now lets make the new post icon and old post icon. To do this change the “N” to an “O” and change it to grey. To do this press “ctrl+u” and set the saturation to -100 and the lightness to 30.
Now lets make the new post icon and old post icon. To do this change the “N” to an “O” and change it to grey. To do this press “ctrl+u” and set the saturation to -100 and the lightness to 30.
Step 17:
Now all thats left to do is add a category name to the head. Use the font Helvetica, the size 16pt, and the color white. Also apply a 1pixel black drop shadow. Your done! Here’s how it should look.
Now all thats left to do is add a category name to the head. Use the font Helvetica, the size 16pt, and the color white. Also apply a 1pixel black drop shadow. Your done! Here’s how it should look.
Download .PSD Source File
Please login in order to unlock this section of the post.
Not registered? Click the sign up banner at the top of the sidebar
Not registered? Click the sign up banner at the top of the sidebar
No comments:
Post a Comment