Title Screen - pk-hack/CoilSnake GitHub Wiki

Note

  • This tutorial will not teach you how to design. That's your job buddy-o! :)
  • It's recommended to edit the title screen last, since your main priority in creating a big hack is changing gameplay. If you aren't making a big hack, ignore this.

List of files and folders used:

  • TitleScreen contains main folders.
  • Background has the background frame and palette frames.
  • Chars are the letter sprites and palettes that slide into frame.

Title Screen

The title says it all...

The fully rendered title screen for the "Magical Warrior Girl Okay Nessa" hack video The title screen background for the "GarfBound" hack video

(By BigSharkZ)

The title screen for the (upcoming, as of writing this tutorial) "Ninten's Wacky Day" hack

(By Crafty++)

The title screen for the (upcoming, as of writing this tutorial) "Unearthed" hack

(By Gabbi)

Getting started

Open your preferred sprite/image editing software (in this tutorial, it's GraphicsGale) and open the "Reference.png" file inside the "background" folder. This is the only frame you should care about when first making changes. Since ver 4.1, more VRAM space is available for unique tiles. A screenshot of TitleScreen/Background/Reference.png open in GraphicsGale. Some advice in GraphicsGale: Use layers! Keep in mind the coordinates where your mouse is hovering, which is listed in the UI on the left! Mind the undo/redo actions list! Get very familiar with the palette listing on the right side of the screen! Note the zoomed-out preview of the whole image below the palette listing! Don't draw things in the bottom 32 pixels of the image -- they normally won't be visible in-game! And ignore GraphicsGale's animation feature, it won't be useful for this.

(8x8 grid for mini tile reference.)


Background

  1. Once you have the Reference.png open, you can start designing and changing its colors. (Just don't make any letters or characters yet.) Whatever you wanna do.
  2. When you're satisfied with your result, ask yourself:
  • Do I want my title screen to flash?
  • Do I want my title screen to have sliding letters?
  • Do I want my title screen to be skippable?

These are all important questions to ask because they all affect how your title screen will present itself.

TODO: explain more clearly how all the other background images will only be used for their palettes / that everything that displays in-game is a palette swap of Reference.png (no individual graphics edits to them are necessary/are reflected in-game, only palette edits). This will also involve explaining CoilSnake's "Frame doesn't match reference" warnings

Chars

  • Open the "Chars" folder and "Initial.png." A screenshot of TitleScreen/Chars/Initial.png open in GraphicsGale. The background of the letters is black, and the letters themselves are all white. Each letter has a 24x48 grid. You can either remove all the letters by drawing over every pixel in 00.png with the first color in the palette (making the letter sprites completely transparent, so you can have all your letters on the background instead), or you can change the letters to your liking. It is possible to add more letters, but there isn't an ASM script for that yet.

TODO: similar to the backgrounds and Reference.png, explain how all Chars images are treated as simple palette swaps of 00.png

TODO: explain the format of TitleScreen/Chars/positions.yml and how to make letters not fit a strict 24x48 grid

If you want to change how/where all of these sprites appear in the actual rendered title screen, that's handled by movement scripts. For most simple title screen edits in EarthBound's style, you can use JTolmar and SupremeKirb's Edit the EarthBound logo's letters' movement script on the CCScript Library and just mess with the positions and speeds until you get a good result. (You can also use that script to just write completely custom movement scripts to animate the letters and palettes of the title screen however you want.) This tutorial doesn't include any advice for using those right now; see the instructions in the script itself and in the CCScript Library listing for more information.

Patches

Add these to a .ccs file in your ccscript folder, with an import asm65816 at the top of the file. They'll be applied automatically when compiling your ROM. (You can download asm65816.ccs on the CCScript Library.)

  • Gas Station Skip (Disables Letter Slide Animation) - ROM[0xC4DB33] = JMP (0xDBF9)
  • To keep the Letter Slide Animation, add this - ROM[0xc3f3d0] = STZ_a (0x9F75)
  • Attract Mode Skip - ROM[0xC422E4] = "[09]"