Making A Web Set

To see the printer friendly version of this tutorial, click HERE

This tutorial shows you how to make a simple three layer web set for the Welcome page on your new MSN group.

I used PSP 7 to make my web set.

OK, this is how I make my web sets.

First I find an image I want to use for either the welcome header or the main image of the page. I've chosen a Knuddelkids tube and I'm going to use it on the welcome header.

Please Note: I emailed Marion for permission to use her knuddelkids to make web sets. If you'd like to use her knuddels, please visit her site and email her.

Open your image in PSP. Press Shift and D to make a duplicate copy and close the original so you can use it again.

Open a new canvas  Use the following settings.

This is for our background tile. We need to make 3 tiles so press Shift and D at the same time. This will duplicate the new canvas so you now have 2. Repeat so you have 3 new canvases.

Now click on the Dropper tool

We're going to choose a dark colour from the tube to make our first tile. Move the dropper over the tube. If you look on your colour palette at the bottom you'll see a box. The colour in the box changes as you move the dropper over the tube. When you find a colour you like, left click once and this colour will go into the top stroke box. (Note: make sure you have the top stroke box set to solid colour. To do this, click on the little arrow on the style box and when the little window opens click on the paintbrush. This is the solid colour)

Now click on the Flood fill tool  and flood fill one of the new canvases with your solid colour.

We're now going to add a texture effect to the background tile. I used blinds.

Go to Effects > Texture Effects > Blinds and use the following settings.

Add the effect again using the same settings.

OK, for the next tile we're going to use a gradient.

Set the top styles box to gradient

Now click in the middle of the styles box and a new window will open. Click on the little arrow at the side of the thumbnail window and a list of gradients will open.

Choose a gradient that complements your colour theme and flood fill one of the blank canvases. Some gradients work better as tiles than others. I sometimes have to use an outside filter to help make my tile seamless. A good one to use is the Quick Tile filter that comes with Simple Filters, although, I have to admit that I prefer to use the seamless tiling option in PSP 8 because you have more control over how the tile is made seamless.

OK, for the last tile, use the Dropper tool again. Set your top styles box to solid colour and choose a lighter colour from your tube. Flood fill the last canvas.

I used the old paper texture effects for my last tile.

Go to Effects > Texture Effects > Texture and use the following settings

All our tiles are now done. You should have your 3 tiles and your original tube open in PSP.

We're now going to make the welcome header.

Open a new canvas 500x500. I always make my canvas big so I have plenty of room to work with and crop the excess away when I've finished.

Set your top styles box Pattern

Click in the centre of the styles box and when the new window opens, click on the arrow at the side of the thumbnail window. When the drop down menu opens find the tile that you added the old paper effect too (it will be at the top of the list) and click on it.

Now flood fill the new canvas.

Click on your tube to make it the active canvas and go to Edit > Copy

Now click back on your flood filled canvas and go to Edit > Paste As New Layer.

It's always best to paste as a new layer whenever you copy something onto another canvas because you can then move it about without affecting anything on the others layers.

Ok, let's add some text. Click on the text tool then click on the flood filled canvas.

Choose the font, size and colour you want your text to be then click OK.

The text will appear on your canvas. If you move your mouse over the text you will see it changes from the text tool icon to the mover tool icon. Move the text to where you want it.

I added an Inner Bevel

and a Drop Shadow to my text

When you've added the effects you want go to your layer palette and right click on the floating layer. Choose Promote to Layer

We now have 3 layers, the bottom should be the flood filled layer. The next should be the tube and the top one should be the text. Turn off the visibility of the bottom layer by clicking on the glasses at the side of the layer.

Now right click on the middle layer and go to Merge > Merge Visible

Making sure the merged layer is the active layer, Click on the Crop tool 

Go to the tool Options palette and click on Crop Settings

A new window will open. Click on Select opaque area - current layer

Now click on Crop Image

Now, turn the visibility of the bottom layer back on and save the image to a folder of your choice. I usually make a new folder on my hard drive for each web set I make. I save as jpeg files.

Ok, our header is done.

Time to make a divider and some buttons.

For both the divider and the buttons I used the preset shape tool . We'll make the divider first.

Open a new canvas 500x500 and flood fill it with the same tile you used before.

Go to the layer palette and click on the new layer icon. When the window opens, Click OK.

Click on the Preset Shapes tool and go to the tool options palette and use the following settings.

Set your top Stroke box to Null (that's the circle with the line through it) and set your bottom stroke box as solid colour and choose a colour that compliments your set.

Draw a long, thin shape on the new canvas. I added the same Inner bevel I used on the text.

Now go to the layer palette and right click on the top layer. Choose Duplicate

Click on the Mover tool  and move one of the copies of the shape down and too the right or left of the top one, the choice is yours! At this point, you can add a new layer and add a decoration to your divider. Alternatively, you can make a divider using a dingbat font or make a copy of your main image and resize it it so you have a tiny, button like divider. The fun comes with experimenting!

Crop it the same way you did with the header, remembering to turn off the bottom layer and merge the top layers.

Save and your divider is done. If you wanted, you could some decoration to the divider. I'd usually use something that would complement the graphic I'm using. Check out my link ware web sets to see examples of my work :o)

Now for the buttons.

Open a new canvas 500x500

Flood fill it with your top tile as before and add a new layer.

For the button I used the preset shape tool set on Ellipse

draw out an oval shape. The size will all depend on what text you're going to be putting on the buttons.

Add the same Inner Bevel as before. if you're adding decoration to your button always add a new layer so you can move it around and find the best place for it.

When you're happy with the button, Crop it like we did before and then Duplicate it by pressing Shift and D. Save the original as a PSP file and close it so you'll always have it if you need to make more buttons in the future.

Make duplicates of your button and add your text.

Yeah!!! We're done!

I made this web set very simple so you could get used to thinking about the different parts that make up a web set and how to make sure all the pieces tie in and compliment each other.

Now to upload your web set :o) Click here for my tutorial.