My Layer Generation Script for Panels

Some folks over on the Playdate Squad Discord have been talking about creating GUI tools to help with generating comic data for Panels comics, so I thought I’d share the script I use to create layer data for my comics. It’s very basic, but it saves me a lot of time (and typos) not having to type out all the image paths for each image in a panel.

The Script

Here’s the “Layerfy” shell script I wrote to do this. I’m far from an expert in shell scripting, but I managed to cobble this together from online examples. I’m sure it could be improved, but I’ve been using it for all my Panels comics and it’s never caused any issues or deleted my files or anything like that.

layerfy.sh

#!/bin/bash
export PATH=$PATH:/usr/local/bin/

# start with junk because there's a zero-width space at the
# start of the Platypus output that will break your comic
# if it gets pasted in
echo "-------------------------------------------------------"
echo " "
echo "layers = {"
p="1"
for n;
do
    # get the image path relative to the images/ directory
    img=$(echo $n | sed -e 's|.*images/||')

    # add leading zero to parallax values less than 1
    if [[ $p != "1" ]]; then
        p=$(echo "0$p")
    fi

    # print the data for the image layer with parallax value
    echo "	{ image = \""$img"\", parallax = "$p" },"

    # decrement parallax value for next layer
    p=$(echo "$p - 0.1" | bc)

done

echo "},"
echo " "
echo "-------------------------------------------------------"

This script simply takes the image files provided and prints out the layer data for me to copy and paste into my comic. It assumes I want every image to be its own layer, which is not always the case, but it’s faster to generate the data like this and edit it into the form I want than to start from scratch.

Using It

You can run this script from the command line like so:

./layerfy.sh /path/to/image1.png /path/to/image2.png /path/to/image3.png

(Make sure to make the script executable first: chmod +x layerfy.sh)

But I want something a little more user friendly, so I used Platypus to create a Mac app from the script. Now I can just drag a group of images onto the app and it pops open a window with the layer data ready to be copy-pasted:

Screenshot of the Layerfy Platypus app

Improvements

One way to improve the script would be to allow you to drag in an entire sequence’s worth of images and have it spit out the data tables for all the panels in the sequence. This would require your images to follow some kind of predictable naming convention so the script could identify which images go in which panels. My images generally do follow a naming convention like that, but I’m not sure I want to have my tooling restricted in that way. I also usually like to work on a single panel at a time anyway, so I don’t mind the current way of working.

The layer data that gets produced always starts with a parallax value of 1 and decreases each subsequent layer by 0.1. That’s not always what I want, so it might be nice if there were some easy way to indicate the parallax value for the first layer when adding the images. But, again, I like the simplicity and predictability of the tool as it is and editing the parallax values isn’t a big chore. Even if I could set them to a different initial value, I usually end up tweaking them while building out the sequence anyway.

App Download

Here’s my Layerfy Mac app if you want to try it for your next Panels comic.