
This one is, admittedly, a bit macabre. But you never know when youmight need a few free-floating eyes for your webpages or artistic compositions.The tutorial was actually inspired by the work of Ann Stretton, of ,whose wonderful webgraphics and unique style are a constant source of amazementto me. The interfaces she recently put up on her pages had all of theseanimated eyes, and, of course, I saw those and went Hmmm......
To complete this tutorial, you'll need a freeware third party plugincalled Filter Factory Gallery R. You can get it at . You will also need to convert the plugins in the gallery to .8bf formatusing Plugin Commander. You can get Plugin Commander (the main address is http://pico.i-us.com/.) For info on installing filtersand using Plugin Commander, go to the Paint Shop Pro User's Group page(the main address is http://www.pspug.org.)
Start by opening a new file, 100 x 100 pixels with 16 million colorsand a white background (File: New.) Change your foreground color to a medium-darkgray (RGB 128, 128, 128) and Flood Fill your new window. Be sure the toolis set to fill with a Solid color. Next, choose your Selection tool fromthe tool bar. Set your Selection Type to Circle, Feather to 0, and checkthe Antialias box. You may want to go to the second tab of the Tool Optionspalette and select the box that says Use Precise Cursor. It will make therest of this tutorial easier.
Now position your cursor dead center in the middle of your window.If you look at the lower left corner of your PSP screen, you'll see yourcursor location displayed. If you started with the same window size thatI did you'll want your cursor at a position of 50,50. Draw a circlethat is ALMOST the width of your window. make sure that there are stilla few pixels unselected at the edges. remember, with Antialias checkedyour final circle selection will be a a couple of pixels wider than yourselection guide suggests.
![]() | ![]() | ![]() | ![]() |
Now change your foreground color to a light gray (RGB 221, 221, 221.) Select your Flood Fill tool and use it to fill the intereior of your selection. We are going to want a few pixels of the darker gray inside the circle,so after you do the Flood Fill, Exapand your selection by 1 pixel (Selections,Modify: Expand.)
![]() | ![]() |
Here's where we create the spherical look of the eye. These nextfew steps are similar to my 3D sphere tutorial for PSP 5. Apply a WindDeformation to your circle selection (Image, Deformations: Wind.) Set theDirection from the left, and the Strength to 15. You should now have somesubtle shading.
![]() |
To complete the sphere, add a Gaussian Blur (Image, Blur: gaussianBlur.) Use a Radius setting of 3 or 4. Now save your selection forlater use (Selections: Save to Alpha Channel.) Be sure to give the selectiona name that you'll remember. We'll need this selection later to removethe eye from the gray background. Finally, release your selection by hittingCTRL D.
![]() | ![]() |
Next, we create the Iris of the eye. Open a new file, 60 x 60 pixels,with 16 million colors and a white background. If your eye is larger orsmaller than the one that I made, you may need to change the size of thisnew window. The width of this window is going to be about the width ofyour eye's Iris.
You will need to have Filter Factory Gallery R installed for thisstep. If you have not installed it already, look at the second paragraphabove for the information you need. Click on the Image menu heading andscroll down to Plug-in Filters at the bottom of the menu. Move over tothe heading for Filter Factory Gallery R, and choose the filter Sinfinityfrom the menu. Sinfinity, by the way, was created by Harry the Raver, authorof Plugin Commander. Apply the filter with the default settings. If yourwindow was larger or smaller than 60 pixels, you may need to adjust theRadiality slider so that the first dark ring is just inside the edges ofyour window. You should get a very nice yellow/gold radial pattern. Nowchoose your Selection tool, set the Selection Type to Circle, Feather to0, and check the Antialias box. Center your cursor in the window (position30,30) and draw a circle almost to the edge of the window. Copy your selection(Edit: Copy.)
![]() | ![]() | ![]() |
Now we add the Iris to the eyeball. Return to your original windowand paste your selection as a new layer (Edit, Paste: As New Layer.) TheIris should appear perfectly centered.
![]() |
Yellow is perfectly acceptable as an eye color, but it really isn'tall that common. I personally prefer blue or green. You can changethe color of the Iris by adjusting the Hue. Go to Colors, Adjust: Hue /Saturation / Lightness. For Blue, set the Hue to -57, and the Saturationand Lightness to 0. For Green, use a Hue setting of -82, and edge the Lightnessdown to -11.
![]() | ![]() |
When I posted this tutorial, I hadn't found any settings that gavean acceptable brown eye color. Since then, two kind contributors, and have sent in settings that give a dark brown (HSL 94, -64, -46)and a light, sort of Hazel brown (HSL 93, 93, -50.) Thanks!
![]() | ![]() |
Next, we add the Pupil. First, create a new Raster Layer (Layers:new Raster Layer.) Now se your foreground color to black. Choose your Shapestool, set the Shape Type to Circle, the Style to Filled, the Line Widthto 1, and check the box marked Antialias. Be sure that the Create as vectorbox remains UNchecked. Center your cursor again (position 50,50)and draw a circle whose edges reach almost to the edges of the lighterinner circle of the Iris.
![]() | ![]() |
All we really need now are highlight reflections to complete the3D look. First, add a new Raster Layer (Layers: New Raster Layer.) Thenchange your foreground color to white and choose your Shapes tool again.Change the Shape Type to Ellipse, and leave the Style as Filled and theAntialias box checked. Position your cursor over the edge of your Irisat the upper left, and draw a small white ellipse. We actually want theellipse to be at about a 45 degree angle, so we're going to adjust it usingthe Deform Tool. When you click on the Deform tool a box with deformationgiudes and handles will appear around your ellipse. Move the cursor overthe handle coming from the center, until the cursor changes into a pairof curved arrows. Hold down the left button key and drag the handle untilthe box is at an angle as shown below. Release the mouse button and pressthe Apply button on the Tool Options palette.
![]() | ![]() | ![]() |
The highlight is just a bit too sharp, so we need to fuzz it a bit.First, apply a Motion Blur (Image, Blur: Motion Blur.) Set the Angle to45 degrees, and the Intensity to 5 pixels. To finish, add a small GaussianBlur (Image, Blur: Gaussian Blur. Use a Strength setting of about 2-3.
![]() | ![]() |
To add a little more life to the eye, add a small reflection nearthe Pupil. First, create yet another Raster layer (Layers: new raster Layer.)Choose your Shape tool again, with the shape type set to circle. Just insidethe inner edge of the pupil, add a small white circle. Leave this circleunblurred.
![]() | ![]() | ![]() |
If you want your Eye staring straight out at you, your creation isalmost complete. To free the eye from the gray background, first recallthe sleection we saved earlier (Selections: Load from Alpha Channel.) Copya merged version of your image (Edit: Copy Merged.) A merged copy willget all of the details on all the layers we've create.
![]() |
Now just paste the Eye as a new image (Edit, Paste: As New Image.)The checkerboard background will indicate the transparent areas aroundyour Eye. Your creation is now ready for use in any project you could imagine.
![]() |
If you want your Eye to look in a direction other than straight ahead,skip the cut and paste in the last step and instead go to your Layer palette.Turn off the Visibility of all of your layers except the ones containingthe Iris and the Pupil. In the Layer palette you can do this by clickingon the little glasses next to each of the layers. A red "X" over the glassesmeans that the layer is not visible. If you have created your layers inthe same way that I did here, the left side of your palette should resemblethe one shown below when you're done.
![]() |
Now, make sure that one of the visible layers is selected (as shownabove) and go to Layers, Merge: Merge Visible. This will merge your Irisand Pupil so that we can move them around and manipulate them as one piece. At the moment, your Iris and Pupil should still be the only thingsvisible.
![]() |
To make the Eye look to the left or right, we use the Deformationtool again. When you click on the tool, the Deformation guide andhandles should appear around the edge of your Iris. Left click on the squarehandle on the right side of the box and hold down your mouse button. Dragthe handle to the left until the box is a third to a quarter smaller thanit was. When you release the mouse button, your iris and pupil should changesize to fit the Deformation box. Now click on the handle in the verycenter. Drag the box to the left (or right) of your Eyeball and realeasethe mouse button. You want the iris almost to the edge, but with a littlebit of the white of the Eye still showing. Try not to move the iris upor down when you do this, or your Eye will look lopsided. When you'rehappy with the positioning, click the Apply button on the Tool OptionsPalette. After you've done the deformation, you may want to sharpen theIris a bit (Image, Sharpen: Sharpen.)
![]() | ![]() | ![]() | ![]() |
All we need to do now is move that tiny little circle reflectionback over the Pupil. You can do this by choosing the Mover tool (it lookslike a four way arrow in the Tool Bar) and carefully clicking on the reflectionand dragging it. You may need to zoom in to hit the right spot. Remember,if you accidentally move the wrong layer the UNDO feature (Edit: Undo)can easily fix your goof.
![]() |
To free the adjusted eye from the background, just call up your savedselection (Selections: Load from Alpha Channel), Copy (Edit: Copy Merged),and Paste (Edit, Paste: As new Image.)
![]() |
In case you're thinking that there can't possibly be any realuse for this tutorial, just remember...you never know when you might needa new mascot for your website. No telling WHAT might slither up from thedepths of your imagination then.

![]()
![]()
![]()
| Looking for HRM reviews check this site.. |
| XML sitemap is generated with XML sitemap generator Web tool by Emergency Soft |