Hello! This post is the first in a new series where I’m going to make a tower defense game in Pico-8 and explain exactly how to do it, from scratch. If you’re looking to learn how to code, or you know how to code and are interested in learning how to make games, this is for you!
I think making games is an excellent way to learn how to code, for several reasons. You get instant feedback on the code you write, through actually playing your game! There’s a lot of freedom in that there’s usually no right or wrong way to do things - what’s more important is whether something is fun or not, and that’s for you to decide. And finally, there’s many different aspects of game development to explore, from coding game mechanics to visual effects and pixel art, level design, sound effects and music and more. If you get stuck on one problem, there’s always different things to try and work on while you recharge.
I also think that Pico-8 specifically is the perfect environment to learn to code in. It has integrated editors not just for code, but also sprites, sound and music - everything you need to make games. This greatly helps with focus, as you don’t need to switch to an external editor - you can write some code, play your game, go back and edit some sprites, play again… you get the idea. If you’ve tried to code in fully-fledged IDEs before and can’t imagine working in a 128x128 pixel environment, just trust me! You’ll soon feel at home in Pico-8’s cozy environment, and might not want to go back.
Starting Pico-8 is like switching on a classic video game console. Run the program and it’ll boot up with a little chime, presenting you with a prompt on a black screen. Just hit Escape and you’ll be taken to the code editor. The icons along the top right are the different kinds of editors available in Pico-8. From left to right, they are:
- Sound effects
The map is kind of optional - it’s handy for certain kinds of games, but if your game doesn’t need it or you plan on using procedurally-generated levels, you don’t have to use it.
For now, return to the code editor and type
Press Ctrl-R to run your program, and the message will be printed to the screen. Just like we asked for!
If you’ve tried programming before, this probably looks very familiar to you, and you might think that this doesn’t look much like a game. Let’s tweak it a bit:
What are those numbers? Some represent coordinates on the screen while others (
11) are colours.
cls is very useful as it clears the screen, and
rect (as you probably realised) draws a rectangle. These simple commands for drawing text and shapes are used over and over in Pico-8 development.
Another very common feature of game development engines that we’re definitely going to need is sprites. These are 2d pixel images that often represent game characters, objects and items, textures like grass and snow and more.
Switch to the sprite editor (the second icon on the top-right that looks like an alien from space invaders) and draw anything you like in the first empty slot (001). We can draw it on the middle of the screen like this:
The Pico-8 screen is 128x128 pixels, so
64,64 is commonly used because it’s the center of the screen. You should see your sprite appear just below “hello world”.
These commands -
rect - are examples of function calls. We’ll soon be writing our own functions later in this tutorial.
Saving your work
Press Escape to return to the command prompt and type
save td. This will tell Pico-8 to save your work in a file called
td.p8. From now on, you won’t need to type that again - just hit
Ctrl-S and it will save to the current file. Next time you start Pico-8, you can recover your saved work with the
load td command.
We’ve reached a good stage now to end this part of the tutorial. Next time, we’ll look at 3 special functions that Pico-8 uses to make games work, and write some code that will lay the foundations for our tower defense game!