Editing your sprites

Up to now we loaded our sprites from files. It is though also possible to create and in particular modify them within Game Maker. To do this, open the sprite property window by double clicking on one of your sprites (or by creating a new one). Now press the button labeled Edit Sprite. A new form will appear showing all the subimages that make up the sprite.

The sprite edit form will look as follows:

At the right you see the different images that make up the sprite. Note that in Game Maker all subimages of a sprite must have the same size. At the left an animation of the sprite plays. (If you don't see the animation, check the box labeled Show Preview.) Below the preview you can change the speed of the animation and the background color. In this way you can get an idea of what the animation will look like in the game. (Note that this speed is only for preview. The speed of the animation during the game depends on the room speed.)

The sprite editor contains many commands to create and change the sprite. These are all given through the menus. (For some there are buttons on the toolbar.) Some commands work on individual images. They require that you first select a subimage with the mouse.

File menu

The file menu contains a number of commands related to loading and saving sprites.

• New. Creates a new, empty sprite. You must indicate the size of the sprite. (Remember, all images in a sprite must have the same size.)
• Create from file. Creates the sprite from a file. Many file types can be used. They all create a sprite consisting of a single image, except for animated GIF files that are split into the subimages. Please note that the transparency color is the bottommost leftmost pixel, not the transparency color in the GIF file. You can select multiple images which will then all be loaded. They must though have the same size.
• Add from file. Adda an image (or images) from a file to the current sprite. If the images do not have the same size you can choose where to place them or to stretch them. You can select multiple images which will then all be loaded. They must though have the same size.
• Save as GIF. Saves the sprite as an animated gif.
• Save as strip. Saves the sprite as a bitmap, with all images next to each other.
• Create from strip. Allows you to create a sprite from a strip. See below for more information.
• Add from strip. Use this to add images from a strip. See below.
• Close saving changes. Closes the form, saving the changes made to the sprite. If you don't want to save the changes, click on the close button of the window.

Edit menu

The edit menu contains a number of commands that deal with the currently selected sprite. You can cut it to the clipboard, paste an image from the clipboard, clear the current sprite, delete it, and move sprites left and right in the sequence. Finally, there is a command to edit an individual image using the built-in painting program (see below).

Transform menu

In the transform menu you can perform a number of transformations on the images.

• Mirror horizontal. Mirrors the images horizontally.
• Flip vertical. Flips the images vertically.
• Shift. Here you can shift the images an indicated amount horizontally and vertically.
• Rotate. You can rotate the images 90 degrees, 180 degrees, or an arbitrary amount. In the latter case you can also specify the quality. Experiment to get the best effects.
• Resize Canvas. Here you can change the size of the canvas. You can also indicate where the old images are placed on the new canvas.
• Stretch. Here you can stretch the images into a new size. You can indicate the scale factor and the quality.
• Scale. This command scales the images (but not the image size!). You can indicate the scale factor, the quality, and the position of the current images in the scaled ones.

Images menu

In the images menu you can perform a number of operation on the images.

• Cycle left. Cycles all images one place to the left. This effectively starts the animation at a different point.
• Cycle right. Cycles all images one place to the right.
• Black and white. Makes the sprite black and white (does not affect the transparency color!).
• Colorize. Here you can change the color (hue) of the images. Use the slider to pick the different colors.
• Colorize Partial. Here you can change the color (hue) of part of the images. You can select an old color and a range around it and then indicate the new color with which to replace this range of colors. This can be used for instance to change only the color of the shirts of players.
• Shift Hue. Another way of changing the color of the images. But this time the colors are shifted over the amount indicated giving rather interesting effects.
• Intensity. Here you can change the intensity by providing values for the color saturation and the lightness of the images.
• Invert. Inverts the colors in the images.
• Fade. Here you specify a color and an amount. The colors in the images are now faded towards this color.
• Transparency. Here you can indicate a level of screen-door transparency. This is achieved by making a number of pixels transparent.
• Blur. By blurring the images the colors are mixed a bit, making it more vague. The higher the value, the more vague it becomes.
• Outline. Creates an outline around the image. You are asked for the color and whether the current images must be removed (keeping only the outline) or whether the outline must be drawn on the image.
• Boundary. Similar to the outline but this time it is not drawn outside the image but on the boundary pixels of the image.
• Crop. This makes the images as small as possible. This is very useful because the larger the images, the more video memory Game Maker will use. You might want to leave a little border around the images though to avoid transparency problems.

You will have to experiment with these commands to get the sprites you want.

Animation menu

Under the animation menu you can create new animations out of the current animation. There are many options and you should experiment a bit with them to create the effects you want. Also don't forget that you can always save an animation and later add it to the current one. Also you can always add some empty images and delete unwanted ones. We will briefly go through the different possibilities.

• Set Length. Here you can change the length of your animation. The animation is repeated enough times to create the number of frames you indicate. (Normally you want this to be a multiple of the current number of frames.)
• Stretch. This command also changes the length of the animation. But this time, frames are duplicated or removed to get the right number. So if you increase the number of frames the animation goes slower and if you decrease the number it goes faster.
• Reverse. Well, as you could guess this reverses the animation. So it is played backwards.
• Add Reverse. This time the reverse sequence is added, doubling the number of frames. This is very useful for making an object go left and right, change color and return, etc. You sometimes might want to remove the double first and middle frame that occur.
• Translation sequence. You can create an animation in which the image slightly translates in each step. You must provide the number of frames and the total amount to move horizontally and vertically.
• Rotation sequence. Creates an animation in which the image rotates. You can either choose clockwise or counterclockwise rotation. Specify the number of frames and the total angle in degrees (360 is a complete turn). (You might need to resize the canvas first to make sure the total image remains visible during the rotation.)
• Colorize. Creates an animation that turns the image into a particular color.
• Fade to color. Creates an animation that fades the image to a particular color.
• Disappear. Makes the image disappear using screen-door transparency.
• Shrink. Shrinks the image to nothing. You can indicate the direction.
• Grow. Grows the image from nothing.
• Flatten. Flattens the image to nothing in a given direction.
• Raise. Raises the image from a given direction
• Overlay. Overlays the animation with another animation or image in a file.
• Morph. Morphs the animation to an animation or image from a file. Note that morphing works best if the two animations cover the same area of the image. Otherwise, halfway certain pixels disappear and others suddenly appear.

In particular the last two commands are very powerful. For example, to blow up an object, add a number of copies and then a number of empty frames. Then overlay it with an explosion animation. (Make sure the numbers of images match.) Alternatively, morph it to the explosion. With some practice you can make great sprites.