Dezinerfolio

Creating Web 2.0 Wallpapers for your Logo

Your rating: None Average: 4.6 (34 votes)

Here is a simple Photoshop Tutorial to create Cool Web 2.0 looking wallpapers for your logo. In this example I have used my logo. Hope you like it.

Creating Web 2.0 Wallpapers for your Logo

  • First we start off with a 1024 * 768 Blank Document.
  • Create a new layer and fill with any color.
  • Now move to layer styles and choose gradiend and pick the gradient from the image below

Creating Web 2.0 Wallpapers for your Logo

  • You could also use different Web 2.0 Gradients. Here is a Free Download of a Huge Collection of Web 2.0 Gradients for Photoshop which I made.

Creating Web 2.0 Wallpapers for your Logo

  • Now create a new layer
  • Create a simple gradient as in the above image. The two ends are transparent and the middle with white.
  • Using the Gradient tool, horizontally apply the gradient for the whole layer

Creating Web 2.0 Wallpapers for your Logo

Creating Web 2.0 Wallpapers for your Logo

  • Now Transform the layer ( Ctrl + T )
  • First reduce height by scaling vertically
  • Right Click > Perspective and get the selection as in the above image.
  • "Enter" to make changes

Creating Web 2.0 Wallpapers for your Logo

  • Make the selection as above
  • Ctrl + Alt + D - Apply a feather of 30 and delete the selection

Creating Web 2.0 Wallpapers for your Logo

  • Create a new layer
  • Create an Elipse with white fill

Creating Web 2.0 Wallpapers for your Logo

  • Transform > Perspective to the elipse as above

Creating Web 2.0 Wallpapers for your Logo

  • Apply a 40px Gussian Blur
  • You could also horizontally scale this elipse based on the size of the logo you will be using

Creating Web 2.0 Wallpapers for your Logo

  • Create a layer below the blurred elipse as above
  • Apply the Stripe pattern to the whole layer
  • If you are not sure how to do this, you could refer the previous article of creating stripes here

Creating Web 2.0 Wallpapers for your Logo

  • To the layer which you applied the stripes, Choose "Lighten" in the layer blending properties as above.
  • Then change to opacity from 100% to 8%

Creating Web 2.0 Wallpapers for your Logo

  • To this layer, make a selectionfrom bottom as shown in the above image
  • apply a feather of 150px
  • Delete the selection

Creating Web 2.0 Wallpapers for your Logo

  • Now here is the main part of this tutorial
  • Above is my logo which I had created long time ago.
  • Place the logo such that the base of the Logo lies on the center of the Blurred White Elipse.
  • Please try to have good Shadows and Reflections for the logo as above.

This is all. Your Web 2.0 Wallpaper for your Logo is done. Hope you enjoyed this tutorial. Please comment below if you liked it.

Below is the Final Output. Please click on the image to view the Hi Res Wallpaper.

Creating Web 2.0 Wallpapers for your Logo

Trackback URL for this post:

http://www.dezinerfolio.com/trackback/208

Comments

Anonymous's picture

Thanks for tutorial:)

darmowe tapety (not verified)
Sat, 08/29/2009 - 04:08
Anonymous's picture

http://www.hotdesktopwallpapers.net - Thousands of wallpapers to choose from.

Jeevan (not verified)
Tue, 09/30/2008 - 12:15
Anonymous's picture

Thanks for this tutorial. Great websites you have got. Keep the tutorials coming.

Jeevan (not verified)
Tue, 09/30/2008 - 12:14
Anonymous's picture

Latest Wallpapers

http://latestwallpapersever.blogspot.com/

The largest website for Original Desktop Wallpapers, 3D Animated Wallpaper, Wallery Desktop Slideshow, Ecards, and screensavers

Latest Wallpapers (not verified)
Mon, 08/11/2008 - 08:28
Anonymous's picture

Nice job

Youvaraz (not verified)
Thu, 06/26/2008 - 17:09
Anonymous's picture

Neat result. Thanks!

Kari Buttons (not verified)
Wed, 05/07/2008 - 05:12
Anonymous's picture

Thanks for the awesome tutorial. its very in depth! :) I bookmarked it so I can come back for future reference if I forget what I learned (which happens often).

Tue, 07/08/2008 - 06:28
Anonymous's picture

thx. i bookmarked this page.

altin sozler (not verified)
Mon, 05/19/2008 - 08:01
Anonymous's picture

Excellent tutorial Navdeep….Made some really cool wallpapers from this technique.Hope to get many more soon..

hamachi (not verified)
Sat, 04/05/2008 - 05:59
Anonymous's picture

Let's see: Gradient + stripes. Yep, totally Web 2.0. Hehe

Nice tutorial!

Caffeine (not verified)
Sat, 03/29/2008 - 07:50

Post new comment

The content of this field is kept private and will not be shown publicly.

Visualize