JASC PAINT SHOP PRO

1
JASC
PAINT SHOP PRO
VERSION 7.x
Created by:
Robyn D owsett
WebSights Internet Solutions
http://www.greatwebsights.com
968.7393
2
TABLE OF CONTENTS
Introduction to Paint Shop Pro
Resizing and Enhancing Existing
Images
Adding Text
A Note About Color
Creating a New Image
Making Buttons
Cool Effects
Using Picture Tubes
Transparent GIFS
Creating Animations with Paint Shop
Pro Animation Shop
Website Graphic Design Tips
If you Need More Help…
3
5
8
9
10
11
12
13
15
16
17
18
3
INTRODUCTION TO PAINT SHOP PRO
The Interface:
The Paint Shop Pro interface consists of:
A Workspace where you will edit and create your graphics
Toolbars that contain icons that represent different functions of the
program
A Colour Palette that allows you to choose one of millions of colours
for use in your creation.
The Browser:
If you wish to view a number of images at the same time that are
contained within a folder, you can use the PSP Browser.
To access the browser, click on:
1. File>Browse…
Within the window that appears, drill down to the folder you wish to
browse. All the graphics within that folder will appear in the window.
Within the browser you can open a graphic (have it appear on
workspace), delete a graphic, rename a graphic or look at information
for each graphic. The information menu (obtained by right-clicking on
the graphic and clicking on "information") will tell you the width and
height, file size, and number of colours contained in the image among
other things.
Toolbars and Icons
Paint Shop Pro 7 has many features and each is represented by icons
on toolbars. If you slowly run your mouse over each icon, you will see
the name of the function pop up.
4
One of the most important features you will use is the Tool Options
Window.
"Tool Options Window" Icon
Nearly each function on Paint Shop Pro can be modified with this
window. For instance if you click on the “Paint Brush” you will have to
use it at it’s default or “last used” size. But if you wish to change the
size or shape of the brush, you’ll need to open the Tool Options
Window and set the attributes there. It is a good idea to have this
little window open at all times when working on an image.
5
RESIZING AND ENHANCING EXISTING
IMAGES
Many scanned photographs are just too big or too dark to use "as is"
on a website. To decrease the file size of an image, it is wise to "crop"
anything extraneous from the photograph. Then, it needs to be resized
to reduce it to a reasonable file size so that it can download quickly. If
the photograph is dark or murky, it must be brightened or otherwise
enhanced.
Cropping:
2. Open image on workspace
3. Click on crop icon
4. Click and drag around area on image that you wish to keep
5. Using “Tool Options” window, click on Crop.
Resizing:
1. Open image on workspace
2. Increase image color depth to 16 million colors (see "A Note About
Colors" for instructions)
3. Click on “Image”
4. Click on “Resize…” to see Resize Dialog Box
5. In the “Resize type” be sure “smart size” is selected
6. Make sure “Resize all layers” is ticked
7. “Aspect Ratio” should also be ticked and left at it’s default setting
8. “Actual/Print Size should not be ticked
9. In the “Width” box set an amount smaller or larger than the width
of your image. The height will automatically be entered by the
program by choosing the best algorithm based on the current
image characteristics.
10. Click on “OK”
6
RESIZING AND ENHANCING EXISTING IMAGES
(CONT’D)
Enhancing:
Many photographs need a bit of work before they are ready to be
placed on a website or transferred to printed form. Old photographs
contain scratches or missing corners, while others may just be dark
and the subjects blurred. PSP 7 has some neat little ways to fix these
problems:
1. Open image
2. Increase color depth to 16 million colors
3. Click on Effects>Enhance Photo
You will see that there are a number of enhancement choices. Here is
an explanation of what each one does:
·
·
·
·
·
·
Automatic Color Balance…
Corrects coloring problems to create natural-looking colours in your
image.
Automatic Contrast Enhancement…
Provides your image with proper balance of highlights, shadow and
midtones.
Automatic Saturation Enhancement…
Saturation of an image determines its vividness. Saturated colors
are bright and brilliant whereas desaturated colors are faded. Use
this feature to adjust the level you wish to obtain.
Deinterlace…
This feature is for applying to video images. Some video images
contain visible scan lines caused by TV signals. This feature will
remove or fix lines that are not properly aligned.
JPEG Artifact Removal
Images saved as JPEG’s sometime have the appearance of a halo or
colour leakage around the edges. Use this feature to remove the
appearance of these “artifacts”.
Moire Pattern Removal
Sometimes when you scan an image from a glossy magazine it will
appear to have a checkerboard type pattern on it. This is called a
“Moire Pattern”. Use this feature to remove, or at least, reduce it.
7
·
·
·
·
·
Automatic Small Scratch Removal
This tool removes small scratches and noise from photographs. This
feature is meant to be used by first selecting the area containing
the scratch(es) before using the feature.
Clarify
This feature sharpens the image.
Fade Correction
This feature clarifies a faded image. Particularly useful in old
photographs.
Manual Color Correction
Use this tool to make changes to color or create unusual effects. It
adjusts colors based on hue, saturation and lightness.
Red Eye Removal
Fixes the problem of glinting red eyes in photograph subjects.
The best way to learn what these enhancement feature do is to use
them. Experiment and have fun!
If you have a version of Paint Shop Pro that is below 7, you will not
have access to the special "Enhancement" features. All photo and
image adjustments must be done manually by clicking on:
1. Colors>Adjust
2. Choose the adjustment you wish to make (brightness, contrast
etc…)
8
ADDING TEXT
To add text to an existing image:
1. Click on the Text Icon - a dialog box will appear.
This is what the dialog box will look like…
Dialog Box options:
Choose the font and font size you wish to use
Leave "kerning" and "leading" at default settings
Tick "Floating" and "Antialias"
Choose the color of your font by clicking the color square for "Fill". This
will be your main font color.
If you want an outline color for your font, choose that color in the color
square for "Stroke". If you do not want an outside color, then click on
the small black triangle and choose "Null".
Type the required text into the text workspace area.
Click "OK".
Your text will now appear as floating text on your image. You can left
click on image to move it on image to precise location. While still
floating, you can modify the text with drop shadows, cutouts etc. If
9
you do not wish to modify the text further, then right-click on image
away from text to de-float.
A NOTE ABOUT COLOUR
When you choose a color, you can do so in several different ways. You
can either click on the color wheel to get a specific shade out of
millions of colors, you can click on one of the basic colors from the
"Basic Color" chart, or you can enter RGB or HTML codes for the color
you wish to use. For instance, if you are trying to match a website
background that is #ff77bb, you can type that directly into the HTML
code box and the "New Color" box will change to reflect that exact
color.
Increasing Color Depth of an Image to 16 million Colors:
1. Open image onto workspace
2. Click Colors>Increase Color Depth>16 million Colors (24 bit)
10
CREATING A NEW IMAGE
To create a new image:
1. Click on File>New
2. Set image width and height
3. Set resolution (default is
72.000)
4. Set Background Color
5. Set Image Type (default is
16.7 million colors or 24 bit)
6. Click on OK
Note: If you wish to create a "banner" to use as a title for a webpage
for instance, then just create a new image that has about three times
as much width as its height.
11
MAKING BUTTONS
To create a button, do the following:
1.
2.
3.
4.
5.
6.
7.
Click on File>New
Set image size to 300 width x 300 height
Make background color white
Leave the rest of settings at default
Click OK
Click on the "Selection Tool"
Make sure the "Tool Options Window" is open
8. Set selection tool for rounded rectangle or rectangle, and feather to
0. Tick antialias so that it is on.
9. Using selection tool click and drag rectangle shape on new image.
Release left mouse button.
10. Click on Color Palette and choose a color, then click OK
11. Choose "Flood Fill" tool
12. Click into centre of your rectangle. (Make sure "Styles" is set to
solid color before you do this)
13. Click on Effects>3D Effects>Buttonize
14. Set buttonize so that "Transparent Edge" is ticked and set height
and width to 6. Opacity should be set to 80.
15. Click OK
16. With button still selected click on Effects>3D Effects>Drop
Shadow
17. Set vertical and horizontal to 3 or 4, opacity to 65, blur to 7. Set
dropshadow color to black.
18. Click OK
19. Using crop tool, crop image to just outside shadow.
20. Save image. (.gif or .jpg format)
Congratulations, you now have a neat little button to which you can
add some text!
12
13
PSP 7 COOL EFFECTS
Paint Shop Pro version 7 contains a lot of cool effects that can be
created that aren't available in earlier versions. Most of these effects
can be accessed under:
Effects>Artistic Effects
>Geometric Effects
>Illumination Effects
>Reflection Effects
>Texture Effects
To try these effects, first open an image, preferably a photograph.
Make sure the color depth is set at 16 million colors. Now have some
fun seeing what each one does!
Remember! If you make a mistake in Paint Shop Pro you can always
go back and delete your last steps. To do this use the "Undo" tool. It
looks like this:
14
USING PICTURE TUBES
Picture Tubes are fun to use!! Preset images are stored in each "tube"
and all you have to do is click on an image to "squeeze" one out.
Here's how to use them:
1. Open a new image (File>New)
2. Click on the "Picture Tube" icon
3. In your "Tool Options Window" you will see a preview browser of all
the available tubes.
4. Choose one by clicking on it
5. Left-click your mouse onto your blank image. Out pops an image!
6. Keep clicking…most tube sets have several different images.
To add new Picture Tubes to Paint Shop Pro
1. Download Tube set from the Internet (see chapter "If you need
More Help" for list of tube websites.)
2. If tube file is zipped, unzip it into a directory of your choice.
3. Open Paint Shop Pro.
4. Open the *.tub file that you downloaded from Internet
5. Click on File>Export>Picture Tube…
6. In the Options Box, set the cell arrangement to reflect the number
of cells in the file. In the case of the example below, you would set
"Cells Across" at 2 and "Cells Down" at 2.
7. Accept default settings for Placement Mode, Step and Selection
Mode.
8. Give tube a name
9. Click OK
15
USING PICTURE TUBES (CONT'D)
Note: It is possible to create your very own Picture Tubes. While it's
too advanced to go into in this Beginner's Manual, I recommend you
visit the following website if you are interested in learning how:
http://www.web-helper.net/PSP6/Tubes/default.htm
16
TRANSPARENT GIFS
You should only attempt to make transparent those images that have
one solid background color and are not drop-shadowed.
1.
2.
3.
4.
5.
6.
Open image in workspace
Click on file>export>gif optimizer
Be sure “Transparency” tab is selected
Click on “Use Wizard”
“Convert Matching Colors to Transparent” should be ticked
Click on color swatch, then find the exact color to match the
background of your image. You may wish to use the hex codes here
(eg: #FF0000). Click “OK”.
7. Click “Next”
8. Click on color swatch to choose the background color of your web
page. Again click “OK” and “Next” when you are finished this step.
9. Choose whether you would like to use “web-safe colors” or not.
10.Choose whether you would like high image quality or low file size.
11.Click on “Next”
12. Click on "Finish"
17
CREATING ANIMATIONS WITH
PAINT SHOP PRO ANIMATION SHOP
Have you ever drawn sequential pictures on a pad of paper and then
flipped through the paper to see the pictures move like in a cartoon?
Well that is exactly how an animation works on the Internet.
Animations are a series of photographs or graphics that are strung
together with a set timing and then compressed into one image.
I recommend you use the “Animation Wizard” to create an animation.
Here is how it’s done:
1. Click on File>Jasc Software Products>Launch Animation Shop
2. Click on File>Animation Wizard
3. Accept default settings of “same size as the first image frame”.
Click “Next”
4. Choose transparent or opaque background color
5. Accept default settings of “Upper left corner of the frame” and “With
the canvas color”. Click “Next”.
6. Decide how long you want the image to loop and how fast you want
the animation to switch between frames. (eg: 100/100th of a second
would mean that there would be one second delay between
animated frames.) Click “Next”.
7. Choose the images that you wish to include in your image. Be sure
to include them in the proper order. Click “Next”.
8. Click on “Finish” to allow the Wizard to generate your animation.
9. Your animation will now appear in the workspace showing you all
the frames that it is made up of. To view the animation click
View>Animation.
10.At this point you may save your animation.
Remember: Animations slow down web page speed performance. Use
them sparingly!
18
WEBSITE GRAPHIC DESIGN TIPS
Photographs should be saved in JPEG (.jpg) format and images with
large planes of colors should be saved in GIF format.
Never make an image smaller by setting a smaller WIDTH and HEIGHT
within the HTML code. Use PSP to resize your image smaller. Every
kilobyte counts on the Internet,…big images mean LONG download
time.
When creating website images, use tasteful and co-ordinating colors.
Also try to choose only 2 main colors with a contrasting color for
interest.
Don't create huge buttons for a website. They are cumbersome and
unattractive. Use them sparingly.
Be careful how many animations you have on a webpage. They not
only slow down the load time, too many can be very distracting.
Be careful about the font you choose for text. We all know that it's fun
using swirly celtic fonts, but it's useless to the website user if the text
is unreadable.
19
IF YOU NEED MORE HELP…
Paint Shop Pro Tutorials:
Version 7 Tutorials
http://www.puto rtutor.net/pain t/psp7.htm
Pinoy's PSP Tutorials
http://www.pinoy7.com
PSP 5 Tutorials
http://www.pspbook.com/IndexedLinks/psp5tuts.html
PSP Tutorials
http://www.grafx-design.com/psp_tut.html
Jasc PSP Tutorials
http://www.jasc.com/tutorials.asp
Picture Tubes:
Jasc Software's PSP Tube Download Page
http://www.jasc.com/tubes/tubedl.asp?
Alphabetical List of Picture Tubes
http://www.pspbook.com/IndexedLinks/TubeLinks.html
Other:
Jasc Software
http://www.jasc.com
HTML Goodies Tutorials
http://www.htmlgoodies.com
WebSights Internet Solutions
http://www.greatwebsights.com