Week 13 - Trying a new language: Making games with Pico-8 (Lua language)

Today

  • (warmup - class project session) Intro to Pico-8
  • Final Project check-ins

Pico-8 education edition

Pico-8 gif

pico8 education edition free

This has all functionality of the paid version but is missing the splore game browser/downloader.

What is Pico-8?

Pico-8 is a “fantasy console” - an emulator for a video game system that never existed as hardware previously. It works like an emulator or virtual machine. It starts up a virtual computer inside your actual computer.

It is an “integrated development environment” with code editor, sprite editor, map editor, sound editor and song arranger all built-in. It has severe limitations (max 16 colors, 128 by 128 pixels, limited code allowed, no ability to import sound or images - everything must be drawn in the editor). These are designed to make constraints to help rapidly build games and small programs.

Pico-8: Getting Started

Pico-8 gif

We’ll use the free education version online.

When you click the ‘run’ button it starts up a virtual machine in your browser, then drops you into the command line, similar to 80s home computers.

Press ‘esc’ key to enter the code editor. You can click through the icons in the top right to see the different sections of the environment.

Drawing a sprite

We’ll start by drawing a sprite.

Click on the sprite editor icon (a weird face). Then click on an area and draw a sprite character.

Take note of its number. Then return to the code editor.

Lua?

Pico-8 uses the Lua language. Lua is the most commond language for creating games. It is used in World of Warcraft, Roblox, Garry’s Mod, many many others.

You can also make games for the Panic Playdate.

Panic Playdate

Coding in Lua

Inside the code editor we write Lua code. Lua is a similar to Javascript, but it is distinct and has its own features.

Try entering this first program.

function _draw()
  --this is a comment
  cls(1) --equivalent to something like background(120)
  spr(001,40,40)
end

Pico-8 has some similarities and differences to p5.js.

Instead of setup() and draw() we have _init(), _update() (anything that continously happens but doesn’t involve drawing to the screen), and _draw() where we draw images or graphics on the screen. Unlike p5, you dont’ need to “create” a canvas, as Pico-8 assumes a 128 by 128 screen. You can make a complete program even without a _init() or _update() for example.

In the above code we are writing our _draw() function, then we have a comment (with two -) and then we clear the screen with light blue - an equivalent perhaps to background(120); or similar in p5.js.

We draw our sprite #1 to the screen at x 40 and y 40. Finally, to close our function we have the word end. Lua does not use curly brackets for functions, loops or if statements.

Save. Control-S. Then run. Control-R. You should see your sprite character on screen. Hit escape to go back to your code. If you don’t see your sprite on screen, hit escape then click on the sprite editor and check your sprite’s number. Make sure it matches what you enter in the code.

Interactivity (button presses) in Pico-8

Now we’ll add checking for button presses inside an update function. Add this function before _draw().

Note: Below you’ll see emoji arrows but inside the Pico-8 code editor if you press Shift-R you will get a RIGHT-Movement icon. If you press Shift-L you will get a LEFT-Movement icon. Make sure to use those instead of my emojis below.

function _update()
  if btn(➡️) then
    x += 1
  end
  if btn(⬅️) then
    x -= 1
  end
end

Next: Figure out how to add up and down movement buttons as well.

Sound editor

Click on the sound editor. Now draw a little ditty. Press space to listen. Change the speed. Now see which number it is (the first one is 0). Let’s have this sound kick off our game on launch.

Add an _init() to the top.

function _init()
  sfx(00)
end

This plays our 00 sound on game start (aka _init)

Saving our program

Press escape if you are in the code editor to get to the command line. Let’s save what we’ve made to our computer.

Type save test.p8 or another name. It will download the cartridge to your computer with your game in it.

If you want to load this in the future, simply visit the Pico-8 education website and drag in this cart and it will load. To run, type run or control-R.

Loading demo programs

In the command line type install_demos

Now, to get into the folder you downloade, type cd demos to move into the folder. To see all the demo program names type ls. To load any of them type load jelpi or any other program name. You can now run them ( Control-R ) or look at their code or edit them with escape.

More programs

This special education edition of Pico-8 does not have the built-in online video game browser/downloader. Instead, you’ll have to find Pico-8 games on the website and play them in the browser there.

For full Pico-8 functionality that includes this splore game browser, you can purchase a Pico-8 license for $15.

Where else?

Games written in Pico-8 run on Mac, PC, Linux and browser. They can also run on the Anbernic video game handheld devices and some others.

Resources

Homework

Watch video lesson on Processing, p5.js outside the web editor and 3d graphics before our next class.

Begin working on your final project.