Photoshop site tasarım

Photoshop site tasarım 3

Let’s start the tutorial
Open Photoshop and create a new document Ctrl + N

Select Rectangle Tool and create a shape over the entire canvas. Color used #e6dfd3

Having Rectangle Tool still selected I will create a shape on the footer, color used: 8f836c

With Rectangle Tool I will create this shape on the top and I will apply this layer styles. We will gonna use it for navigation bar.

With Pen Tool I will create this 2 shapes. I have used a red color just for demonstration proposes.

Then I will apply the same layer styles, applied on step 3

With Pen Tool I will create this triangles

And I will apply a gaussian blur (Filter>Blur>Gaussian Blur) of about 10px
My result:

With Ellipse Tool I will create this white shape.

And I will apply a gaussian blur (Filter>Blur>Gaussian Blur) of about 15px.
My result:

With Type Tool I will create the links for navigation. For each link I have applied this layer styles:

My result:

Next we will create the logo. With Rectangle Tool I will create this shape on the top (middle) and I will apply this layer styles:

My result:

I will select Add Anchor Point and I will add a point on the middle of the shape created on previous step

With Direct Selection Tool I will click on anchor point and I will drag a little bit down. Please see the screenshot below.

My result

On my layer palette I will duplicate the shape created on step 8. To duplicate a shape, make sure that it’s selected on layer palette and press Ctrl + J.

Select the shape which was duplicated and go to Filter>Texture>Texturizer.

Here is my result:

From Justice Vector Icons I will use select a Libra icon and I will use it as a logo.

With Type Tool I will write “Lawyer Website” and as a tagline I will use “by trendyTUTS”

With Rectangle Tool I will create a large shape just under navigation. Color used: #8f836c

With Pen Tool I will create 2 triangles to make a nice shadow (in the same way that we have created it for navigation)

I will go to Filter>Blur and I will apply a Gaussian Blur of about 15px

With Ellipse Tool I will create this white shape

Then I apply a Gaussian Blur of about 30px

On the right side I will add a picture showing a lawyer

As you can see, the picture does not fit to well with this layout. On the next step we will gonna fix this.

I will select the layer of my picture on my layer palette and I will add a layer mask

I will select Gradient Tool, I will make sure that the default palette is selected (black and white) and I will drag a similar line, from the left to the right

Once you have something that you like, you will need to apply the layer mask.

I will repeat steps 19, 20 and 21 for about 3 times (top, left and bottom of the image).
Here is my result:

On the left side, with Type Tool I will add some text

With Ellipse Tool I will create a black shape and I will apply a Gaussian Blur of about 8px.

With Pen Tool I will create this shape. We need to place it in that way, so the shadow created on step 24, to be visible just a little bit.

Having Pen Tool still selected I will create another shape, this time above the shape created on step 25. For this shape I will apply this layer styles:

My result

I will select Rounded Rectangle Tool, with a radius of 10px. I will create this shape and I will apply this layer styles:

With Type Tool I will add some text.

I will add an image

I will repeat the following steps: 24, 25, 26, 27, 28, 29 and I will create another 2 frames

With Rectangle Tool I will create a red shape and on the top of it I will add this quote
“Justice that love gives is a surrender, justice that law gives is a punishment. ”