Grasp the chance to enhance your site with the best fitting layout, including elements like buttons, headers and logos.  Home Photoshop Web Layout Design Studio Header

Design Studio Header


1. First thing we need to do is create a new document. I started with a size of 1000x216.

image 1

2. What we want to do next is to add a gradient to our background layer. To do so, right click your background layer and then input the following blending options

image 2

image 3

3. Next we want to use our rectangle marquee tool to make a selection similar to the following and fill it with #FFFFFF

image 4

4. Now input the following blending options

image 5

image 6

image 7

5. You should have something that looks similar to this

image 8

6. Next, we want to go ahead and add some text for our links. I used Helvetica with all caps

image 9

7. Now we want to show what our active link will look like. To do so use your rectangle marquee tool again to make a selection similar to the following:

image 10

8. Choose Edit>Clear and you should have something that looks like this:

image 11

9. Next we want to add a little bar across the top. So use your rectangle marquee tool to make a selection similar to this and fill it with #FFFFFF

image 12

10. Now input the following blending options into this layer

image 13

image 14

11. It will look something like this

image 15

12. Now all I did was add some text and a simple logo with a custom shape from default photoshop shapes and this is what I came up with:

image 16

13. You can take it one more step and add some round vector shapes. I used some halftone patterns from one of the GoMedia Arsenal packs

Design Studio Header



Author's URL: PSDVIBE
Final results of our readers
New!
Passed through all the steps? Share your result!
Your result will be premoderated.
Please make sure you choose the right image.
 
 



Captcha

*Required fileds
Grasp the chance to enhance your site with the best fitting layout, including elements like buttons, headers and logos. More Web Layout Tutorials: Featured Materials | Fresh Materials | TutorialKit New Photoshop Tutorials

No comments yet...
Add comments to "Design Studio Header"

Captcha