PI5 Snowglobe Kit

animated snowglobeSnowglobes are becoming more and more popular, particularly on postcard sites. Web TV visitors tell me they love them because they don't need java to see the animation. Be warned though, that making snowglobes can be addictive! 

This tutorial shows you how to make a snowglobe with a jeweled chalice-shaped base in PI 5.0. Use any picture you like for the globe, or use this image by one of my favorite artists, Arthur Rackham, whose illustrations I collect.

You can make the objects for the snowglobe yourself, or you can download the PI 5.0 UFO snowglobe kit, which includes the globe object, the 3 objects making up the base, and the center decorative jewel. Remember that these objects can only be used in PI 5.0.)

Open the image you'll use for the snowglobe and minimize it while you make the snowglobe. Start by creating a new True Color file 300 X 300 pixels. Select the Path Drawing Tool, choosing 3D Round from the Mode dropdown list. Open the EasyPalette's Material Gallery, select Plastic, and double click on Remove Material, to make sure that you don't start out with any pre-existing effects.

Draw an ellipse that is slightly wider than it is tall, so that the image will fit into it easily. You should end up with a dull gray, 3D globe, as shown below

globe shape

We need to mix up the glass overlay in the Material box. If you didn't import the Material Gallery Preset called Droplet 1 from PI 4.2, here's how to make it in PI 5.0, but you'll need water4.jpg from PI 4.2. If you don't have it, get it here and copy it into the PI 5.0 Textures folder before proceeding.

While the gray globe is active, click on the Material button in the Attributes toolbar. When the Material dialog box opens, click on the tabs listed below and select the following options:

Color/Texture tab: TEXTURES/water4.jpg
Transparency tab: 97%, Minimum transparency=30%
Border/Depth tab: Border=5, Depth=24 (In)
Shading tab: Phong, Shininess=21, Strength=76, Specular color=white, Ambient color=gray
Light tab: 1 Light (Direct) 

This glass preset has a faint blue tinge that goes well with this particular image. If you use a different one, feel free to choose any other color or texture of glass that compliments your snowglobe.

If you want to save this Droplet effect to a Gallery in your EasyPalette, click on the Add button. When the Add to EasyPalette box opens, give the preset a name and click OK.

Click OK to apply the glass effect to the globe (shown below)  and to close the Material box.

glass overlay

Hit Ctrl+C to copy the glass globe into the Clipboard, then choose Edit, Paste, As a New Object. The new glass globe opens in its own window in the work space. Minimize it for use later.

Click on the blue task bar of the image you'll use in the snowglobe. Click on the Copy button to copy it into the Clipboard. Return to the original glass overlay by clicking on the blue task bar. From the Attributes toolbar's Mode dropdown list, choose Selection. This turns the glass object into an elliptical selection. 

Choose Edit, Paste, Into Selection. Don't click yet! The selection will be "stuck" to your cursor and you can move the image around inside the selection. When it's positioned the way you want it, click to fix the image inside the selection area.

From the menu bar, select Object, Convert Object Type, From Image to Path.

pasting image into selection

Click on the minimized blue glass overlay's task bar to activate it. Use the Pick tool to drag it onto the image globe. We're going to align the image globe and the glass perfectly, then turn them into a single object. 

While the glass overlay is still active, hold down on the Shift key and click on the image globe. Doing so selects both of them at the same time. Choose Object, Align, Center Both, which centers the glass over the image globe. Now right click and choose Combine as Single Object. From now on you'll be able to move them together as a unit. Click in the base image to deactivate the globe.

adding glass overlay

Select the Path Drawing Tool again to begin making the bowl part of the snowglobe base. Open the EasyPalette's Material Gallery, click on Plastic, and double click Remove Material. Doing so gets rid of the glass preset and restores the plain gray default color.

In the Attributes toolbar, choose 3d Round, and Custom Shape from the Shape list. When the Custom Shape box opens, scroll down and select Plaque 5. This just happens to be the perfect shape for a snowglobe base. Click OK to close the box.

Shape for base

Draw the shape about this size, so that it will fit underneath the globe, cupping it. In the Attributes toolbar, drag the Border slider to the left to flatten out the 3D bump in the center of the shape.

base object

Since the object is curved down, we need to flip it. Choose Edit, Rotate & Flip, Flip Vertically. Use the Pick or the selection tool to position the shape under the globe, as shown. All by itself, this path object is enough of a base for a snowglobe, but we're going to do something a little fancier with it.

flipping base

To shorten the sides of the bowl and create a slightly different shape, choose the Path Edit tool, shown below.

path editing tool

In the Attributes toolbar, click on the Toggle button to enter Path Edit mode. Make sure that the "Edit point" option is selected -- the other two options add and subtract control points, which we don't want to do here.

path edit tool, toggle button

Once you click the Toggle button, you'll see the Path shape. Click anywhere on the path to reveal 4 large square red control points (and 2 smaller red squares which edit curves). Click on the lower left control point and the center of it will become hollow, indicating that it is the active control point. Drag it up in a straight line, so that it's just underneath the top left control point.

edit control points

Click on the lower right control point and drag it up so that it's just under the upper right control point. The two sides should match. If necessary, drag on the smaller red squares (arrow), which control the shape of the left and right sides of the curve, to create a symmetrical bowl shape.

shorten the other side and reshape curve

Click on the Toggle button to get out of Path Edit mode. Select the Path Drawing Tool again. Adjust the Border slider in the Attributes toolbar, if necessary, to create a relatively smooth surface. 

after editing path

The bowl is a bit too deep, so click on the Transform tool. In the Attributes toolbar, select the Resize option. Drag the bottom center control point only slightly upward to make the bowl more narrow.

transform tool makes bowl more narrow

Select the Path Drawing Tool again. Now we'll apply a warm, textured copper finish to the base. Open the EasyPalette's Material Gallery and choose Metallic. Double click on Copper 6. From the Material Gallery, select Bump and double click on Sandpaper, to add a little texture. 

Finally, to add some darker areas and bring up detail, from the Material Gallery select Reflections and double click Ribbons 2. Click in the base image to deactivate.

adding metallic, bump and reflection

In the Attributes toolbar, select the Ellipse shape. Draw a flattened oval base, as shown at left. The textured copper preset will appear automatically, unless you have cleared it. Click in the base image to deactivate. 

creating flattened ellipse stand

The last part of the base is the stem, connecting the bowl to the flattened ellipse. In the Attributes toolbar, click on Custom Shapes. When the Custom Shapes box opens, choose Round Shape 4 and click OK. 

shape for stem

Use the Pick tool to position the stem so that it bridges the bowl and the flattened ellipse. While the stem is active, from the Attributes toolbar Options choose "Send to Back." Click on the flattened ellipse to make it active, then choose "Send to Back." 

position stem to bridge other parts

Small bits of the upper edges of the bowl may extend into the globe. To create a nice, clean line, click on the globe with the Pick to make it active. In the Attributes toolbar's Options, select "Bring to Front." Fine tune the placement of all of the objects making up the snowglobe. When you are satisfied with the arrangement, click on one object, then hold down on the Shift key while clicking the rest of the objects, selecting all of them at one time. Right click and choose "Combine as Single Object."

globe positioned on base and combined

You'll notice that now you can move the snowglobe around as one object in the base image. Since it's an object independent from the base image, you could fill the background with any color or texture you desire. Since we'll be making an animated snowglobe from this one, leave the base image white. If you plan to put your snowglobe on a web page with a certain color or texture in the background, this would be a good time to fill the base image with that color or texture. Yes, you can make the background transparent in the GIF Animator, but the success of transparent backgrounds can be variable, depending on the color of the web page background, so I rarely use that technique. 

To make a jeweled decoration for the snowglobe base, return to the Path Drawing Tool. The textured copper settings should still be in effect. From the Attributes toolbar's Shape options, choose Ellipse. Draw a small, widened oval that will fit in the bowl portion of the base.

making a jewelIn the Attributes toolbar, click in the Color box and choose a color from the bottom row of the standard colors or one of the Color Pickers.

To get a jeweled effect, I applied one of the Advanced options from the PI 4.2 Any Shape Button Designer to create a glassy amber that goes well with the other colors in this image. The jewel is included in this tutorial's UFO snowglobe kit. If you didn't Import the PI 4.2 Advanced options (which make stunning jewels) into PI 5.0, I've made a ZIP file of these presets available so you can Import them.

Position the amber jewel in the center of the bowl part of the base with the Pick tool. Click in the base image to deactivate the jewel. Choose the Object Clone tool. In the Attributes toolbar, click on the Open button and select the Silver Ball object. Click once in the base image to make a silver ball, which will be too large for our purposes. Click on the Transform tool and choose Resize from the Attributes toolbar options. Hold down on the Control key while resizing the silver ball smaller, constraining the height to width proportions. 

Hold down on the Control key while dragging the small silver ball, creating a duplicate. In this manner, make 8 small silver balls altogether. Use the Pick tool to position the silver balls around the edges of the amber jewel in a flower shape, as shown at left. Click on the center jewel to make it active, then choose "Bring to Front" from the Options in the Attributes toolbar. 

Right click and Merge All. Use the standard selection tool, with the shape set to Rectangular in the Attributes toolbar, to select the snowglobe, then click on the Attributes toolbar's Crop button to get rid of the excess space.

jewel added to base

To make the animated snowglobe, you'll need to make a series of at least 3 images with the Snow Particle effect applied to the globe only. These images are imported into the GIF Animator. I usually make 5 or 6 images or "frames" because, inevitably, some frames just don't work well and have to be discarded. 

We need to isolate the globe for the Particle effect. Usually I just drag a copy of the glass overlay over onto the globe, choose the Path Drawing Tool, and from the Mode dropdown list pick Selection. However, we can't do that in this example, because the flower jewel extends up into the globe. 

Instead, choose the Lasso selection tool with Sensitivity set to at least 5 and "Snap to edges" selected. Click and drag around the edges of the globe. Double click to close the selection. Don't worry if the selection looks a little raggedy, as long as you stay reasonably close to the edges of the globe and don't extend into the base.

use lasso to select the globe only

To create the first frame of the snowglobe animation, open the EasyPalette's Particle Gallery, Snow. Right click on Snow 2 and choose Modify Properties & Apply. 

When the Particle box opens, take a look at the Preview window to make sure that you have a pleasing distribution of snow. If not, hit the Random button until you like what you see, then click OK to apply the snow. 

apply snow particle effect to globe

Right click and Merge All. Choose File, Save As, and save this snow-filled image as frame1.bmp. I usually save frames for animated snowglobes to my Desktop so I can find and delete the frames easily. Return to the snowglobe image and right click, Undo, 2X, so that you're back to the selected globe again.

Right click on the Particle Gallery's Snow 2 and pick Modify Properties & Apply again. When the Particle box opens, click on the Random button to get a different distribution of snow, then click OK to apply. Right click and Merge All, then save this image as frame2.bmp.

Continue in this manner until you have saved 5 or 6 frames. Open the GIF Animator and use the Animation Wizard to insert the frames. I fiddle around with the order of the frames and delete 2 to 3 of them, keeping only the best ones. Aim for a logical movement, like snow falling and drifting, or swirling in a circular motion. I usually use 3 to 4 frames per animation, depending on the size of the frames. Remember that while more frames creates a smoother, more varied snowfall effect, it also creates increasingly larger file sizes. Be sure to use the Optimization Wizard to balance file size against image quality when saving.

Generally, I keep my animated snowglobes under 75 kb. for speedy download. A word to the wise -- there is hardly anything more annoying than waiting for a page with 5 or 6 (or more) animated snowglobes to download. You don't want people to just give up and leave after all your hard work, do you? If you plan to put more than one snowglobe on a web page, consider making thumbnails that visitors can click on to view your full-sized snowglobes on a separate page. 

Finally, remember that you can make snowglobes without snow -- try the other Particle effects too. I love to make animated globes with Fireflies, and have had fun increasing the number of spikes on the Stars to create a twinkling star effect. Experiment!

Do not duplicate, translate, copy, archive, appropriate or redistribute this document.



Back to Homepage