Design HeavenDesign Heaven Banner Exchange
Deb's Photo Impact tutorials and more
 
Mask tutorial part 2
In this tutorial we will be using the mask we stored in our easy palette in part 1 to mask an image.
We will use this image:
Richard Weisser has graciously given me permission to use his beautiful photos. 
You can visit his page for more photos.  Click here.  If you wish to use any of his photos on a web site,  you may do so by asking him for permission first.
 
 
save this image Like before, you will need to save this image to your hard drive.
Now open the photo in Photo Impact.  Ctrl O will open the open dialog box quickly. Right click on the photo and click on all, right click again, and convert to object.
 
 
Now open your easy palette, and find your mask library.  If you need help with this, refer to part one where all of this was covered.  Find the peanut shape which we previously stored in the sharpen category. Double click on the thumbnail of the peanut shape in your mask library.  This will apply your mask to the image. Please note that using this method of converting your image to an object first will not allow you to edit the mask before it is applied, or resize it.  This method works well only when the image and the mask are of compatible dimensions.  If you find that this method cuts off too much of your image, you will have to skip the step of converting to an object and use the transform tool instead to make the selection the right size. 
 
Resize the peanut shaped image so that it is about 300 pixels wide. 
To help you size the image correctly, you may want to turn on the ruler feature.  Down in the right hand corner of your photo impact screen, there is an extra tool bar. 

Click on the icon I have outlined here.  More choices will open when you do this.  Click on ruler. 
Now a ruler will appear along the top and right side of your image. 
Now click on and drag the square on the bottom right corner of the image until the peanut  is about 250 pixels wide.   
Be sure to use one of the squares in one of the four corners to resize the shape.  Also push and hold down on the shift key while dragging the corner inwards with your mouse.   This will keep the image in proportion. 
Now it is time to buttonize our image.  Note that your selected area should still be the peanut shaped image.  If not, you won't be buttonizing the correct part of your image. So click on web, then button designer then any shape. 
 
 

Click on the bevel tab. Change your bevel size to 11, and your smoothness to 2.  Make sure your bevel type is the one outlined in black here. Click ok. 
Push the space bar to select the base image.  Now the white area under your peanut shape will be selected.  Resize it as explained above until it is about 310 pixels wide. 
Your image should now look something like this: 
 
Click again on your peanut shaped image, and right click on it and click on shadow. Click in the box next to shadow in the new window.  Accept the defaut settings.
 
 
We now would like to fill the bland white background with a texture that matches the picture.  Go back to your easy palette.  Click on the icon that looks like an art museum.  Click on the plus sign beside Fill Gallery, and then on Background Textures.  Double click on BT050.  You will have to scroll down a ways to find it. 
Viola!! the bland white background is filled with the texture.
This texture just happens to match  the picture very well.
Now it would be nice if we had a divider bar at the right edge of our image.  Click on the path tool, and make sure that the rectangle shape is selected.  If not, click the shape that is displayed in the area I have marked with an arrow.  You will be able to select it then. 
 Right click on the color box, and select eydropper.  With the eyedropper, click on one of the  nicer dark colors in the image.  I have selected a dark chocolate.  Now look at the illustration above again.  Where it says mode beside the color box, click on the down arrow beside the words 2d object.  Change to 3d custom.  Click on the right edge of your image, and draw a long skinny rectangle along the side.  If you get it too wide, change to the transform tool to size it the way you want it.  Now your rectangle will have edges at the top and bottom that will cause lines when viewed tiled on a web page or in stationery.  Since lines generally  prove distracting, we want to remove them.  I do this by using the transform tool to make the divider bar longer than my working space is on both top and bottom.  See the illustration to the right. Do you see how the selection lines stick out on both top and bottom?     

Now, if you wish, you can copy your divider bar and paste another one right beside it.  Ctrl - C to copy it and Ctrl - V to paste.  Arrange both bars along the right side.  You can use the arrow keys for precise positioning. 
 
 
Now we want to put our image on a strip that will cover the monitor.  First we want to select a color for the background.  Click on the eydropper tool. I have marked it here. Click on your picture on one of the lighter colors.  

This color may be a little too dark or too light for your image. If so, right click on the color box and click on windows color picker.  
You can easily select a color that is lighter or darker.  This will change your foreground color to a good color, and have it handy when we go about filling our strip in with a good matching color. 
Now, before you go any farther, change to the pick tool and   right click on the image anywhere. Click on merge all.  Now copy the whole image to the clipboard.  (Ctrl - C) 
Open a new image.  (Ctrl - N).  

Click on "active image"  

This will set the size of your new image the same as your image that is already open.  Now erase the number in the width box, (marked with an arrow here), and type in 1152.  
Any time you start a new image, you have the option of choosing a canvas color. 
 
 
So, right click on the little white box next to the word canvas, and click on Foreground color.   Now click on ok.  

 A new image will open.  Now all you have to do is paste your image on your strip.  Right click on the strip and click on paste.  Your image should appear already lined up with the left side. Be careful not to move the image at all, or you will get an unwanted line  Right click and merge all. 
Now we need to optimize or shrink the size so that your friends won't have to wait  forever when downloading their mail.  I like to keep the size under 60 kbs if at all possible. 

Now click on web in the menu bar and click on Image optimizer. 
This will open another box. In this box, you will see your image shown in two boxes.  The one on the left is the uncompressed version, and the one on the right is the compressed version. You will only see the background color of your strip when the box opens.  

Point to and click on the image, and slide it to the right so that you can see the image, and not just the background. 
Here I have used the illustration from the Clip art tutorial, so don't get confused. 
 
 Make sure you have jpg selected.  

Use the slider to adjust the level of compression, while noticing the differences the compession level makes in your image.  Slide it far enough back to the left until you begin to see a difference, and then back up just enough so that you see no difference.  This will give you the most compresed image possible while your end product is still attractive.  Be aware, that if you fill your background strip with a texture, the more textured it is, the higher the size of the end product. While textured backgrounds can be very attractive,  they are also quite costly to the size, and should especially avoided in web backgrounds. 
Kathy Olsen's Outlook Express Tutorials Rather than do a tutorial of my own on the stationery wizard, I'll leave you in the capable hands of another stationery creator.  Kathy has wonderful tutorials on the wizard, adding background sound, and adding a scrolling script to your stationery.
 Here is a small version of my finished product.  To see it tiled on a page, Click on the image.
 
 
 
 Your homework? Take the other masks and practice this tutorial until you don't need the tutorial any more.  Get creative and use your own ideas and graphics.  Have fun!
 
See my stationery made with Photo Impact
 
Click here to visit my main site, and see my stationery and backgrounds.
 
go back to part 1click here for tutorials home
 
E-Mail me
E-Mail me
 
 
Please sign my guestbook.  It would mean so much to me to know what you thought of my pages.
 
  
Subscribe to Debs_PhotoImpact_Tutorials 
Powered by www.egroups.com