Announcing Panels for Playdate

Banner with Panels logo

Now that the Playdate SDK is publicly available, I’m happy to be able to release my Panels framework. Panels lets you build interactive comics for Playdate with parallax scrolling, animated layers, synced sound effects, chapters and more.

Simply provide Panels with a Lua table that describes the sequences in your comic (scroll direction, panel sizes, text, animation and effects) along with your layered graphics. Panels will handle layout, scrolling, animation, and even chapter navigation for you.

  🗄 Panels code repo

  📄 Panels documentation

  📦 Panels project template


Getting Started

The easiest way to get started is with the Project Template.

With Git

The template project includes the Panels framework as a git submodule. If you make sure initialize submodules when cloning the repo, git will pull the current version of the framework into your project.

Manual Setup

If you’re not using git, you can download the project template code as a ZIP file. In that case you’ll also need to download the code from the Panels repo and place it in the source/libraries/panels/ folder of the project template.

Start Building

Edit the table in source/myComicData.lua to start building your comic.

Edit source/main.lua to add game credits or alter Panels settings.

 

Examples

Example comic

The project template comes with a few simple examples built in. It’s probably best to spend some time playing with these examples to get a feel for how the system works.

1 Simple Comic
Create a series of panels with image layers with parallax scrolling.

2 Animation
Set a layer to animate across the screen as the panel scrolls, or when the user presses a specific button.

3 Image Transitions
Transition between two images on the same layer based on panel scroll position, or button press.

4 Custom Functions
Create custom render, advance, and reset functions to take over drawing and behavior of a single panel.

5 Audio
Play background audio for an entire sequence or a single panel. Trigger a sound effect synced with an animation.

 

Preview

I’ve been using Panels to build my own comic called The Botanist, a sci-fi story about a scientist traveling the galaxy searching for rare plants. This sequence shows a little more of what’s possible when you dig into all the features of the framework.

Animated comic of shuttle launching