|
Black Day To preview the completed lesson please click here. To download all of the graphics and midi file for this lesson, please click here. There are no tutorial graphics provided for this lesson. Should you have any problems with this stationery, please contact me by using the link on the front page or within the group. Open up Scrippy and start a new stationery. Save this as BlackDay-lesson.ssc into your ssc directory and remember to save as you go along and add new features, just in case. Please submit this as BlackDay-lesson when you send it in to the group. Go ahead and insert a loading message and click on where it is checked 'use a loading message'. This will turn this feature off while you are following the lesson. You may return to it at the end and install a loading message of your choice. Insert a background and find the water-bg1.jpg graphic. This doesn't need to scroll. Next put in a frame, make it 10 pixels wide, double style and check 'place over background'. Now go to edit/copy frame and then paste this frame so that there are a total of two. Make it black. Now we need to insert a positioned container. Set the left and right margins to 73. Make this 370 pixels from the top and 30 pixels from the bottom. These settings are all on the right so you will have to check 'set left and right edges' and 'set top and bottom edges' for this to darken in and be usable. Next under this container you will need to put in another back ground and will use the same graphic. This also will not scroll. Next, click on the positioned container and then click on your paste icon to insert two more of those frames. Click on the positioned container again and then go to insert - container - positioned container. That makes this a sub-container and it should be under the frames and even with the frames. If it did not go under those two frames, grab it with your mouse, left-click, and move it to under and even with the frames. Let go of the mouse to release it. Set all of the margins in this sub-container at 20. That is, 'set left and right' and 'set top and bottom' margins to 20. Under that subcontainer you should insert another background and this time use the graphic called water-bg3.jpg. This doesn't scroll either. Click on the loading message and then go to insert - container- positioned container. Naturally it won't go to the right spot, so please move this one down to the very bottom of your scrippy master. This container should be even (all the way to the left margin) with the very first main container that you inserted. This also is a main container. Set horizontal to center, distance of 7 and size of 39. Set this in vertical from the top 138 pixels and size of 70. Put in a background now under this container and use the graphic called smwater3.jpg. Scroll this down, and set the transparency to 70 but don't change anything else. This is what makes your water appear to be moving. This graphic is the same size exactly as the water cut-out that we will put in. Click on the loading message again and insert another main container. Put this all the way at the bottom under everything else and make sure it's at the left, even with the first container. In the horizontal layout, leave this set at centered and with a distance of 0. Set specified size at 400. For the vertical layout, set this at 'top' and with a distance of 50. The specified size here is 300. Go to insert - positioned object - positioned image and insert it. Now browse for the graphic called splash.gif. This is the waterfall cut-out. For the settings of the positioned image, horizontal is set on center and distance of 11. This means that this image will be 11 pixels left of the dead center of the container that it is sitting inside of. For vertical, set it to the top and with a distance of 90 pixels. This means it will be 90 pixels from the top of the container. This aligns it with the hole that will be there once we put in the main image. Set the transparency of this image to 30. We are doing that so that the water movement can be seen. The water movement is the water graphic we've already inserted. Next we need to put in a background. This again is a water movement image. Browse for the graphic called smallwater.jpg. Set this to scroll down and change nothing other than the transparency which needs to be 50. Insert another positioned image by first clicking on the container we are working in and going to insert - positioned object - positioned image. Move this to the bottom. Use the graphic named water1.gif. If you preview it now, you'll see that this graphic is the main image that has the water cut out from it. This needs to be set horizontal centered and vertical from the top. The numbers aren't changed here. The transparency is not changed either because we already have some holes in it where we took out the water parts. Click on the container again and insert another positioned image. Browse for the image called bottomleft.gif. Set it horizontally from the left and vertically from the bottom with a distance of 2. And set this transparency to 30. This is the bottom left portion of the water that got cut out and it needs to be a little transparent so our water movement shows up. We need another positioned image to be inserted under this container. All of these features, the background and all of the positioned images are even with each other. Placement of these features DOES matter in this stationery. If you don't put something where I ask you to, then this stationery might not work correctly. So be sure to put everything where I say, ok? The image you need is called topwater.gif. This is the cut-out of the top water portion. It is set horizontally centered with a distance of 0. For vertical it is set from the top at 157 pixels. The transparency is set at 20. Now if you do a preview you will see the basic stationery. The graphics should all be in the proper place. Since I have changed my resolution to 1024 I am hoping that this will still work fine, I believe it does as the ssc file I am working from was done when I was still set at 800 resolution. If you see holes where the water is showing through then you may need to adjust the placement of the water.gif graphics by 1 either way. If you want to use your own graphics, I will give instructions for doing so at the bottom of this lesson. I cannot, however, give you the numbers for any graphic but this one. Ok, let's go on. Now please click on the very first container which you inserted and insert another one. Move it all the way down to the bottom and make sure it's at the left, assuming it's position as a main container. Horizontal is center, distance of 0 and specified size of 440. Vertical is from the top, 30 pixels and a specified size of 340. Let me explain this. We are going to insert two more frames here which will go around the main image. Instead of putting on a frame in PSP, I simply chose to frame it here. This is much quicker and easier and I like the way that it looks! Since our main image is 400x300, we need 20 pixels for each additional frame and we are putting in two frames. If you wanted to put in a third frame, you would just increase the container size to 460 and 360. Now if you haven't used your copy feature since you did those earlier frames, you can now just click on the last container you just inserted and then the paste icon to put in two frames. These are just 10 pixel, double, placed over the background, black frames. At last! We need a message area so go ahead and insert one. Now PLEASE be sure to put this message area at the very bottom of everything else and it goes to the left, it does NOT sit under any container! If you put it under a container, it will NOT work. And by under, let me reiterate the definition of that, by under I mean sitting inside of that container, it shows up underneath and to the right of the container. That means it is underneath the container and inside of it. When it sits below the container and to the left, that makes it NOT inside of the container :) Everything that you put which is inside of any container is always going to be indented. Ok :-) Set the left and right margins to 80. The top margin is 375. The bottom margin is 40. Make your text centered. Now go into the scrollbar colors and choose black. Please insert a ticker next. Type something in there and perhaps here you could say 'Made by your name on such and such a date' if you'd like! Now the only thing left to do is add in our sounds. Insert four sounds here, and their placement doesn't really matter one bit. I have all four of mine at the bottom but yours don't absolutely have to be at the bottom. Sound #1 is rattlesnake[1].wav. It is set to play only 3 times. Sound #2 is birdsch1.wav and is set for continuous play. The original wav file I was using for the bird sound was 183kb's and I had to replace it. Sound #3 is waterrunning.wav and is also set to continuous play. Sound #4 is frog-ribbet2.wav and is set to play only 3 times, as well the volume was changed to 95. There! You are all done. Just make sure that your graphics are in the right place and that the water.jpg doesn't show through any holes around the edges of your water.gif images. Go to File/Export Stationery and save this as BlackDay-lesson.htm in your stationery directory! Making Your Own Water Image In order to use a different image than the one featured for this stationery, first resize the image to a manageable size. Now enlarge it so that you can see the water portions better. Use your lasso tool and draw around the water areas. Draw outside of them rather than inside of them. This hopefully prevents any holes from showing up. If you try to fit it exactly you are setting yourself up for holes along the edges of your image. Cut that water out and save it as a gif. Give it some name you can remember to designate it's position. If you have water that is in more than one area you can cut them out separately. Once your water is cut out, save the main image as a gif and keep the transparency. Now go back to your water cutout image and use it to make the water that will flow behind your image, this is what will move to cause the water effect. Either use a filter or some water image and then merge all layers if needed and save that as a jpg file. As far as placement of your cutout images, this is a mathematical event, so I don't even try to do mine that way. I just put it in the scrippy and start moving it around until I get it where I want it. That is about all I can really tell you as far as preparing your own image. But remember, the larger your main image is, the poorer quality it will be since it is going to be a gif. One way to get around this is to save a portion of your main image as a jpg and only save the other portion with the cutouts as a gif. This will help your picture quality a little. This lesson may be saved to your home computer and printed out at will. It may not be reproduced in any form for the pursuit of profit. This is a freely shared tutorial for anyone desiring to learn the Scrippy program, including Yahoo Groups. ŠOzmee 2002 |