Her

Home Photoshop Tutorials Web Layout High Tech Layout with Grunge Style

High Tech Layout with Grunge Style

Author: amitk Author's URL: www.talk-mania.com More by this author

Please open a new document in photoshop

Size : 760 x 770 pixels
background color: #eae8d1

Select Pen Tool and be sure you have the following settings:

image 1

The create a simple path like in the next image ( hold down the Shift Key )

image 2
Click to enlarge

Then change the foreground color to a brown color : #4b493c

And with Pen tool create another path like in the following image ( be sure you place this path under the white shape )

image 3
Click to enlarge

Now we will create a new patter. Please create another document

Size should be 7x7 pixels.

Zoom this document to 1600 %

image 4

Select Pencil Tool, ( brush size 1 pixel ) and make the following drawing

image 5

Then go to Edit > define pattern

Select a name for your pattern and click Ok

Now we will come back on our layout. select the brown shape layer , and add the following layer styles

image 6

image 7

This is the result

image 8

Now we will create another pattern. ( all this patterns you can download from VIP area )

For this second pattern you need to create a another document

Size 20x20 pixels

Zoom the document to 1600 % and with pencil tool create the following drawing

image 9

Then select the white shape and add the following layer styles

image 10

image 11

This is my result

image 12

Now Select pen tool one more time , and create another paths

image 13

Then with the same tool create also a vertical shape like in the following image

image 14

Now we will create some buttons. for this we need to download the following set of brushes from www.free-photoshop.com

Here is the link: link

Please note that you need to register in order to see this set of tech brushes

Then load this brushes in photoshop,

Create a new layer ( press Ctrl+Shift+Alt+N )

On this layer add as many details with this set of brushes

This is my result

image 15
Click to enlarge

Then in the same pack of brushes you can find also some vector circles. please add a few circles on top of your layout. we will use this vector circles like buttons

image 16
Click to enlarge

Then add some text on your layout

image 17
Click to enlarge

Next step is to add a background . open the following image

image 18
Click to enlarge

and drag this layer right above the background layer.

image 19

Then change the blending mode to Luminosity.

This is my result

image 20

Next you can find on internet a grunge brush, and with a yellow color and opacity = 40 % try to add some minor details over the buttons

image 21
Click to enlarge

This is my final result.

High Tech Layout with Grunge Style
Click to enlarge

I hope you like it. Thank you