Clean Layout « Web « Photoshop Tutorials

Home
Photoshop Tutorials
1.3D
2.Animal Creature
3.Animation
4.Background Cover
5.Color
6.Design
7.Effect
8.Hardware
9.Holiday Event
10.Human
11.Image Format
12.Logo
13.Nature
14.Object
15.photography
16.Shapes
17.Text
18.Textures
19.Tools
20.UI Controls
21.Web
Maya Tutorials
3ds-Max Tutorials
Illustrator Tutorials
GIMP Tutorials
Photoshop Tutorials » Web » Clean Layout 

Web 2.0 style is hot these days. Although now some web designer set new trend for anti Web 2.0, anti-gradient and anti-glossy-icon, this tutorial will show you how to make a clean style layout with some basic tools with Photoshop.

With a random could brush from this set of brushes, make some drawings on your layout. I have used a single brush. this is my result:

I am aware that I didn't put each step here. For the reason that I want you to use your own creativity while you doing this tutorial. I figured, if I tell you each steps, you will just come up with exactly the same thing I did. There's no point to it. However, click here to download the PSD of this layout.

The copyright/footer of the layout. I hope this tutorial was not only easy to follow but that you learned a lot on the way. To see actual size, click the below image. Please make yours original.

Now with the same method try to add more doted lines. i am sure you will place the lines based on your layout needs.

Make a selection at the top of the layout, and with gradient tool draw a simple line until you have a result like mine

2. Start filling the background with #1d7e9f using your paint bucket tool.

Create a new document 800 x 900 select the rectangular marquee tool and draw a rectangle at the very top using the color #288cc8. Also add these stroke settings.

ww_w_.__j_a_v__a_2s__.c_o_m___ | Contact Us
Copyright 2009 - 12 Demo Source and Support. All rights reserved.
All other trademarks are property of their respective owners.