Editor

From VO-EM Wiki
Jump to: navigation, search

The VO-EM Editor is a powerful tool used for preparing graphics and map data assets for use in VO-EM programming. It is currently still in the alpha stage, so expect some scruffiness.

Overview

The editor tool can be used to build tile maps, organize and compress sprite palettes, perform rudimentary editing of sprites, and export completed work to .dls format for embedding in your project.

Toolbar

The toolbar is the row of buttons at the very top of the editor.

Load Sprites

This button will prompt you to select a sprite sheet or archive to be loaded into the editor. Your sprite sheet should have dimensions that are multiples of 16.

Use the file format drop-down menu to select your method of loading - loading a PNG will cause it to be parsed into 16x16 pixel colour indexed sprites, and the palette of each sprite will be extracted. Loading a .ves archive will allow you to continue work on a set of sprites from a previous session - however, you will need to load your palettes separately.

Note: Your sheet will be cut into blocks of 16x16 pixels, starting from the top left corner. If any block of 16 has more than 8 colours in it, additional colours will be lost during importing. This will likely cause graphical artifacting. If colours are lost during importing, a warning will display in the top right of the editor.
Note: While the editor loads 32bit pngs, all loaded images will have their alpha channel removed, and the three least significant bits of each channel will be lost, as the editor prepares the images for VO-EM's 15bit GPU. For example, half-transparent pure white (0x99FFFFFF, or 1001 1001 1111 1111 1111 1111 1111 1111) will become fully opaque and lose 3 bits worth of data each (0xFFF8F8F8, or 1111 1111 1111 1000 1111 1000 1111 1000) and will then, on export, become a 15 bit non-transparent value, 0x7FFF, or 0111 1111 1111 1111).

Save Sprites

This button allows you to save your sprites in a .ves format indexed archive. It is important to save your sprites in this format if you have made any changes to their appearance or channel order, or if you've made any changes to the palettes that were generated when they were loaded.

Load Map

Loads a map from a .vem file exported by the editor. Used to pick up where you left off when returning to a project. You will need to load your sprites again as well.

Save Map

Saves a .vem file containing the tile map data that you have created so far, so that you can continue working at a later date.

Load Palettes

Loads palette data from a .vep file. If you already have palettes in your palette menu, they will be lost, so take care.

Save Palettes

Saves all palettes in the palette list to a .vep file for later use.

Export

Exports all sprite, map and palette data to a .dls file for embedding in your project.

Toolbox

On the left of the editor is the toolbox. It works much like the toolbox in photoshop and other graphics editors, in that it alters the behaviour of mouse clicking.

Select

The default mode. Allows you to select palettes, tiles, squares on the world map, and colour channels.

Scroll

Scroll mode allows you to click and drag to scroll the world map. This is useful if your map is larger than the viewport of the editor.

Note: If your map is more than 16 tiles wide, you will not be able to load it with a single DMA call, as it won't fit in tile memory. You will need to load it in stripes of 16 tiles.

Erase

With erase selected, you can click on tiles on the world map to delete them. They will remain in the tile editor at the bottom of the screen.

Place

Select this mode with a tile selected to place the selected tile on the map with right clicking. It's basically a pencil tool for drawing maps. You can also click and drag to place many identical tiles quickly.

Pencil

The pencil tool allows you to edit tiles manually with the tile editor. With a tile selected and visible in the editor, select a colour channel from the palette above the tile and then draw on the tile with the mouse. Editing the tile will edit all instances of the tile on the world map.

Swap

Swap allows you to swap colour channels on a selected tile. Select a colour channel by clicking any pixel of that colour in the tile editor, then click a different coloured pixel to swap all pixels of each colour to the opposing colour. This is useful if you need, for example, to make sure the background of your tile is index number zero, so that it will display transparently with the appropriate mode enabled.

Swap also allows you to change the order of colours in a selected palette, or the palette of the selected tile. Click one colour to select, and another colour to swap their positions. This will affect all tiles that are using the palette in question.

Map editor

This is the main part of the editor. Use "place" to place tiles on the map. This tool can be used for building backgrounds, environments and even user interfaces for your programs.

Selecting a tile on the map with the "select" tool will bring up that tile and its palette in the tile/palette editor under the layer controls box. Any changes you make to the tile will be reflected in all tiles of this type on the map. With a tile selected in this way, you can click on a different palette in the palette selector to change the tile's palette. This will change the palette only of this specific instance of the tile.

Hotkeys

There are several hotkeys that change the way tiles are placed. They are as follows:

h - Flip tile horizontally
v - Flip tile vertically 
t - Toggle transparency (This will not work on layer 0 or the window layer) 

Layer controls

To the upper right of the map editor is the layer controls box. The left row of buttons in layer controls selects which layer will affected by the "place" and "erase" tools. The right row of buttons toggles the visibility of the respective layers. You cannot draw to an invisible layer.

Note: Hidden layers will not be exported when you use the export button to convert your map data to assembly.

Tile selector

At the bottom of the editor is the tile selector. Selecting a tile here will bring up both the tile and its palette in the tile/palette editor under the layer controls box.

Using the place tool with a tile selected in the tile selector will place tiles on the map. If you currently have a tile on the map selected and you click a tile in the tile selector box, the tile on the map will be replaced with the appropriate tile.

Clicking a palette in the palette selector with a tile selected will switch the default palette of the selected tile to the appropriate palette.

Palette selector

On the far right is the palette selector. Selecting palettes here will highlight all tiles currently using them. It will also bring up the palette in the tile and palette editor for colour and order modification.

Tile and Palette controls

Underneath the layer control box are some buttons for controlling palettes and tiles.

Combine

The combine button is used to join similar palettes into one palette. There is limited palette memory in the VO-EM GPU, so it pays to be frugal with your palette organization.

Select a palette in the palette selector by clicking with the select tool active, then click the combine button. Palettes that can be combined with the current palette will be outlined in pink. Click an outlined palette to combine them.

When two palettes are combined, all tiles which are currently using the affected palettes will be remapped to use the resultant palette so as to not change appearance in any way.

Delete

This feature is not currently supported... sorry :(

New palette

This creates a new blank palette and selects it. You can choose the colours for the new palette by clicking colour channels in the tile and palette editor to bring up the colour picker, then choosing a colour.

New sprite

Creates a new blank sprite, which defaults to using palette #0. If there are currently no palettes in the palette selector, a new blank palette is created as well. The newly created tile will be selected and made visible in the tile and palette editor.

Tile and Palette Editor

The tile and palette editor allows you to make changes to selected tiles. Tools in the toolbox under the "sprite" heading are required to make changes to the tile here.

Palette editor

Selecting a palette or tile will bring up the appropriate palette here. With the select tool or pencil tool active, you can click a colour on the palette to bring up a colour picker. Picking a colour will change that colour for all tiles which are currently using this palette. With the swap tool active, you can click a colour channel and then a second colour to switch their order.

Tile editor

Any changes made to selected tiles in the tile editor will be made to all tiles using this tile data, regardless of which palette they're using. With the pencil tool, you can select a colour from the tile's palette and draw individual pixels with it. With the swapper tool, you can swap channels of the tile by clicking one coloured pixel and then another. This changes the index of all pixels involved, without affecting the actual palette in any way. You can also click a palette's colour and then a pixel on the tile to remap all pixels of this index to the index of the selected colour.

File Formats

The editor uses 4 file formats for saving and loading operations. All files (save png) can be read and edited with a text editor, and are stored in plain-text.

It is not at all necessary for you to know how these file formats work, but they are defined in the interests of completeness or if you're interested in making them cross-compatible with other tools.

.vep

Vep, or VO-EM Palette files, are used to store palette data. Each palette is separatede by a new line, and each colour is separated by a comma. Colour values are stored as four-character hex strings.

When loading and saving vep files, palettes are both loaded and saved first to last, and colours are loaded and saved left to right.

Example:

18c2,2126,2586,2de6,3a64,426c,46e5,52ef
18c2,2126,2586,2de6,3a64,52ef
a6c,1d25,29e8,2ded,328e,3a8c,42ef,52ef

.ves

Ves, or VO-EM Sprite archive contains a text representation of the colour-indexed sprites in the tile selector bar at the bottom. Warning: These files do not contain any palette data. You will need to load and save palette data separately.

The reason the editor saves indexed data in its own file format, rather than just saving as a png tile sheet, is to preserve any colour channel order changes that have been made. For example, if you have combined two palettes that were in use and then saved those palettes to a .vep file, reloading the original sprite sheet and the modified palettes will cause graphical artifacting, as the 'combine sprites' function modifies affected sprites to retain their appearance with the new combined palette.

Sprites in .ves files are separated by periods, and the sprite data is separated from the default palette number by a comma.

Sprite data is simply stored as a sequence of numbers between 0 and 7, as there are only 8 available channels per sprite. Spacing and whitespace has been added to make the file more readable (it's possible to edit sprites just by changing the numbers), but all whitespace (spaces and newlines) are ignored when the ves file is loaded by the editor.

Example:

0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 
0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 
0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 
0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 
0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 
0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 
0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 
0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 
0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 
0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 
0 0 0 0 0 2 2 0 0 2 2 0 0 0 0 0 
0 0 0 0 2 5 5 2 2 5 5 2 0 0 0 0 
0 0 0 0 2 4 2 4 4 2 4 2 0 0 0 0 
0 0 0 0 2 4 4 2 2 4 4 2 0 0 0 0 
0 0 0 0 1 2 2 3 3 2 2 1 0 0 0 0 
0 0 0 1 3 3 3 3 3 3 3 3 1 0 0 0 
,2.

0 0 1 2 3 2 2 2 2 2 2 3 2 1 0 0 0 0 1 2 2 3 2 3 3 2 3 2 2 1 0 0 0 0 1 1 1 2 2 2 2 2 2 1 1 1 0 0 0 0 0 1 1 1 1 1 1 1 1 1 1 0 0 0 0 0 0 0 1 1 1 1 1 1 1 1 0 0 0 0 0 0 0 1 6 1 1 1 1 1 1 6 1 0 0 0 0 0 1 6 1 5 6 6 6 6 5 1 6 1 0 0 0 0 0 1 5 5 7 7 7 7 5 5 1 0 0 0 0 0 0 0 1 5 5 5 5 5 5 1 0 0 0 0 0 0 0 0 4 4 1 1 1 1 4 4 0 0 0 0 0 0 0 0 0 4 4 0 0 4 4 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 ,1.

.vem

Ves, or VO-EM Map files, contains the contents of your level or UI design from the world map viewer. Unfortunately, these map files are not very pleasing to look at in text-form, but they are quite simple to understand.

Each map layer is separated by a "---". Each row of the map is separated by a new line. Each tile is separated by a comma. The files have the following information:

[tile index][h - horizontal flip][v - vertical flip][t - transparency]|[palette index]

Tile information is separated from the palette index with a bar (|). Flipping and transparency are enabled by including the first letter of each after the tile image index before the bar.

So, a line of 3 tiles all using tile image 3 which is flipped horizontally and transparent using palette number 4, with the middle tile also flipped vertically, would look like:

3ht|4,3hvt|4,3ht|4,

Simple, yet ugly.

Hotkeys

This is a full list of hotkeys supported by the tile editor.

q - Deselect all selections and subselections 
h - Toggle horizontal flip for tile place tool
v - Toggle vertical flip for tile place tool
t - Toggle transparency (where available) for tile place tool
z - Undo
y - Redo 
[ - Reduce saturation of palette colour picker
] - Increase saturation of palette colour picker