Tile Workshop Guide

The Tile Workshop turns small, reusable graphics into level-building pieces. You edit the system's atomic tiles, assemble them into metatiles such as platforms or pickups, paint those metatiles into a map, and export the data for your game.

This guide covers both supported tile workflows:

Before you begin

  1. Open a C64-family or NES project.
  2. Choose Tools → Tile Workshop.
  3. Create a new tile map, or open an existing tile-map asset from the project explorer.
  4. Save regularly. In the desktop app, Save writes the tile map into the current project. A browser preview downloads a copy instead.

Tile maps live in the project's tiles/ folder and are listed in the manifest's assets.tilemaps array. The workshop keeps the map project separate from source code, so the same tile definitions can be reused by more than one game screen or include file.

Choose the right workflow

System Atomic tile Metatile Exported data
C64 An 8 × 8 glyph from the selected C64 charset A rectangle of charset glyphs, with collision and gameplay metadata Map, metatile definitions, collision, and gameplay roles
NES An 8 × 8 2bpp CHR pattern A rectangle of CHR tiles with one attribute palette CHR pattern data, nametable map data, and attribute bytes

In both systems, the map is painted with metatile IDs rather than individual pixels. That is what makes a platform, wall, or pickup easy to place consistently across a scrolling level.

Shared workflow

1. Create or open a tile map

Use New Tile Map to create a blank project. Give it a name that describes the screen or level, such as scrolling-background or cave-level-01.

Use Open to load a saved tile-map JSON file. Assets already inside the project can also be opened from the explorer.

2. Build the atomic tiles

Atomic tiles are the smallest graphics the target hardware can draw:

3. Assemble metatiles

Select Metatile editor, create a metatile, choose its size, and fill each cell with an atomic tile. A 2 × 2 metatile is a useful starting point for a platform or block, while 1 × 1 is useful for a small pickup or decorative mark.

4. Add game meaning

The map renderer only needs the graphic arrangement, but your game also needs to know what a placed piece means. Use the available collision, role, or palette fields to keep this information beside the art.

5. Paint the map

Switch to Map canvas, select a metatile, and click or drag across the grid. Use Erase to remove cells. The map grid can be larger than the visible game screen, which is useful for scrolling levels.

6. Save and export

Save preserves the editable tile-map project. Export creates a .cbi include containing target-ready data. Include that file from your game source and use the generated constants and data tables in your renderer.

C64 Tile Workshop

How C64 tiles work

Yes: for a C64 character-mode tile map, the atomic tiles come from the charset you load.

The C64 Tile Workshop does not copy a second set of pixels into every map cell. Instead, it stores references to charset glyph numbers. The selected charset supplies the 8 × 8 pixel shapes, while the tile map stores which glyphs belong in each metatile and where those metatiles are placed.

This gives the workflow a useful separation:

If you change the selected charset, the previews update to show that charset's glyphs. If you edit a glyph in Charset Editor, any metatile using that glyph will use the updated shape when the charset is loaded by the game. Keep the charset path stable when you want the tile map to continue referring to the same source.

C64 steps

  1. In the Loaded charset selector, choose the charset that supplies the background art.
  2. Browse the 256 glyphs in the glyph palette. Select a glyph to use it in the metatile editor.
  3. Switch to Metatile editor and choose a size such as 2 × 2.
  4. Click metatile cells to place the selected glyph.
  5. Give the metatile a useful name, such as Grass Platform, Coin, or Goal Flag.
  6. Set Collision and Gameplay role.
  7. Switch to Map canvas, choose the metatile, and paint the level.

C64 collision choices are Empty, Solid, One way, Ladder, and Hazard. Gameplay roles include Platform, Wall, Floor, Ceiling, Pickup, Checkpoint, Spawn, Goal, and Decoration.

The default C64 map is 40 × 25 metatiles, matching a standard character-mode screen when using 1 × 1 metatiles. Wider or taller maps are appropriate for scrolling games; the exported map remains a data source that your scrolling code can read as the camera moves.

C64 export

The C64 include contains the metatile arrangements, map values, collision values, and gameplay-role values. Map cells refer to metatiles, and metatile cells refer to glyph numbers from the selected charset.

After exporting, include the generated .cbi file in the game source. Use its constants and tables when drawing the visible map and when deciding whether the player can stand on, climb, collect, or collide with a placed piece.

NES Tile Workshop

How NES tiles work

NES background graphics are stored as 8 × 8 CHR patterns. Each pixel has one of four values, called 2bpp values 0 through 3; those values are the two CHR bitplanes, not fixed colours. The workshop presents 256 editable CHR patterns, the complete 64-entry NES PPU colour table, and four editable background sub-palettes.

The NES workflow has three layers:

  1. CHR tile editor — edit the 8 × 8 pattern.
  2. Metatile editor — arrange CHR tiles into a reusable piece and choose its attribute palette.
  3. Map canvas — place metatiles across the background map.

NES steps

  1. Open the CHR tile editor tab and select a pattern from the CHR palette.
  2. Choose pixel value 0, 1, 2, or 3, then click or drag over the 8 × 8 grid. The selected value sets the two bitplane bits in the CHR data.
  3. Switch to Metatile editor and choose the CHR tile for each cell.
  4. In Background palettes, choose any NES PPU colour index for each palette slot. Colour 0 is the universal background colour shared by all four palettes.
  5. Set the metatile's Attribute palette to palette 0, 1, 2, or 3.
  6. Switch to Map canvas, select the metatile, and paint the background.
  7. Set the map width and height in Map settings. NES maps may be up to 256 metatiles wide and 120 metatiles high.

The default NES map is 32 × 30 metatiles, which corresponds to one 256 × 240 nametable-sized screen when each metatile is 1 × 1. For a scrolling background, increase the width so the map extends beyond the first screen.

CHR range and sprites

Background tiles exported controls how many CHR patterns are included in the exported CHR data: 32, 64, 128, or 256 tiles. The default is 64 tiles, $00–$3F.

Keep the background range separate from the sprite range. The current Scroll Demo uses background tiles $00–$3F and sprites from $60, leaving a gap between them. If a metatile uses a tile outside the selected export range, either increase the range or move that artwork into the exported background range.

NES export

The NES include contains:

The export is the data source for your renderer. It does not automatically stream the map into the PPU or replace a project's existing TILE_FOR_WORLD logic. Your scrolling code still needs to copy the appropriate map values into nametable memory and update the attribute table as new columns or rows enter the camera view.

For a horizontal scrolling game, a typical flow is:

  1. Include the generated tile-map .cbi file.
  2. Call its generated CHR-loading procedure during setup.
  3. Copy the first 32 × 30 visible map cells into the nametable.
  4. As the camera advances, read the next map column or columns and stream them into the off-screen side of the nametable.
  5. Update the corresponding attribute bytes so the new area uses the metatile palettes selected in the workshop.

Practical design advice

Troubleshooting

C64 previews are blank or incorrect

Choose a valid source in Loaded charset. The tile map needs a C64 charset for its glyph previews. If the art itself is wrong, open the source charset in Charset Editor and check the glyph there.

NES art looks wrong after export

Check that every CHR tile used by a metatile is inside the Background tiles exported range. Also confirm that the game uploads the generated CHR data at the exported CHR start, writes the exported PALETTE_DATA bytes to $3F00, and interprets the map as metatile IDs rather than raw CHR IDs.

NES colours change in large blocks

That is normally an attribute-table issue. The NES applies palette choices to attribute quadrants, not to every individual tile. Keep neighbouring artwork compatible with the palette boundaries, or split the design into metatiles whose palette transitions line up with the map's attribute grid.

The map is saved but I cannot find it

In the desktop app, look under the project's tiles/ folder. In a browser preview, Save downloads the project file; import that file into the desktop project when you want it to appear in the explorer.

My scrolling level only shows the first screen

Make the map wider than 32 NES metatiles, include the exported map data, and add the streaming step to the scrolling code. The workshop creates and exports the level data; the game code remains responsible for moving that data into the PPU as the camera advances.

Next step

For the NES scrolling demo, create a scrolling-background map, keep its background CHR range at $00–$3F, build a few 2 × 2 metatiles, make the map wider than one screen, export the include, and wire its CHR loader and map/attribute tables into the existing scroll renderer.