When Christmas comes, you need to get in the spirit. The best way to do this as a web designer is by creating some Christmas banners! In this tutorial I'll teach you a few simple ways to get your banner in the mood. I'll be using Flashindustries' banner as an example.
Time: 20 Minutes Level: Beginner
Step One
If your banner or your text is white, think about changing the colors to something else or you'll have to manage with off-white snow.
So here's what we're starting with:
Basically, what we're going to do is add a few Christmas related things. First snow, then Christmas lights. I'll also be changing our slogan, but that's definitely optional. Alright, let's get started. I'm going to begin by grabbing the brush and setting the size to 2px and set the hardness to 100%. This should be small enough for me to draw the snow on my banner, but if your banner is larger you may want to increase the size.
Step Two
Zoom in on your banner and begin drawing (with white) where you think the snow would've landed if it was falling on a similar surface. Basically just add it on the flat surfaces and falling off the sides too, like this:
If your snow is larger, I'd recommend giving it more depth so it looks fluffy. Mine is too small to do this so i'll just leave it. But to get the fluffy look, right click your layer and go into "Blending Options". Look for Bevel and Emboss and turn it on. Play with the blackness level around 10 - 20% like so:
Step Three
Looking good, now lets start the Christmas lights. You can be really flexible when designing the shape of the light, you only really need to get the basic shape, whether it be circular or oval. Start off by grabbing the pen tool and making a point. Then make another point to the right of the original point but higher up. Before letting go on your mouse, drag the mouse to the left and you'll notice a curve begins to develop. Make another point directly above the first point, but higher than the second point like this:
There are two problems with this; first, it's too large. Second, we only have half of the bulb. To fix the second problem we'll simply duplicate the layer then go "Edit > Transform Path > Flip Horizontal". Then move the layers side by side creating something similar to this:
Now we'll Rasterize both layers of the light bulb by "Right clicking > Rasterize". Then go "Layer > Merge Down" while you have the top layer of the light bulb selected.
Step Four
The shape is there, now lets start making the colors. Open blending options and use the following settings:
You can use any colors you like as long as you keep the gradient similar (Dark at bottom - Lighter at top). Here is the result of our large light bulb:
Step Five
Looks like we're done! The only thing you need to do now is duplicate that light bulb and change the color. Do this until you have the colors you want. Then scale them down to the size you need! Here's what mine looks like:
- This is a repost from: Nov 30th, 2007
Comments (3)
Add a Comment
You must be logged in to comment!
Click here to login.
