website promotion banner
Free Stock Images
  • Create A Free Account
  • Download High-Res Stock Images For Free
  • +5 Million Images
Your Ad Here
Photoshop  Home Photoshop Web Layout Christmas-Themed Template Customization Using Clipart (Exclusive Tutorial)
rss

Christmas-Themed Template Customization Using Clipart (Exclusive Tutorial)

Author: Reiven More by this author
Browse Pages:  1  2 > >>



At Christmas everybody is rushing to buy gifts, decorate their homes, get a turkey. Web also designers have their share of work - decorating their site for visitors to feel the positive Christmas vibes and sense that you care enough about your business to update the site for major holidays.

In this tutorial I will show you how to adorn the template and make it look really festive.

So, let's go on templatemonster.com and take a look at this template, which is an online store. As Christmas is known to be a season of gifts, the first thing to be done is to change the empty inconspicuous cart for a colorful Santa with a heap of gifts. The header can be enlivened with Christmas tree ornaments, snowflakes and a touch of frost.

So, let's proceed step by step starting with the Santa-Clause. A suitable one can be found in free staff that the above-mentioned templatemonster offers, for example, or in picture storages like alamy.com. I liked this one best:

Santa

Open the image with Photoshop and drag the layer with Santa to the canvas with your template. Then replace the layer containing the cart with the Santa (hide the layer with card and move layer with Santa to it's place).

Santa 1

Looks somewhat unnatural; adding some shade wouldn't hurt. Change Santa's Blending Mode for Multiply. After that Ctrl+Click on the layer thumbnail and delete the selection in the layer containing the grey stripe (the background of Santa's head and the tree's top).

Add a new layer (under the one with the Santa) and using the soft brush put some grey shade under Santa's feet and the gifts. The Blur filter can be used for greater effect.

Santa Shadow

Now you need to turn the gifts back into the initial light color. Create a new layer between the shade and the Santa layer and outline the gifts with white using soft brush.

Santa Final

Now we can take to beautifying the header. There is plenty of free space between the name and the search, which can be used for embellishment. The white space is the ideal background for Christmas ornaments with a reflection. Using the already mentioned free staff search Ive come across a few good choices.

Decoration Decoration 1

Add them to the header.

Head Small (Click to enlarge)
Click to enlarge

The star didnt seem fitting to me, so I decided to keep only the colored bulbs.

Head Small 1 (Click to enlarge)
Click to enlarge

And finally we come to the most essential characteristic of winter - the snow. It will look fine in the top left-hand corner, the home of ornaments and the site name. Rummaging through the clip art I found the perfect snow for the site.

Snow Flakes   Snow Flakes 1

Add the snowflakes layers on top of all the other layers and set the Blending Mode to Multiply.

Arrange according to your taste:

Head Sants Final (Click to enlarge)
Click to enlarge

And so, this is what I've got:

Store Online Small (Click to enlarge)
Click to enlarge

You can also download the .psd for this template (customization process only ;))

For more Christmas Tutorials please visit this page.


About the Author:

Click to Visit Author's Website

Dustin Kein is an editor at Web Design Library. He's in charge of selecting materials for the PhotoShop and HTML sections of this site. From time to time Dustin contributes some of his tutorials to WDL in order to cover the most actual topics for WDL visitors. Besides this, he's an active forum member whose posts are always helpful, concise and timely.
read more about this author



print this page tell a friend subscribe to newsletter subscribe to rss
Rate this Material: Bad 1 2 3 4 5 Excellent
Browse Pages:  1  2 > >>

Add comments to "Christmas-Themed Template Customization Using Clipart (Exclusive Tutorial)"