I claim the copyright to this
tutorial. You are free to do whatever you please with the graphic
you make, but please do not take my tutorial. Do not send the tutorial
through email. Only share my link.
The purpose of this tutorial is
to learn how to make the mosaic splash effect around an image. This
method can also be used for signature tags. It is written for
beginner to immediate level. Please feel free to email
me if you have any questions.
To do this tutorial you will also
need Paint Shop Pro. I used Paint
Shop Pro 7.0 . You may download a free trial at Jasc.
Remember to save as a psp file
often!
Before we begin, you might want
to study the PSP tool bars. I have labeled the tools on another page.
Click on the link and it will open a new page. You may want to keep
this page open while you work on the tutorial, to refer to the names now
and then. PSP Tools
In this tutorial you will learn
how to make this 3-piece background.
You will need to download the
dingbat Flower Ornaments. You do not need to install it into your
fonts. Just save it in a folder where you can find it. Download
here:
You will also need the Art
Texture plugin from Ulead. You may download that here.
You will also need two complementary
background tiles. You may download mine here.
dark
blue tile
white
tile
If you wish to make some in
different colors first, then please try my two tile tutorials:
Textured
Tile
Marble
Tile

Before opening PSP, open up
the Flower Ornaments dingbat that you downloaded by right-clicking on the
file and click open. Minimize the file. Then open PSP.
This way you do not have to load the font into your fonts file. (Too
many fonts can cause PSP or Windows to crash or freeze up!)
1. Open your two tiles
in PSP, and minimize them. We will use them later for fills.
2. Open a new file: 700
x 400, resolution= 72,000, transparent background, 16.7 million colors.
3. Add a new raster layer,
called background.
4. Choose your foreground
color to be white, choose your styles background to be null.
5. In the left tool bar,
choose the preset shapes tool. In the Tool options box, change to
these settings: choose round rectangle, check antialias, create as a vector
unchecked, line width= 8, line style=solid (#1)
6. Ok, now watch the status
bar at the bottom of the screen as you move the mouse. Place the
cursor in your new image at coordinates (32, 62). You will see these
coordinates at the bottom of the screen. When you get those coordinates,
hold the left mouse button down and drag out a rectangle. Stop when
the second coordinates become (672, 374). Release the mouse.

7. In the left tool bar
choose the magic wand and click on the rectangle you made to select it.
8. In the top tool bar,
click on Effects–Plugin Filters–Ulead–Art Texture. Apply these settings:
Click Edit. Click on image #5, click ok. Click on image #5-6
(last one on 2nd row), and click ok. Your rectangle should have turned
gold.

9. While still selected
go to the top tool bar, click on Effects–3 D Effects–Inner Bevel.
Apply these settings: Bevel = pie shape, width=14, smoothness=15, depth=12,
ambience=0, shininess=50, color=white, angle=315, intensity=50, elevation
=30. Click ok. In top Tool bar click selections–none. Click
File-Save as and save the file as a paint shop pro file (.psp or.tub).
Name it GFDtemplate.psp.
10. In left tool bar, click
on magic wand tool. Use it to select the outside area of your background.
In top tool bar, click on Selections–modify–expand. Type in a 35.
Click ok.
11. In the Layer Palette,
Click on Layer 1 to activate it. In the foreground styles box, set
the styles box to your border background. Click on the black arrow
in the foreground styles box, choose patterns (3rd icon). Then click
on the styles foreground. Scroll up to choose the tile that you want
for your border. Scale = 100%, angle=0. Click ok.

12. In the left tool
bar, choose the flood-fill tool (paint can), and left-click in the selected
area to fill with your border tile.
13. In the top tool bar,
choose Selections–Invert. Change your pattern to your second tile
choice, and flood-fill the selected area. Click on Selections--modify--feather
20. Click ok. Then flood-fill the selected area with the same
pattern.
14. In the left tool
bar, click on the text tool. In the Tool Options box, change the
line width to 5. Left-click on the image. When the text box
opens, select the Flower Ornaments font, size= 80, foreground color = null,
background color=white. Type a lowercase i . (You
may choose another dingbat, but the size will affect your cropping numbers
in Steps 24 - 28) Check floating and antialias. Click ok.
Move the dingbat to center over the gold bar like in the image below.
KEEP selected!

15. In top tool bar, click
Effects--Plugin filters--Ulead--Art Texture. Click Edit. Click
image #5 (gold), click ok. Click Image 5-6 (last one in second row).
Click ok. Keep Selected!
16. In top tool bar,
click Effects--3D Effects--Inner Bevel. Apply the same settings as
before. Apply these settings: Bevel = pie shape, width=14, smoothness=15,
depth=12, ambience=0, shininess=50, color=white, angle=315, intensity=50,
elevation =30. Click ok. In top Tool bar click selections–none.
In top tool bar click selections--none.
17. In top tool bar, click
Layer--Add new raster layer, called bottomright.
18. In the Tool Options
box, change the line width to 2. With the text tool, left click on
the image. When the text box opens, select the Flower Ornaments font,
size= 48, foreground color = null, background color=white. Type a
lowercase i . Check floating and antialias. Click
ok.
19. In top tool bar, click
Effects--Plugin filters--Ulead--Art Texture. Click Edit. Click
image #5 (gold), click ok. Click Image 5-6 (last one in second row).
Click ok. Keep Selected!
20. In top tool bar, click
Effects--3D Effects--Inner Bevel. Apply the same settings as before.
Apply these settings: Bevel = pie shape, width=14, smoothness=15, depth=12,
ambience=0, shininess=0, color=white, angle=315, intensity=38, elevation
=30. Click ok. In top Tool bar click selections–none. In top
tool bar click selections--none.
21. In top tool bar, click
Image--rotate. Click circle by left, and freehand. Type in
45. Click Ok. Move the dingbat into the lower right corner
like below. In top tool bar, click Selections--None.

22. In Layer Palette, right-click
on bottomright layer. Choose Duplicate. In top tool bar, click
Image--Mirror. Now the dingbat is also on the bottom left.
23. Save. Press Shift
+D (same time), and you will get a second copy of the file. Minimize
the first one (GFDtemplate.psp). Click on the second one to make
it active. In top tool bar, click layer--Merge--Merge All (Flatten).
You can type your copyright or site name on the bottom like I did.
24. DOUBLE-Click on the
selection tool (in left tool bar). A selected area box comes up.
Type in these settings: left=0, right =700, top =275, bottom =400.
Click ok. A selection box should appear around the bottom.
Check
to make sure that all of the dingbat is inside the selection box.
If not, click undo, double-click on the selection tool again and
make the top number a little smaller. You will have to change
thee numbers if you chose a different dingbat in Step 14. *S*
25. In top tool bar, click
Edit--Copy. then click Edit--Paste-As new image. Save file
as bottom.jpg
26. DOUBLE-Click on the
selection tool (in left tool bar). A selected area box comes up.
Type in these settings: left=0, right =700, top =0, bottom =150.
Click ok. A selection box should appear around the bottom.
Check to make sure that all of the dingbat is inside the selection box.
If not, click undo and make the top number a little smaller. *S*
27. In top tool bar, click
Edit--Copy. then click Edit--Paste-As new image. Save file
as top.jpg
28. DOUBLE-Click on the
selection tool (in left tool bar). A selected area box comes up.
Type in these settings: left=0, right =700, top =125, bottom =250.
Click ok. A selection box should appear around the bottom.
Check to make sure that all of the dingbat is inside the selection box.
If not, click undo and make the top number a little smaller. *S*
29. In top tool bar, click
Edit--Copy. Then click Edit--Paste-As new image. Save file
as middle.jpg
And there you have the three parts
to your background! You need to set up this background in a table
format with the 1 column, and 3 rows. Make the background of the
first row the image of your top piece, the second row the image of your
middle piece, and the 3rd row the image of your bottom piece. Place
all the writing and pics for the page in the second row. Please view
the source of this page to see the script and how the background is set
up. (In Internet Explorer, click View--source). Contact me
if you need help.
Now make
some buttons for this background.
If you have any questions about
this tutorial or comments,
please email me.

© Dragon's
Breath (aka The Dragon Lord), 2003. This tutorial and my PSP
graphics are copyright to The Dragon Lord, 2003. Please do not remove
this tutorial from my site. Share my url. |