Editing Sprites

Once you have an editor downloaded and an NES file, it's time to start hacking away at those sprites. I will be using the Mac OS NES CHR editor for this lesson, however if you are on Windows and using the Tile Layer Pro editor, the Mac OS editor works similarly and a lot of the same concepts and functionality will transfer over. If you get stuck with the Tile Layer Pro editor, this is a great guide that walks through how to use the editor.

What is NES CHR data?

The majority of NES cartridges store sprite information in a part of the ROM called CHR which is usually a single chip 8K or larger. Sprites and other pattern data are stored in 8 x 8 pixel tiles. Most sprites are then made up of multiple tiles put together. Mario, below is made up of 4 CHR tiles.

hacks_image.png
Image source: http://www.romhacking.net/utilities/119/

Read more on how NES CHR data works here.

Open the NES file in the editor

  • Open up the editor.
  • Choose the NES file you want to change and open it.

Navigating the NES CHR Editor

  • As mentioned earlier the sprites are divided up into 8 x 8 blocks. Generally you'll have to arrange 4 blocks together to make a full sprite.
  • The organization of these blocks is something you'll have to figure out as each game is different.
  • In the right window, you'll find the CHR bank containing all the CHR tiles.
  • On the left, find the editor where CHR tiles can be arranged, changed and saved.

Find the Desired Sprites

  • First determine the sprite you want to change.
  • Next find the tiles that make up the sprite in the editor.
  • I am starting with the BurgerTime chef, Peter Pepper. Specifically the forward stationary sprite.
  • This corresponds to tiles 29 - 32 in my editor. Click the tiles to organize them in the editor window. The tiles get arranged left to right and top to bottom.

Draw the New Sprite

You may want to use an online sprite editor such as Piskel, to play around with the shapes until you are ready to save to the CHR editor. Here's a great guide on pixel art fundamentals if you're new to this.

Picking Colors

You have 4 options for picking colors. White is transparent, and the other 3 correspond to preset colors in each game. Unfortunately there is no current way to change the these preset colors. 

hacks_Screen_Shot_2019-06-17_at_5.43.04_PM.png
The color picker in the Mac NES CHR Editor
  • Keep in mind the colors of the sprite.
  • In BurgerTime, the chef has 4 colors: white for the hat and apron, gold for pants and detailing on hat and apron, and pink for face and hands. The 4th color is transparent for the eyes and negative space around him.
  • I made a (golden) cow with these colors in mind.

Draw the Sprite in the Editor

  • Following your design in the pixel editor, draw the same sprite in the CHR editor. 
  • To figure out which colors map to which, look at the original sprite as a reference compared to the sprite in the CHR editor.
  • For this example, the white in the editor is transparent in the game, the light-grey is white, the dark-grey is pink, and black is gold.

Save the New Sprite Tiles

  • Once the new sprite is all set, click the left save icon for each tile. This will save the state of the tiles you changed. 
  • Make sure to also save the .nes file! You may want to do a "save as" initially to have the original copy for reference.
The CHR editor may unexpectedly crash so please remember to save your files constantly!

Tips and Tricks

  • Use the copy and paste functions in the editor to copy and paste tiles that are reused or similar to ones you are trying to make.
  • You can click any of the boxes in the small 4x4 grid at the bottom right of the editor to change which quadrant the next tile you click from the CHR bank goes into.
  • Tiles are not typically placed in any particular order in the CHR bank so make sure to keep track of which tiles correspond to which sprites.
  • The CHR editor may unexpectedly crash, so please remember to save your files constantly!

Test out the New Game

  • Try using a web emulator like this one to see how your new sprite looks in game play.
  • Just click "load your own ROM", select the your edited ROM and play the game. That cow is lookin good!

Uploading to and Playing on Hardware

When you're ready to upload the game to any hardware such as the PyGamer or PyBadge check out this guide!

This guide was first published on Jun 24, 2019. It was last updated on Jun 24, 2019. This page (Editing Sprites) was last updated on Oct 16, 2019.