15
Feb
2013

Design cool looking featured post background of a website

Posted in: Photoshop Comments Off

I this Photoshop tutorial we will design a cool looking background for featured posts of a website / blog. This can be also used in portfolio website for showcasing past works.

Below is final image of the tutorial.
45

Step 1:

Create a new document of size 900 X 400px with background color #23a1c0 You may take different size as per your requirement.
29

Step 2:

Apply some noise to background. Filter >> Noise >> Add Noise >> Amount: 4
30

Step 3:

Select “Rectangle tool”.
31

With color set to #086380 draw a rectangle shape leaving a margin of about 50px from all 4 sides.
Hint: Use Guides (View >> New Guide) to leave equal margin from all 4 sides.
32

Step 4:

Now we will transform the rectangle shape. With rectangle shape layer selected, Go to:
Edit >> Transform >> Warp
And apply following transform.
33

34

Step 5:

Now apply following layer style to the rectangle shape layer.
35

Step 6:

Create a new layer and draw a rectangular shape with color #075f7c as shown in below image. Change layer mode to “Multiply”.
37

Now apply following layer style to this rectangle shape.
38

39

So, it looks like this now.
40

Step 7:

Create a new layer just above “Background layer”. Select “Ellipse Tool”. With black color draw a elliptical shape as shown below.
42

Apply warp transform Edit >> Transform >> Warp, same as we did in step 4. So, it looks like this now:

41

Apply Filter > Blur > Gaussian blur
43

So, it looks like this now:
44

Step 8:

Now we will add arrow on both sides using custom shapes. Use color #015368 for arrow. You may apply some layer style to arrow shape to make it attractive.

So, our featured post background is ready.
Below is the final image.

45

About the Author

Name: Ravi Shekhar
I love learning and sharing web stuffs.

Share this post

Twitter Facebook Google Buzz Digg StumbleUpon Delicious Technorati
Both comments and pings are currently closed.

Comments are closed.