Skip to content

LorikeetEditor

Michael edited this page Aug 27, 2022 · 2 revisions

Creating the indexed color sprites that Lorikeet uses can be a bit of additional work, so I've written a little tool that you can use to extract/manage palette information from sprites.

The editor's interface is fairly straightforward (or at least I think it is).

Basics

You can load a sprite by clicking the Load Sprite button, or dragging an image file from Windows Explorer into the editor. This will automatically extract a color palette and generate an indexed version of the sprite. You can also load an existing color palette file separately from the original sprite.

When you're finished doing any or all modifications to the color palette of the sprite, you can save the indexed sprite and its color palette. Long-standing GameMaker tradition dictates that people save sprites with the prefix spr_; to keep things straight I usually save indexed sprites with the prefix idx_ and palettes with the prefix pal_ but you can obviously use whatever names you'd like.

A maximum of 256 colors can be loaded into a single color palette. If an image contains more colors beyond this, their color information will be lost. It's technically possible to load more, but I'm not planning on it because people who use color in this way tend not to have that many anyway. In the future I might look into quantizing/dithering excess colors to enable a more pixel-arty look.

The "extract full palettes" checkbox will force the editor to load palettes of 256 colors, even if you don't need that many (unused colors will be ignored regardless). Most of the time you probably won't need to touch this.

The Display Type allows you to view the original sprite, the indexed version of the sprite (grayscale), or the sprite with the color palette applied. This is normally the part that you care about.

You can have more than one set of palette data in a single image file, with different palettes stored as horizontal rows. You can use this to store different "skins" for the same image in one file, or to create animations of sorts by allowing the cycling between different palette frames.

You can select a row by clicking on it, or navigate through them with the play controls below.

The Auto button will bring up the automation tools, described below.

Display

The big thing in the middle of the editor is the sprite display. You can pan and zoom with the mouse wheel, and mousing over different colors of the sprite will highlight them in the palette to the right so that you can see which palette indices correspond to which parts of the sprite.

Zooming in on the display will zoom in on the mouse cursor. The Enter key will reset the view.

There are currently three different tooltip modes for the sprite display, selectable with the icons in the upper-right of the editor. These should be familiar to anyone who's ever used Microsoft Paint:

  • Selection mode will select the palette index under your cursor when you click
  • Eyedropper mode will copy the color of whatever's under your cursor when you click
  • Paint bucket mode will apply the color to the appropriate regions of the sprite when you click

In the bottom-left of the sprite display is a colored rectangle with a paint bucket; you can click on this to bring up a color picker, which will be the color applied when you use the corresponding tool.

Note that the paint bucket is not a flood fill. When used, it will apply the selected color to all pixels in the sprite with the same palette index as the one under the cursor. Adjacent pixels that have the same color will not be filled if they point to different indices in the palette, and pixels will be filled if they have the same index even if they are not connected.

Palette

In the upper-right of the editor are buttons for the aforementioned selection modes. Most of the right side of the editor is filled by the actual color palette.

The selection modes do the same thing when clicked on the palette swatches as they do in the sprite display. You can select palette indices and see the corresponding pixels denoted in the sprite display; clicking a selected swatch will bring up the color picker to be edited directly. The eyedropper and paint bucket will copy and paste a color.

Color operations

In the bottom-right of the editor, we have a few color operations. These operations are applied to the palette row as a whole, rather than to individual pixels.

Shift Left and Shift Right are admittedly not very useful, as they will rotate the color palette one index to the left or right, respectively. I'm not a real pixel artist but I can't think of many actual uses for this.

Hue/Sat/Value will bring up a dialog to edit the HSV properties of the palette. Raising the Value beyond 100% will also fade the color to white, in imitation of the related Hue/Saturation/Lightness color model.

Color Channels will bring up a dialog to edit the red/green/blue values of each color in the palette.

More operations might come later, if I get bored enough or someone asks for them.

Automation

https://xkcd.com/1319/

The Automation dialog will bring up a little bit of UI that lets you define preset steps to apply to multiple palettes at once. You can define multiple palettes to be created ("indices"), as well as a set of automation operations. The available operations are the same as the ones described above. If you have multiple operations defined for a particular index, they will be executed in order from top to bottom.

The provided example is the day/night cycle color grading. It creates 24 palettes, one for each hour of the day, and automatically adjusts the red and green color levels for the nighttime hours. This is how (most of) the day/night tones in the demo were generated.

Automations can be applied if your palette image only contains one palette, which it will use as a base. They can also be applied to multiple files at once by dragging the source sprites into the automation dialog box. It will prompt you for a location to save the output images. Indexed sprites will be saved with the prefix idx_. and palette sprites will be saved with the prefix pal_.

Clone this wiki locally