设置
快速交货
免运费
国际贸易术语
支付类型
市场产品
How To Homebrew Game Boy Games
2025-01-21 | By Adafruit Industries
License: See Original Project
Courtesy of Adafruit
Guide by John Park
Overview
Creating your own Game Boy games and playing them on real hardware has never been easier. This guide will show you what you need get started creating games with GB Studio.
You can export game ROM files to play in an emulator, on the web, or even better, flash your own Game Boy cartridge to play on a Game Boy, Game Boy Color, or Game Boy Advance!
If you want to try it out, here's a link to the playable game on itch.io: Dorky Demustard.
This guide was inspired by the Green Day Dookie Demastered project, which re-imagined the album for obsolete/inconvenient playback methods. But since they only made 25 copies of the Game Boy cartridge with Welcome to Paradise on it, we decided to build our own take on it.
Game Authoring Tools
GB Studio
You'll need to download and install GB Studio, the free, open-source Game Boy development application for macOS, Windows, and Linux.
Pixel Editors
You will probably want to use a pixel art program such as Aseprite for editing sprites and backgrounds.
For more advanced backgrounds, the Tiled map editor is indispensable.
Text editor powered by tinymce.
GB Studio
GB Studio is a modern, GUI-based authoring tool for making Game Boy games. It's available for MacOS, Windows, and a few flavors of Linux.
In it, you manage the flow of your game with "scenes" that contain game levels (as well as menus, a splash screen, and a title screen) and define the look and behavior of assets within the game levels.
Game Events
Using drag-and-drop tools, you can adjust properties and events to define interactions and game play.
Music Tracker
GB Studio contains an internal music tracker you can use to create songs in your game, or you can import tracker files created externally.
Game Assets
Visual game assets such as backgrounds and sprites are created with an external pixel art tool, such as Aseprite, but you can also download asset packs from online repositories such as itch.io.
Testing and Debugging
While you're working on your game you can test it with a one-button compiler, which launches a debugger and emulator.
ROM Export
Once you're ready to play your game or distribute it to others, you can export a ROM file (for use on flash cartridges or software emulators).
You can also export .pocket files for the GB Studio player on Analogue Pocket handhelds.
And, for even wider audiences, you can export your game for web play as an HTML game on itch.io.
Once you've downloaded and installed GB Studio, use these docs to get started creating a basic project.
Text editor powered by tinymce.
Pixel Art Fundamentals
Pixels
What is pixel art? Pixel is a word for individual “picture elements” on a screen, such as your computer monitor or your handheld gaming device. They are essentially the smallest unique element of a display that is comprised of a single color (this is true of most all displays other than vector scopes). If you look really, really closely at your screen, you’ll see lots of individual pixels that make up the images you normally see when you step back and take it all in.
Here's a closeup of a section of this very webpage so you can see the individual pixel that make up the guide's main graphic.
Pixel Art
For our purposes, pixel art refers to a type of graphics made for use in games, where the individual pieces of art (sometimes referred to as sprites) are small enough to be created by hand, one pixel at a time. This is as opposed to graphics made from pre-rendered or real-time 3D models, or graphics of sufficient complexity and size that it’s impractical to create the art at the individual pixel level.
Here, we see pixel art from the game Celeste. The backgrounds and characters are artfully constructed pixel art. And incredibly appealing!
Scene from the game Celeste
Software and Resources
On the next page we'll use the pixel art editor that's built right into MakeCode Arcade. However, if you'd like to explore other pixel art software, here are some good ones to check out:
Piskel is a free online editor for pixel art and animated sprites
Aseprite is a paid app ($15) that many professionals use -- there's also a free trial, and it's open source, so you can build the full version for yourself if you are inclined.
Pixilart is another very nice, free online editor
These pixel art tutorials by MiniBoss are excellent (they created the fantastic artwork for Celeste). In them, they cover both static and animated sprites (and a whole lot more!)
For a deeper dive into creating graphics for the Nintendo Entertainment System (NES) have a look here.
This Game Development magazine article on creating retro styled games has a great look at different retro art styles.
Color Palette
Pixel art also tends to imply the use of a limited color palette, such as 1-bit (monochrome), 4-bit (16 colors), or 8-bit (256 colors) graphics seen in game consoles of yesteryear. Modern games tend to use 16-bit (65,536 colors) or 24-bit (16,777,216 colors).
Not to say that pixel art with limited color palettes isn’t thriving now! But these color restrictions are now often chosen for stylistic reasons, not technological ones when using the latest, most powerful computers and consoles.
If we look closely at the Celeste character sprite from the scene above, we can see that she is made up of only twelve colors (including transparency as one "color").
On handheld systems, such as the PyBadge and PyGamer, we can create pixel art that will look great on the small screens when compared to the relative busy-ness of higher color depth graphics. (More on aliasing in a bit.)
Want to check out some excellent examples of pixel art palettes? Have a look over here at LOSPEC!
The Canvas
When creating pixel art characters, one of the first decisions you'll make is the size of the image sprite you're going to make. Here's a typical canvas set up for a 16-pixel wide, by 16 pixel high image.
Here's a similar canvas, except this time it’s set for a 32x32 pixel image.
Each cell of the canvas can have a single pixel drawn into it, or no pixel at all. Cells with no pixel are treated as a transparent part of the image by the game engine.
First, we have Mario from the NES Super Mario Bros. game He's made in a 16 x 16-pixel canvas and has a four color palette (one color being transparency).
Next, we have a 32x32 pixel Mario from SNES Super Mario World. He's now sporting a 16-color palette!
Finally, here's a 32x32 pixel sprite from New Super Mario Bros. for Nintendo DS. The sprite looks like it was not handmade, pixel by pixel, so much as rendered from a 3D model, since the shading is so complex. The color palette is virtually unrestricted, as evidenced by the huge number of different shades of blue, red, Mario's skin-tone, and more.
Sprite Sheets
If you'd like to look at examples of pixel art from existing games, search online for "sprite sheets". For example, "Mario sprite sheets" turns up images such as these, which are pulled directly from the in-game resources:
Drawing Sprites
In this example, we see a palette of 16 colors (the first one isn’t a color, it allows you to make a transparent pixel) and then we have a grid of 16 x 16 pixels for the art. You can pick a color and then use the pencil tool, for example, to click and place pixels where you like.
Here's a very nice example from the MiniBoss Studio tutorials. In this sprite art progression for a shovel, note how the limited color palette is still enough to
first, create the basic form of the object
then, "shade" it (add dimension) using additional colors
finally, to round off the appearance of the corners using anti-aliasing techniques
Anti-Aliasing
Aliasing is the name given to the rough, stair-stepping effect that's seen when pixels are used to create curved or diagonal lines. While we can't change the basic problem of square (or rectangular on some screens) pixels being used to represent curved or diagonal shapes, we can lessen the effect by using a technique known as anti-aliasing.
Typically, anti-aliasing is achieved by adding medium contrast pixels at the problem areas. In other words, an aliased black line on a white background can be anti-aliased by the addition of grey pixels to help fool the eye.
In this example, we start with two colors, black and white. To fix the aliasing, we add pixels in four shades of gray.
This can look a bit strange and fuzzy up close but look at these same images at actual scale to see how effective the anti-aliasing is at removing the "jaggies".
Text editor powered by tinymce.
Dorky Demustard Game
Template Project
The Dorky Demustard game starts with the GB Studio Sample Project (GBS 1.0). This is described as "A short 4 color top-down game".
Give your project a name and path, then click Create Project.
You may download the final project zip file here:
Default Game World
Here's the default Game World view from the template. You can see the eight scenes available as well as their connections.
For example, the Logo scene flows to the Title Screen scene which then flows to the Outside scene when the player presses Start.
The Game Boy screen is 160 x 144 pixels. A game tile is 8 x 8 pixels, the smallest unit that fits into graphic memory. So, a single screen level is 20 x 18 tiles.
Scene Pruning
To create Dorky Demustard, we'll delete a few un-needed scenes an adjust the scene flow.
The Outside scene is large, 32x32 tiles (a tile is 16x16 pixels). It covers roughly 4 times the area of the Game Boy screen, which means the game camera pans and scans as the character moves.
Click and drag the player start icon from the Outside scene to the House scene.
Then, click and delete the Outside scene, we won't be using it.
In fact, let's get ruthless -- delete the Stars and Underground scenes, too!
Testing
Try out the game now by clicking the Game > Run menu item.
The game compiles and you can then play it using keyboard keys (arrow keys +z will get you pretty far) .
Testing
Try out the game now by clicking the Game > Run menu item.
The game compiles and you can then play it using keyboard keys (arrow keys +z will get you pretty far) .
You may notice that if you try to walk through the doorway, you don't go anywhere. Stuck! Next, let's create a trigger to move between scenes.
Quit the emulated run test.
Trigger
Click the orange Trigger block in the House scene doorway.
In the properties panel select the Cave scene from the drop-down menu. This will add a player position connection to the scene. You can drag it where you like and adjust the direction arrow in the properties panel.
Now, if you test the game, walking to the door in the House scene will trigger moving the player Actor to the Cave scene.
Return Trip
Repeat this process to set the Cave door trigger to send the player Actor back to the House scene.
Room Backgrounds
The process of designing your levels can be a back and forth between the pixel art and level functions, such as collision areas and triggers. Let's swap in a couple of backgrounds now.
Asset Folders
Since we started with the sample project, we have a number of pre-made assets to work with. Save your projects and head to the project directory to find the assets > backgrounds folder.
House Art
Open the house.png file in your pixel editor (Aseprite shown here).
Feel free to draw a new background, add to the existing one, or add designs from a downloadable asset pack, such as the one I purchased, the DVA tileset Town 'n' Around. (You can also find free sets, but I thought this one was great and was happy to pay for it.)
Layers
Work with layers in your pixel editor so you can move elements around to arrange them just so.
Save your file as a PNG file named living_room.png in the backgrounds folder. You can download the one I made below if you like.
Swap BG
In GB Studio, click on the House scene and then pick the new living_room option from the drop-down in the Background section as shown here.
Delete the four sign sprites, we won't be using them, then use the Eraser and Collision brushes to fine-tune the wall and object collisions.
Lars
Swap out the Actor1 sprite for the lars.png attached below, placed in the assets > sprites folder of your project directory.
You can reuse some of the previous settings but adjust them for your game. I've set Lars's dialog to display "Lars: You should play some music."
You can also check out the GB Studio file for the project to see how the $Gotbattery and $Gotcassettetape variables are used to determine which text prompts to display.
Bedroom
We convert the sample Cave scene into the Bedroom -- this is the second scene the player can enter. Check out the GB Studio project to see how the trigger heads back to the Living Room scene.
You'll also see two sprites to interact with -- the Battery and the Tape.
Actor Interactions
The Battery actor is set to interact with the Player when there is an "On Hit" collision. This causes a sound effect to play, a text display to pop up, the Deactivation of the Battery, and the $Gotbattery variable state to flip to True.
The Tape actor is initially out of reach. When the battery has been grabbed, the Tape "On Update" loop sees the change in the $Gotbattery variable.
This causes the Tape to Self-Move To{} a location on the screen where it can be reached.
Boombox
Pick the radio Actor2 sprite that was in the sample scene and swap out the sprite art for the boombox2.png using the same method as we did with Lars.
Again, we will use the $Gotbattery and $Gotcassettetape variables to create the logic for dialoge box display.
When those two conditions have been met, with batteries and tape in hand, the Boombox will play upon interaction! Just walk up to it and press A.
You'll see in the GB Studio project that when both variables are true (after collecting the necessary battery and tape objects) a Play Music Track event launches a song. We'll have a look next at the music tracker interface.
Music Tracker
Click on the GB Studio mode dropdown to switch from Game World to Music.
This is where you can create four track music, using a spreadsheet-like interface called a music tracker. Rather than re-invent the wheel, check out the excellent GB Studio docs on the music editor here.
There are four different tracks for different instruments (two PWM, one waveform, one noise, often used for drums and percussion) which correspond to the four synth tracks of the Game Boy hardware.
The tracker represents time vertically, with 1/8th note steps. Here we can see and hear a bass line playing on Duty 2 with an A#, G#, D# pattern, and the drums on the Noise track.
End Game
We use the glass actor to end the game. On Hit will cause a two-choice menu dialog box to pop up.
The Continue choice will close the menu and make no changes to game state.
By picking the Quit choice, the following happens:
Stop Music event stops the music
$Gotcassettetape variable is set back to False
$Gotbattery variable is set back to False
Change Scene is set to the game title screen
The game is now ready to be played anew, with everything put back in its place!
Text editor powered by tinymce.
Cartridge Flashing
Game Export
You can now export the game ROM for play in a software emulator or on hardware. In GB Studio click Game > Export As > Export ROM.
The software will compile the ROM and export it to the game project's build directory.
Cartridges and Flashers
If you'd like to play your game on an original Game Boy, Game Boy Color, or Game Boy Advance you'll need a cartridge flasher and some ROM cartridges.
There is a number of different cart reader/writer devices out there. They can be used for reading and saving your game ROMs (known as 'ROM dumping'), backing up your game saves (particularly useful when you need to change the coin cell battery on an old cart), and writing game ROMs to flash cartridges.
Flash cartridges come in many different configurations and ROM sizes. Some original Game Boy games, such as Tetris, fit in 32KB of memory, which is the maximum size the Game Boy can address directly on a cartridge without the help of a Memory Block Controller (MBC) to manage grabbing date from larger ROM chips.
Games made with GB Studio will be much bigger than 32KB -- usually somewhere from 138KB and up, so a 512KB, 1MB, 2MB, or 4MB flash cart with an MBC (or FPGA/CPLB facsimile thereof) will be necessary.
The GBxCart RW is an excellent choice for a cart flasher. It plugs into your computer via USB C and then you plug your cartridge to be read or flashed into it.
There are loads of different flashable carts out there, a few I've used successfully include Ferrante Crafts 512KB, the Funnyplaying Flash Cart V2, and cheap "reproduction" carts from AliExpress like this one. Your mileage may vary with random repro carts, but they are incredibly inexpensive, so may be worth a shot.
Flashing Software
Using the GBxCart RW requires you to plug it into a computer and run some software that can read from and write to the cart. I've found the open source FlashGBX works perfectly and is simple to use.
Plug in the flasher and cartridge
Click Connect
Pick Game Boy mode
Click Write ROM
Select the game .gb file from the build directory using the file browser
The game is written to the cartridge
Click Disconnect and remove your cart for play
Play
Now, pop the cart into your Game Boy and give it a play!
Text editor powered by tinymce.
Have questions or comments? Continue the conversation on TechForum, DigiKey's online community and technical resource.
中国