Created July 16, 2003 © Copyright Moon's Designs
Property of Moon's Designs
This is my creation, any similarity to other tutorials on the Internet is unintentional.
Please do not copy or place this tutorial or any graphics to any other place without written permission directly from me. Thank you.

This tutorial is written in and for PSP8 and assumes you have a working knowledge of PSP.

YOU WILL NEED:
JASC's PSP8 (30 day free trial) - You can get it HERE

This tutorial is written by request for Colleen. Colleen wrote and asked how to use a use a background tile for buttons and banners on a website. I do explain this in my Triple Background Tutorial, however it is written for PSP7 and there a few different things in PSP8 that you can use. We won't be doing a triple background in this particular tutorial, however I will explain how you can use the background tile to make your banners and buttons blend in with the background.

Remember, my tutorials are only guidelines to help you accomplish a certain creation. Please feel free to be inventive and take whatever liberties you would like. I encourage each of you to do your "own thing" and make your creation yours!

Screenshots are resized and compressed for faster loading.

Step 1:
Choose the color that you would like for your web site and set it as your foreground material color. Open a new image 150x150, transparent background and flood fill with your color.

Step 2:
You can either leave it as a plain color, or you can add a slight texture to it as I did for this page. To add a texture, go to Effects/Texture Effects/Textures. I used the following settings for my texture. Click OK to apply.

Step 3:
You will now want to take your new image that you made, either plain color or textured, and make it into a seamless tile. To do this go to Effects/Image Effects/Seamless Tiling. I used the default setting, so if you have yours set to another simple click on the curved arrow to go to the default.

Step 4:
You will now want to save your tile as a .jpg. I use the .jpg optimizer (File/Export/JPEG Optimizer). Let me explain a little bit about the .jpg optimizer in PSP8, as it is a little different than PSP7. In PSP8 the .jpg optimizer now comes with several Chroma Sub Sampling options. Truthfully, I have no idea what all these options mean, however I have found that using the None mode - instead of the Default mode - works extremely well. I do show examples on my V8 The Easy Way CD's. ~smiles~ I use 15 compression size and None for the Chroma Sub Sampling.

Navigate to the folder you want to keep your web tiles in and give it a name, I named mine bgtile. Keep your new background tile on your workspace as we are going to be using it in a little bit.

Step 5:
To make a large welcome banner or smaller buttons, create a new image. For my top banner, which is the title of this tutorial, I made a new image 500x250 - transparent background. On your Materials palette, click on your foreground material box.

You will get this dialog box, click on Pattern.

Click the down arrow to view all of your patterns and choose your background tile.

Click OK and flood fill your new image.

Step 6:
You can now add tubes and/or text to your top banner. For this example, I added text. Add a new raster layer (layers/new raster layer). Activate your text tool and enter the text that you want. Add a Super Blade Pro preset or any type of preset you would like, you can use Ulead Art Texture if you like also. Deselect (Ctrl+D). I wanted my text centered on my image and thanks to JASC's premade scripts this is easily done.

Step 7:
To center the text on your layer, have your Scripts toolbar activated (View/Toolbars/Script) if you don't have it active. In your Scripts menu bar scroll to Center Layer.

Run your script by pressing the right arrow icon.

Your text is now perfectly centered on your image. You can add a drop shadow if you like or whatever else you want to your top banner.

To make your web buttons you can do the same thing, although you will want a smaller image size ;-). Flood fill with your background pattern and voila! You have your matching buttons and banners for your website when you save your images as .jpgs.

The top title banner, the PSP7 Tutorials and PSP8 Tutorials buttons were all done this way. If you have any problems, comments or questions please do not hesitate to E-mail me.

 

If you would like to use this tutorial for group settings, please contact me. Just click on the above mail slot *S*

 

Tutorial written and created by Patti Wavinak for Moon's Designs. These Tutorials are copyrighted by law. You may LINK to them only. You may not remove any of the graphics, zip files or html within these pages to reproduce these Tutorials, without the expressed permission of Moon's Designs. These pages may not be removed from this website and sent via e-mail, nor saved, stored or archived in files in YahooGroups or other mailing list sites, nor may they be translated and placed on another site.
Creations made from these tutorials are your creations.
Moon's Designs holds the copyright to all selections, original tubes and original images that I have created and provided for use within my tutorials. Page backgrounds and images are created exclusively for this website and may not be downloaded or used without written permission.
If you would like to use any of my tutorials for group lessons please contact me.

Established April, 2001
© Copyright 2001-2003 Moon's Designs "All rights reserved"
No portion of this site may be duplicated or distributed