Belly-san's Awesome Paint Shop Pro tutorial! >_< [updated version ]
Alright, I decided to make a tutorial for userpage layouts in Paint Shop Pro, since I know some of us only have PSP, and we should not be left out of having good userpages hmm? ;)
Alright- in case you've come across this thread and wanted a PS tutorial, please go here: ex's PS tutorial
So- you have may already guessed- yes it is possible to make a userpage skin in PSP! >_<
-if you think you are incapable, or just don't wanna, lplease visit the userpageskindesigns group :)
UPSD
Requirements:
Paint Shop Pro X [I have X, but 7 works too]
Firefox [to upload your
skin- IE will not work]userpage template and slices: download
Patience! [this can get confusing the first time around, but if belly can do it- so can you! >_< ]
alright- lets get started!.
1] First, I've made a userskin layout template[blankpage.jpg] plus a slicer[newskinmach.jpg]- This template is a guide in which I use for the skins, add everything to them and re-save as another file- this way you always have the template ready for another skin >_<
Depending on how you want your page to look, I suggest looking to use colours from the Hex Colour Codes for the background, that way there will be no abrupt change in flow on your userpage when
specific skins repeat [WHAT? Repeat?!?]
!Repeating is:
-a slice on the skin which repeats throughout the page. On MT, the skins #03, #06 and #07 repeat to fill in the empty areas around them. This is why on some pages you see a repeat on the left and right portions of the page. I always make these a blank colour which goes with your background, or until you are a pro- you can put patterns and junk ;)
2] now the fun part! Making the userpage >_<
Let your creativity shine! Do whatever you choose, it's your userpage isn't it? ;) - let your creativity soar!
Just remember- you can always fix things later ;)
Start off with a scan you like! I suggest using a white bacground scan first, just so you dont have to play around with
erasing the backgrounds in the scan etc :)
-add your scan, put text on it- do what you like! one note- the top slices are really high compared to what you actually
see on your page- make sure you remind yourself of this while making the slices- or else your top portion may get cut
off! if this happens to you, please refer to the bottom of the tutorial in the FAQ area :)
3] once you are done making your layout- you have to slice it. Save the file as either a .psp or .jpg under a new file name.[ I like to make new folders for each new layout I make- less confusing ^_^]
4] now, under FILE: go to EXPORT, then IMAGE SLICER. This will bring a pop up browser with the slicers. Here's a picture to show you what i mean
5] Now, there is buttons with images on the top part of this browser. The third one looks like a knife, this is the SLICER. Select the SLICER.
6] on the image, zoom out enough so you can see the whole image. IF you downloaded the zip file i left for ya, you
should just click on "load settings" and find the slice file i made for ya :) if you can't for some
reason use the slice file, here are the dimensions to cut: [MT3 updated slices]
slice #01:588x470
slice #02:720x470
slice #03: 3x470
slice #04:588x738
slice #05:720x748
slice #06:588x 10
slice #07: 3x748
For your first slice, you will need to zoom into the top right corner, enough so you can see the numbers [588-X] and
[470-Y]
[X and Y are underneath the image- it's a graph, so it uses X and Y axis]
Now, when you find 588x, click and pull down with the slicer until you see a line vertically.
Make sure before you let go of the button that your vertical is still on 588, sometimes your hand will move. If you do
not see this number [ie: only 587 and 589] zoom in one more time.
Next, find on the left of that line 470y. click and hold until you see a horizontal line on the 470y axis. When
it's aligned, release the button. You'll see that the line does not go through the first slice, but it makes a
box in the left top corner. This is right >_< [go you!] now, on the right of the vertical line, find the 470y axis
and it should line up with the other horizontal line, to look like this: picture
7] keep doing this for all of the dimensions. When you are done, you will have 7 shapes which should look like this [ http://www.geocities.com/debbyrr/slicer3.jpg ]
8] Now, if you can, all you have to do is hit "save as" and save your file as a name in your new folder- such as, new or something. all of your slices will then save automatically in that folder, most likely named "new1x1.jpg, new1x2.jpg...". Then you should be able to just close the window and load you new slices on MT! :)
If you for some reason cannot get all of the files to save, please follow the following:
We'll have to save the individual slices. The slices are marked on the DIMENSIONS.
- click on the first slice, and the borders of slice #01 will all turn green- go to SAVE AS and save as 01.jpg in your new folder. Keep doing this process which each slice.
- hit SAVE on the skin, and close the window.
~~~Now, you will have to go to HEX COLOR CODES in order to get the codes for your userpage content. Write down all of
the colours you'll need [background, text, links, borders etc] which you want to incorporate.
Now, here is a detailed version of how to upload:
1. go to Control Panel on the left of your screen
[on MT]
2.Now as of MTv3, uploading the slices and setting the color is WAY easier. Go to your Control Panel and then Skin Builder. First is the color settings. Set your colors according to your going to be layout, which hopefully you figured out on HEX COLOUR CODES >_<
Now is uploading the slices. Scroll down a bit until you found Background Tiles. There will be slots for your color
codes and your 7 slices,
this is how you upload [in what order]
the slices you saved will have .html ones and .jpgs. Upload the .jpg ones] [they save as 01.jpg and 1X1.jpg]
1st box: 1X1
2nd: 1X2
3rd: 1X3
4th 2X1
5th 2X2
6th 3X1
7th 2X3
[dont ask why the 6 and 7 are switched around, but
they are 0_o ...]
and your set ^_^ click on Apply and Preview Usually you have to hit REFRESH twice before all of the skins/colours show
up. ^_^ That should be
it, hopefully this will help you out >_<
FAQ
1] why can't i get the zip file to work?
if you are having problems- feel free to ask me! :) I also incorporated a way to do this without the zip file, just in
case. Please read carefully above.
2] is there a Photoshop version of this tutorial?
yes indeedy! please refer to ex's PS tutorial
3] help! my skin is cut off on the top!
don't panic! MT3 cuts the top of your skins off depending on your monitor's dimensions :) let me show you how
low my actual image is on my slice on my page slice#01see what i mean?
try making your image lower on the page- you'll see it will work out :)
4]how do I make translucent or transparent boxes?
please refer to my transparent box tutorial, located here
