New Image Editor Features (EA and 1.4+)

Posted by Mark Alexander on 18 July 2014

The Early Access version of GameMaker: Studio (from version 1.99.177 upwards) has seen some changes to the Image Editor based on common user feature requests. These features will later be added to the regular version of GameMaker: Studio with the next 1.4 update.

In this article we'll take a look at each of these new features and explain a bit about how they are used and what you can expect from them. Please note that most of these features are available to the Pro version of GameMaker: Studio, although the Additional Functionality listed at the end of this article is available on the Standard/Free version too.

Onion Skinning

The most obvious new feature to the sprite editor is the addition of Onion Skinning. What this means is that in a single frame of any sprite animation, you can choose to see any of the preceding or succeeding four frames as a semi-transparent layer under the image frame you are currently working on.

The section at the bottom right of the image editor permits you to choose the alpha value that each frame will be drawn with, from 0 to 255, as well as how many of the frames to show. By setting the "Forward" value you can see those frames that come after the frame currently being edited and by setting the "Backwards" value, you can see those that come before. You can set these to a value from 0 (none) to 4 (all four frames will be drawn), permitting you a far greater control over animations and positioning than was previously possible.

Note that we suggest using the onion skining over a colour-fill background rather than a transparent one (you can set this option from the "View" menu of the image editor and selecting "Set Transparency Background"), as it makes the transparencies of the various skins easier to see.

You can see a video of this feature from the following link: Onion Skinning Video

Spare Page

The Spare Page addition enables you to store parts of images that have been cut out, or draw your own temporary images and manipulate them, away from the main sprite frame being edited. Think of it as a sort of "scratch pad", where you can test or change things without fear of editing the actual sprite itself.

You can switch between the current animation frame and the spare page by pressing "J" on your keyboard and the spare page is treated exactly the same as any other image frame. You can cut and paste images, use the built in effects and even save the results out as a PNG file. However this spare page image is not stored with the sprite itself, and when you close the editor its contents will be removed. 

Custom Colour Pallets

Previously, GameMaker: Studio permitted you to define custom colours from the colour checker box for the left or right mouse buttons. However this approach was not very flexible and you had to recreate the palette each time you opened the program. That has now been changed and you can create your own custom palettes easily and even save and load them as you require.

In the image editor you can see on the right of the window the selection of colours available, and previously these were fixed hues. Now you can middle-click on any of the default colours and that will open up the colour mixer window. Here you can create your own colour and (without having to add it to the custom colours of this window) click "Okay" to have it saved as part of the default palette you are working with.

Once you have created your custom palette, you can then save it out from the "File" dialogue. There you will see the option to "Save Colour Palette" which will save the palette as a *.PAL file. You can then re-load it for use at any time later from the same menu by using the "Load Colour Palette" option. Note that the *.PAL file created is non-standard so trying to load in palette files made with software other than GameMaker: Studio will not work.

You can see a video of this feature from the following link: Custom Palettes Video

RMB Erase

This change is a minor one, but it should help those people that are accustomed to other drawing tools behaviour as well as speed up the general workflow. basically, you can now set the Eraser Tool to work on the right mouse button instead of implicitly selecting it.

Normal behaviour is that you have the pencil tool and the eraser tool and you switch between them from the buttons on the interface, however now if you right-click on the eraser tool button, it will set the right colour of the mouse to be the eraser, with all the same properties that have been assigned to that tool. This means that you can draw with the left mouse and erase with the right.

When you have selected the right mouse erase option, you will see that the right colour is now shown as a "checker-board" to show that you are using it as an eraser instead of a pencil.

You can see a video of this feature from the following link: RMB Erase

Extra Features (All Versions)

Other minor features have also been added for all versions (Free, Standard and Pro), the first of which is to expand the image preview window. It normally shows the image on a x1 scale, but now if you double click on it, you can switch between x1, x2 and x3 scaling, giving you a much clearer picture of the sprite and how it looks while editing it in the main window. Note that you may need to expand the sprite editor window to see this.

You can see a video of this feature from the following link: Preview Scaling

A minor change has also been made to the selection tool and how it it displays the information for the area selected. It now shows the start (top left) coordinates of the selection as well as the width and height of the selection in the information bar at the bottom of the window.

One final change worth noting is that if you hold the <SPACEBAR> and then hold the left mouse button, you can "grab and pan" the image being edited, again like many other popular editing tools.


Back to Top