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

Hosting Layout

Browse Pages: 2  > >>

I will create a new document with the following size: 1000 x 980 pixels. With rectangle tool

image 1

I will create a rectangle with the following color #000000. I will place this rectangle on top of the document

image 2

After that with Rounded rectangle tool.

image 3

I will create another rectangle, with the same color #000000.

image 4

With the same tool, I will create another one with the following color #e6e4e5.

image 5

For this gray rectangle I will use the following layer styles.

Inner Glow

image 6

Gradient overlay

image 7

Gradient:

image 8

Stroke

image 9

This is my result:

image 10

With this layer selected, I will press on Ctrl+J and I will place the shape in the footer of the website:

image 11

The next step is to create another shapes with black color #000000.

image 12

To apply the same layer style to all these 4 shapes you have to select the top gray layer , and right click on it , in your layer palette.

Then choose Copy Layer style:

image 13

Then select each black shape, and right click on it, and select Paste layer style.

After you paste the layer style settings to each layer, you will have the following result:

image 14

I will create a new layer:

image 15

and I will grab Brush tool:

image 16

With the following brush:

image 17

With a white color I will make some random designs. be careful where you place the layer. You can drag the layer in your layer palette in the right place.

image 18

I will place a image with some servers

image 19

With Rounded rectangle tool I will create another shape with the following color #484848.

image 20

and another one with the following color #3e3e3e.

image 21

Under this one I will create another one with a different color #303030.

image 22

With the same tool, I will create another rectangle with the following color #434242.

image 23

For this last rectangle I will add some layer styles:

Stroke

image 24

This is my result:

Hosting Layout



Author's URL: amitk
Browse Pages: 2  > >>
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 "Hosting Layout"

Captcha