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

Web 2.0 Business Layout


So let's start with a new document
Size : 760x770 pixels
Background color : white

Select Rounded Rectangle tool and create a shape like mine

image 1

For this shape please add the following layer styles:

image 2

image 3

image 4

image 5

This is my result

image 6

Select Pen Tool, and create the following shape

image 7

Now duplicate this layer ( press Ctrl+J )
Then go to Edit > Transform Path > Flip Horizontal , and with Move tool place the duplicated shape like me ( i will use 2 different colors so you can see better what i am doing )

image 8
Click to enlarge

Now select both layers in Layer's palette

image 9

With both layers selected press Ctrl+E ( this action will merge the files into a single one )

Then for this layer add the following layer styles.

image 10

image 11

image 12

image 13

This is my result

image 14

Duplicate this orange shape, and move it a little to the top. For the second layer add the following layer styles

image 15

image 16

image 17

This is my result

image 18

Create a ellipse

image 19

Then add the following layer styles

image 20

image 21

image 22

This is my result

image 23

Create another ellipse

image 24

And add the following layer styles

image 10

image 11

image 12

image 13

This is my result

image 29

Select Rounded rectangle tool ( set the radius to 30 pixels ) and create 2 shapes

image 30
Click to enlarge

Then add the same layer styles as above

image 15

image 16

image 17

This is my result

image 34
Click to enlarge

Add some text for buttons, and for logo

image 35
Click to enlarge

Now let's add another details. With rounded rectangle tool create another shapes

image 36
Click to enlarge

Now for all this white shapes please add the same layer styles

image 37

image 38

image 39

This is my result

image 40
Click to enlarge

Now add alone some text and images

image 41
Click to enlarge

Then you can add alone some details like some pixel brushes or icons

image 42

Also this small brush icons you can find them in the following resource pack Here is my final result. I hope you like it

Web 2.0 Business Layout
Click to enlarge

Thank you



Author's URL: amitk
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 "Web 2.0 Business Layout"

Captcha