PainShop Pro Web Site Special Effects

Program: Paint Shop Pro
This Masterclass tutorial will show you how to create some stunning special effects for use on your Website using Paint Shop Pro. Although, we are using this paint package, you can in fact create all the specials effects featured in this tutorial in just about any package available. To use this tutorial, you will need some scanned in photographs or web images to use in Paint Shop Pro. In this tutorial, we will show you how to create drop-shadows and faded edges.

Part 1: making a selection
Before you can start being creative, you have to load up Paint Shop Pro. If you don't have any images on your hard drive, have a look on the Internet and use some copyright free images that are freely available on the web.

To save an image from a Website, right-mouse click on it and select 'copy' Load Paint Shop Pro Press CTRL + V (to paste as a new image) Use the zoom tool to view the image at 100%

The first special effect we are going to do is a faded edge around a selection. To do this, we want to create a new image, and paste our examples onto it.

From the file menu, select new Create an image 800x600 Set the background colour to black Chose 24bit colour Click OK

To take a section from an image, you use the 'selection tool'.

On the toolbar, click on the selection tool Click on the toggle control palette icon to open the control properties window

When you first chose the selection tool, you won't know what type of selection mode it is. The Control palette however, allows you to change the properties of the selected tool (the selection tool for example). This is the most important button in Paint Shop Pro.

In the control panel, set the selection type to 'circle' Set the feather to zero

With the feather set to zero, our selection will have a hard edge

Click on your image and click + drag the mouse outwards to select a circular are of the image

In Paint Shop Pro, a circle selection expands from the centre. Other packages start from one corner. We think this is by far the best way to make a selection.

From the edit menu, select copy Pull up the new blank canvas From the edit menu, select paste > as a new layer

This will put our selection onto the new blank canvas. Although to make it really nice, we want to give it a feathered edge.

Toppers' tip: attach drop shadows to selections

Part 2: drop shadow
Creating a feathered image in PSP (Paint Shop Pro), is very easy indeed. All you do is set the feather amount in the control palette.

Highlight your original image In the control palette, set the feather level to 20

Whatever you set the feather value to, your selection will expand by this figure when you make a selection.

To see this in action, while using the selection tool, drag out an area of the image and release the mouse

You will see that the selection has expanded by 20 pixels. You have to be quite careful of the edges of your image, as your selection may go over the edge of the image. So you must take into consideration the feather value when making a selection.

From the edit menu, select copy Pull up the new blank canvas From the edit menu, select paste > as a new layer

You will now see that the edges of the selection are faded. This is a great special effect and looks very nice on Websites (but don't over do it). When feathering, always capture in the centre of your selection.

Another great looking feature, that can sometimes be over done is the drop shadow. This gives the impression that the images on your Website are floating above the page. Again, it can be over done, so use it carefully.
Creating drop shadows is not as difficult as you might think.

Select the layer with the hard edge Image > effects > drop shadow

In the drop-shadow properties window you can change the different settings of the drop-shadow you want to create.

Set the drop-shadow colour to white Set the opacity level (or transparency level of the drop-shadow) to 100 - no opacity Set the blur level to 22

The offset is the direction of the drop shadow underneath the selection. It's like shining a light onto an object at different angles, the offset of the drop shadow is always in a different place depending on the direction where the light is coming from. So here you can set the offset of the drop shadow under the selection. This isn't as easy to use as some packages, so a bit of experimentation is needed.

Set the offset values Click OK to create the drop shadow

Now, that is the automatic way of doing it. But if you want a bit more control over where the shadow lays, you have to apply a bit of manual work.

Part 3: doing it manually
To show how to create a manual drop shadow, you need to start a new document.

From the file menu, select new Create an image 800x600 Set the background colour to white Chose 24bit colour Click OK

Now, this time we are going to use the selection tool to cut out a section of the white canvas and use it as a drop shadow underneath another layer.

Click selection tool again Make sure the feather level is set to 20 draw out a circle selection and press CTRL + C to copy it to the clipboard click on your previous canvas (with the black background) from the edit menu, select paste > as new layer move the layer underneath your hard edged image

This option is a lot more flexible and easier than the automatic approach.

One thing we haven't looked at in the tutorial is the layers palette. This window allows you to change the properties of each layer individually. We have covered it in other tutorials, but here's a brief overview of it.

From the toolbar, click on the toggle layer palette

This will bring up the layer palette window. Here you can see what layers you have on the canvas (including the background). You can turn off individual layers so they don't obstruct your work. You can adjust the transparency / opacity of each layer by selecting a layer and moving the slider. As well as adjusting the opacity of a layer, you can apply different colour effects. There are selected from the drop down menus to the far right of each layer. Just play around with them to get some quite amazing effects.

So, by adjusting the opacity of a layer, you can make the layer below it, shine through. If you want to change the hierarchy of the layers, in the layer palette, drag a layer name above another to move it up a level.

To merge two layers together, simply switch off all the others and the background, and right mouse click on the top layer name and select merge > merge visible. This will now merge the two remaining layers together. Now, if you switch on the layers again, you can freely move your new merged layer around the canvas.

Toppers' tip: merge layers by turning off the others