Learn how to colorize Recreation Boy video games — Backgrounds
With our sprites now beautifully colorized, it is lastly time to deal with what’s going to make our colorization actually shine — backgrounds. On this entry, we’ll attempt to get the backgrounds as near the ultimate look as attainable.
Planning our method
At first look, it might appear that coloring the backgrounds is so simple as applying the attributes we want to the BG Map. Whereas technically appropriate, reaching nice outcomes normally calls for extra work, corresponding to modifying graphics, including new ones, and adjusting degree layouts.
Sadly, what we study on this lesson will not be universally relevant, since the most effective technique for making use of BG attributes relies upon closely on the kind of recreation we’re colorizing, the unique code, and the specified consequence. As an illustration, a static puzzle recreation might not require intercepting the background printing routine, whereas motion video games most certainly will.
That mentioned, the overall course of stays clear: find the background information and perceive the way it’s rendered on the display screen, then adapt or introduce new code to include the specified attributes into the BG Map.
In our case, we’ll take a simple method: find the routine accountable for printing the background to the display screen, duplicate it, and regulate it so as to add our BG attributes. Needless to say this won’t at all times be essentially the most environment friendly solution to do it (though we are able to at all times allow double speed mode).
Finding the Background Printing Routine
To search out our routine, we’ll set a write breakpoint the place a brand new column or line will begin to be drawn as we transfer. On this case, that may be $9816. After some evaluation, we’ll determine the specified routine situated at $1EEB-$1F06:
./references/kirby.asm @ $1EEB
PrintBG:
ld bc,$CB00
@Loop:
ld a,(bc)
inc bc
ld h,a
and a
ret z
ld a,(bc)
inc bc
ld l,a
ld a,(bc)
inc bc
ldi (hl),a
ld a,(bc)
inc bc
ld (hl),a
ld a,(bc)
inc bc
ld de,$001F
add hl,de
ldi (hl),a
ld a,(bc)
inc bc
ld (hl),a
jr @Loop
This may be very totally different from recreation to recreation, however the course of is at all times the identical: set a breakpoint and hint the code till we discover the routine we would like.
Including customized attributes
Trying on the code above, we discover that the info is already saved at $CB00 sequentially. The primary two bytes level to the BG Map vacation spot, whereas the next bytes signify the tile information (2×2 tile blocks). We’ll replicate this course of, however as a substitute of simply copying the info, we’ll fetch values from a BG Map attributes desk beforehand saved in RAM.
For this, the tile worth serves because the low byte, and a set worth (>ATTR_MAP) because the excessive byte. Take an in depth have a look at this code:
./backgrounds.asm
.BANK 0 SLOT 0
.ORG $1EEB
.SECTION "Background printing routine Hook" OVERWRITE
ld bc,$CB00
jp PrintBG
.ENDS
.SECTION "Background printing routine" FREE
PrintBG:
@Loop:
ld a,(bc)
inc bc
ld h,a
and a
jr z,PrintBGAttributes
ld a,(bc)
inc bc
ld l,a
ld a,(bc)
inc bc
ldi (hl),a
ld a,(bc)
inc bc
ld (hl),a
ld a,(bc)
inc bc
ld de,$001F
add hl,de
ldi (hl),a
ld a,(bc)
inc bc
ld (hl),a
jr @Loop
PrintBGAttributes:
SETVRAM 1
ld bc,$CB00
@Loop:
ld a,(bc)
inc bc
ld h,a
and a
jr z,@Exit
ld a,(bc)
inc bc
ld l,a
ld a,(bc)
inc bc
name GetAttr
ldi (hl),a
ld a,(bc)
inc bc
name GetAttr
ld (hl),a
ld a,(bc)
inc bc
ld de,$001F
add hl,de
name GetAttr
ldi (hl),a
ld a,(bc)
inc bc
name GetAttr
ld (hl),a
jr @Loop
@Exit:
SETVRAM 0
ret
GetAttr:
push bc
ld b,>ATTR_MAP
ld c,a
ld a,(bc)
pop bc
push af
WAITBLANK
pop af
ret
.ENDS
To insert this code into our ROM, we’ll solely want a few issues: to outline the macro SETVRAM, which yow will discover within the previous code, and outline ATTR_MAP as an empty area in RAM (for instance, $D800).
If we do it and run the sport, we’ll see… nothing new, really. It’s because we have not populated ATTR_MAP but. To see some modifications, we are able to go to $D800 (or the chosen tackle) in our debugger and write some values. The consequence ought to resemble this:
Have a look at that! In fact, we’ll have to populate that desk at numerous factors within the recreation relying on how advanced we would like our colorization to be.
For now, we are able to simply initialize the desk with some values and see the way it appears to be like within the recreation.
All the pieces appears to be trying good, however there’s nonetheless some work to be achieved.
Enhancing the graphics and ranges
Concerning graphics modifying there may be not a lot to touch upon, but it surely’s very doubtless we’ll must do it to make them look good with the brand new palettes. That is proper — I strongly advocate adapting the graphics to the brand new palettes and never the opposite means round, in any other case you’ll certainly battle to reuse them afterward.
In our specific case, graphics want recompression and a few pointers should be up to date, however because it’s already been talked about that is past the scope of this tutorial. For these , you may verify the supply code beneath.
With our graphics edited, backgrounds ought to appear to be this:
In fact, within the authentic recreation, the sky isn’t any totally different from the within of a cloud or mountain (as they share the identical tiles), the corners of the stone poles can have the unsuitable background colour, and so on. so we’ll have to vary both the printed tiles or attributes in these areas.
There are other ways to go about it, however I nonetheless advocate following our technique of sustaining a 1:1 relation between tiles and attributes, modifying the extent format a bit to have a singular cloud tile, mountain tile, and so forth. Don’t be concerned about VRAM area; by assigning acceptable attributes to tiles usually utilized by sprites, we are able to make the most of customized graphics loaded in VRAM1.
Whereas every recreation would require investigation into how that is achieved, a standard apply for storing degree map is to have consecutive degree blocks (2×2 tiles) that compose the extent map. That is how Kirby’s Dream Land does it, simply with the info being compressed.
So in our case we’ll must decompress the info, edit it, compress it once more, insert it someplace and alter the tips that could it.
And that is it! We’ll cope with the HUD later, however as you may see now we’ve got a a lot closer-to-final look.
As you may need observed, a number of the steps on this entry are very recreation particular so I did not go into a lot element about how you can do them. Nonetheless, I hope this offers you a good suggestion of what to do and why it is necessary to edit a bit extra than simply the attributes. When you’re within the specifics of Kirby’s Dream Land, you may verify the supply code beneath.
Within the subsequent entry, we’ll check out how you can implement some results like fade-ins and fade-outs.