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

Navigational Header with Chains & Bolts


Start by creating a rectangle of your header size. Fill with dark gray color.

image 1

Take a duplicate of this layer and fill with a lighter shade of gray.

image 2

From filter menu apply noise>> add noise. use settings as shown.

image 3

Change layer mode of this layer to overlay.

image 4

image 5

Draw a small circle on one corner of the header. we'll convert it to a bolt in next steps.

image 6

Double click the layer and apply following layer styles with settings as shown.

image 7

image 8

image 9

Duplicate the bolt and place on all four corners of the header.

image 10

Now we'll create a chain. using text tool type a "0".

image 11

Duplicate the text layer.

image 12

Press ctrl+T to transform. Squeeze the 0 horizontally.

image 13

Overlap the squeezed 0 with original one.

image 14

Double click the 0 layer and apply following layer styles with settings shown.

image 15

Duplicate these layers and place below each other to create a small chain. Rotate a bit to the left.

image 16

Group all layer of the chain in one group. Duplicate the group and rotate to the other side.

image 17

In a new layer create a rectangle using rectangular shape tool.

image 18

Double click the layer and apply following layer styles with settings shown.

image 19

image 20

image 21

Duplicate the rectangle layer. Remove layer style. Fill with a light gray color.

image 22

From top bar enable "subtract from shape" and draw four circles; one at each corner of the duplicated rectangle. This will cut circular shapes from the rectangle edges.

image 23

image 24

Double click the layer and apply following layer styles with settings shown.

image 25

image 26

Create four smaller bolts at the edges of this rectangle like you did for the header corners.

image 27

Select all layers and from layer palette select New group from Selection. This will place all layers we created till now in one group. Make sure you leave background layers and big corner bolts outside the header.

image 28

Using a nice font type page links and place on these rectangles.

image 29

Insert company logo and place it on left of the header.

Navigational Header with Chains & Bolts Tutorial: Final Result



Author's URL: Mr. Smarty
Thank you for voting.
Rate this Materials:
Bad 
1 2 3 4 5 Excellent
print this page subscribe to newsletter subscribe to rss

Advance your current skills or acquire new skills in Photoshop by creating projects using our step-by-step tutorials. More Tutorials: Most Popular Materials | Fresh Materials | TutorialKit New Photoshop Tutorials

Add comments to "Navigational Header with Chains & Bolts"

Only registered users can write comment

No comments yet...