In my ongoing "design diary" of sorts for the Lancer One-Shot Jam coming up next month, I took a few days to explore the possibilities of laying out a TTRPG module using Typst, a relatively new markup language and tool for laying out print media. I only became aware of Typst a short while ago thanks to Window Dump on the NSR Cauldron Discord, and as a career full-stack web developer, the idea of using a markup language to lay out a publication (as opposed to a more WYSIWYG DTP like Adobe InDesign or Affinity Publisher) seemed rather attractive.

For the uninitiated, "markup languages" like Typst are basically a way to use a sort of code-like "language" to describe how text and media should appear on a page. You may already be familiar with Markdown, an approachable-yet-simplistic markup language used on apps like Reddit, GitHub, and (to an extent) Discord, which can be used to render bold and italic using **double asterisks** and _underscores_, and show links using [a weird bracket syntax](https://zombo.com). You may also be familiar with HTML, or HyperText Markup Language, the language of The Internet. HTML lets you write garbage like:

<h1>Welcome to my webzone</h1>
<div align="center"><img src="dancingbaby.gif" /></div>

And it magically gets translated by your browser into:

Welcome to my webzone

The nerdiest among you may also know of an even more ancient markup language known as LaTeX (pronounced "LAY-tek"), used by computer science professors and beardy Unix grognards the world over to lay out research papers, CVs, textbooks. I actually spent a bit of time looking into the possibility of using LaTeX to lay out a TTRPG module, but the syntax quickly put me off the possibility (the example on the Wikipedia page probably gives you a sense of why).

What excited me about Typst is that it appeared to have the expressive complexity of HTML and the print focus of LaTeX, all with a much more approachable syntax reminiscent of Markdown. Thus, I began implementing some toy projects using Typst to see if it was a reasonable option for professional content development.

Getting Started

If you clicked on the Typst link above (or right here), you'd be forgiven for thinking that Typst was some sort of online text editor, and the Typst people would sure love for you to think that so that they can charge you money for their Pro subscription. While they seem have a pretty flexible free online solution (and maybe some of you would want to use that), I'd much prefer my layout software to work entirely offline. Fortunately, Typst is actually just a simple command line program, and the better reference for how to get started is really the GitHub page, which instructs you on how to install Typst locally. I'm running Typst on my Ubuntu 24.04 WSL2 instance in Windows 11, so I used the Linux install method (specifically using the Rust package) and was up and running quickly.

However, the real killer app for Typst is being able to see a live preview of the document you're writing as you write it. To do that, I used VSCode (my code editor of choice) and installed the Tinymist extension, which provided me everything I needed to become a proficient Typst editor, including syntax highlighting, code completion hints, built-in documentation, a code formatter, and of course, a page preview pane.

The last step is actually taking a Typst .typ file and creating a PDF from it. This is where the typst command line program really comes in, as exporting a Typst to a PDF only takes one simple command:

$ typst compile mydoc.typ

I spent some time reading through the Typst tutorial pages, and felt confident enough to take a crack at some more interesting TTRPG projects.

Project 1: His Majesty the Worm Combat Reference

One of the newest games I've been excited about recently has been the old-school-inspired new-school Tarot-based dungeon crawler RPG His Majesty the Worm. In particular, the card-based combat system struck me as incredibly intriguing, and I can't wait to get it to the table to give it a shot. I would love to run HMtW as a one-shot and feature a combat, but since the combat system is so unique relative to other RPG I've played, I'm certain that it would be a challenge to teach it to a group of new players in a one shot, particularly the action list. Unfortunately, the game did not provide a concise combat action reference that I could hand players to peruse during combats, so I took it as an opportunity to play around with Typst to make one myself.

The game has four sets of actions divided by Tarot suit (Swords, Pentacles, Cups, and Wands), as well as a set of actions that are not associated with any suit. My vision was to set up a 2x2 table where each cell contained a list of actions and a condensed description of that action, and then a final cell at the bottom spanning both columns containing the suitless action descriptions. As an extra challenge, I resolved myself to match the book's visual style, including table ornamentation.

Fortunately, Josh McCrowell (aka Rise Up Comus, the book's author) recently released a HMtW Creator Kit in support of the Worm Jam, which included InDesign and Affinity Publisher files for layout, as well as fonts (except for Dicier, which I had to acquire myself).

Some things I learned while making this reference:

• Setting up a page was relatively straightforward, as was creating a table with cells in the layout that I wanted. I played around a lot with formatting inside the cells themselves and settled on a sort of faux hanging indent for the action names and their descriptions.
• Applying fonts properly was mostly fine, though I had to do a trick to ensure that Dicier was used correctly by creating a show rule that swapped out the font to Dicier when I invoked the "magic text" of SWORDS, PENTACLE, CUPS, or BATON as dictated by the Dicier documentation to render the correct icon that matched HMtW's conventions.
• Most of the work really ended up being on the editing side. I had to read all the action entries and do my best to condense them into 1-2 sentences tops. I ran everything by the HMtW Discord community, including Josh, who all helped contribute to tighten up wording and clarify things.
• Applying the ornamented corners was a real challenge. I managed to find a way to extract the table corner SVG from the InDesign file, and then made judicious use of place rules to put the corner ornamentation in the exact right places relative to the table itself. I rounded it off with some manual line placement to handle the lines between the corner ornamentation and that more or less finished it off.

You can see the final result here! Josh McCrowell liked it so much that he now links to it under the game's Resources section on its website!

Perhaps more importantly, you can also see the code used for this here. It's not pretty – there were many mistakes I made and several things were hard-coded in a way that I don't love, but hey! It was my first try and I think it came out great!

Project 2: Trifold Pamphlet Adventure for Lancer

As stated earlier, I'm exploring Typst for use in a Lancer adventure. so I thought it would be a good idea to practice laying out an actual Lancer adventure. One of the most popular (and oldest!) Lancer one-shots is The HA Corvette Job by Eld.

There's a lot to like about this adventure, not the least of which is its length and relative directness. A lot of Lancer modules have a habit of being rather wordy, and I appreciate that this one gets to the point and leaves a lot of room for the GM to fill in blank spaces. However, its primary incarnation is a simple Markdown file hosted on a website with little in the way of fancy presentation.

One of the reasons I am looking at layout tools at all instead of using the existing Lancer RPG Template is because I feel as though Lancer's module ecosystem is in dire need of fresh eyes. The existing template that mimics official products is functional, but frankly I really don't like the look of official products, and mimicking those products would make my products look the same as everything else. I think there are a lot of great layout lessons to learn from the current wave of Old School Renaissance publishers (especially it's New School incarnations), and I would love to apply those lessons to the more trad-leaning stylings of Lancer. In that spirit, HA Corvette Job struck me as an ideal candidate to reformat as a trifold pamphlet module in the veins of Mothership, Mausritter, FIST, and Extraction from Demon-Fucked Cleveland 1996 (naturally).

Some thoughts, observations, and lessons I encountered while working on this module conversion:

• Laying out this module was trickier than a simple single page template. Instead of tables, I made good use of the grid, very much invoking my HTML/CSS experience with grids. Fortunately, since this was familiar to me, I was able to understand it well enough to quickly get 3 equal-size columns that I could enter text into.
• Since I was working from scratch in terms of fonts instead of drawing from an existing creator kit like I did with HMtW, I spent a couple days binging all of Butterick's Practical Typography, which should frankly be mandatory reading for anyone interested in doing layout and typography work, if for no other reason than to set some foundational knowledge for you to break (it's much better to intentionally break rules than unintentionally break rules, IMO). I settled on Barlow for body text, Barlow Condensed (semibold + smallcaps) for subheaders, and Orbitron for title text. I like how Barlow has hints of DIN fonts that evoke that sci-fi feel without being overly blocky.
• I also took this opportunity to make a Typst template that I could use in the future that made it easy to insert glyphs from the Lancer book. Fortunately, Lancer's COMP/CON is open source, so I was able to nab the font and CSS files, and with some quick and tricky text editing, I was able to make a template that let me insert Lancer characters through a quick variable reference.
• Following Butterick's advice, I wanted to make sure the tables I included only had borders and lines where they needed to. I figured out how to impplement alternating-row shading using some quick if statements in the row fill setting. I added a couple table.hlines on the NPC table and felt pretty happy with what I came up with.
• I had fun laying out the cover page. This was also my first time incorporating art into a project, so I whipped up some placeholder garbage in Paint.net and played around with placing text on top of an image. I was also able to get the "Powered By Lancer" image showing up on the cover as well.
• One of the big things I knew I wanted to do was include the map from the module on the inside of the pamphlet, and I settled on having it cross two columns. This caused a small issue because I originally had only two columns: a single-wide column and a double-wide column, instead of a grid cell that spanned two columns. This was a problem because only having two columns meant I was skipping a gutter that was present on the front, which meant it would not fold properly when printed.
• I tried my hardest to make sure it would print properly enough to fold on my Brother MFC-L2750DW, but I couldn't make it happen. I suspect it's an issue with my printer or print drivers, because I was getting results that were not at all being mirrored in my PDF reader (e.g. column corners that were perfectly aligned in the reader would print wildly unaligned when printed duplex). I suspect a professional printer would not have this issue, but I didn't want to spend forever on it, especially since I don't intend to actually print these things for distribution.
• You can fit a lot of content on a trifold! This entire adventure fit on a trifold with room to spare. I had to create extra spot art just to fill in the whitespace. I didn't spend a lot of energy on editing the module, as the purpose of the exercise was to focus on layout and typography. I think I'm still planning on making an A5 zine because I want to fit in extra GMing advice, but there's definitely a part of me that is tempted to just go the trifold route for simplicity. At the very least, I think I've comprehensively demonstrated that it's very possible to make a Lancer one-shot fit on a trifold pamphlet.

With the blessing of Eld, you can see the pamphlet here! (click the "Download raw file" button in the upper right corner)

You can also see the source code of the pamphlet here. I think this code is a bit cleaner, but it still has a ways to go. I wasn't able to figure out how to create the correct vertical spacing for the grid cells underneath the map, for example, so I hard-coded the space to 3em as a white flag of surrender.

Another thing I didn't quite nail down was how to move an image around inside a masked area. In InDesign and Affinity Publisher, you can create a masked area, and then place an image behind that mask, and then move around the image to determine which parts of the image actually show through the mask. In Typst, I wasn't able to figure out how to pull that off. You can set an image's fit rules, which can make it clip if it doesn't fit within the bounding box, and you can set bounding blocks to clip the content it contains, but I wasn't able to figure out how to move the image around to control which parts got clipped. It's possible I could do this with some tricky place or move shenanigans, but I didn't go that deep. It didn't turn out to be a big deal.

Thoughts So Far

Honestly? I'm pretty impressed. I was able to get a lot done in a pretty short amount of time, with a good deal of confidence. There were a few snags that I ran into, but nothing that felt like a dealbreaker so far.

One thing that stuck out to me is that I have absolutely no fear of writing directly into the template. Something I hear RPG writers talking about is doing their writing directly into their DTP software instead of writing into, say, Google Docs, and then transferring later and editing their text to fit and flow properly. I can understand how it could feel weird writing directly into an InDesign template, but since Typst is all text anyway, I feel extremely comfortable writing content directly into it if I want to, and then adjusting things that break. In practice, I may end up writing in Google Docs (or Obsidian) anyway, and I've proved to myself with the HA Corvette Job that transferring text is pretty painless, but it's nice that once I get text transferred over, I don't have to worry too much about that ongoing process.

It's also nice that Typst works well with something like GitHub. I don't have to save multiple copies of a file in different stages of completion – instead, I can use commit history to go back to old versions if I really need to.

The Typst documentation is pretty decent. There were a few times that I had trouble finding what I was looking for, but in general I found the documentation page relatively easy to use, and most things had pretty sane defaults.

Another cool thing that Typst does is automatically generate and insert bookmarks for you! By default, it uses your headings to create nested bookmarks, so that won't be a thing you have to do manually. You can also create links in the text to make clickable links inside the PDF to another page, which is always an appreciated feature for TTRPG PDF goblins.

If I had one concern about Typst, it would be that it doesn't immediately appear to easily support super wild layouts. Like, I don't think I would ever try to lay out Mörk Borg in Typst – they break too many rules that Typst tries very hard to keep intact. That said, I think grid-based layouts are perfectly acceptable, and I have no real intention of going too hog-wild with layout on my first actual rodeo.

All this said, I don't know that I can fully appreciate (or not appreciate) what Typst has on offer here without properly learning InDesign or Affinity Publisher. I think I owe it to myself to do a few test projects in those apps to see if they are as good or bad as people say!

Do I recommend it?

If you're not scared of writing markup and getting your hands dirty with some technical challenges (e.g. installing Typst and VSCode/Tinymist), then yes, I think it's absolutely looking into. It's a free tool that is extremely powerful and capable, and I can see myself being very productive with it.

However, that recommendation is coming from someone who taught himself HTML in 7th grade (25 years ago, fuck me💀) so take it with a boulder of salt. In reality, unless you feel excited about Typst after reading this, and not scared by some of the technical aspects, I wouldn't recommend it to you. If you are much more comfortable directly clicking on the stuff you're laying out instead of staring at a code editor reading the Matrix, then you'll probably be better off using something more familiar. Buying Affinity Publisher gives you a permanent license without needing a subscription, and is currently 50% off for Black Friday! #NotAnAd

What next?

I'd like to play around with Affinity Publisher I think. I have an Adobe subscription, but I'd love to kick that to the curb if possible.

Beyond that, in terms of blog posts, it might be fun to do some brainstorming, or ideation around the creative process of writing a module. At the very least, though, I feel pretty empowered at the moment that I'll be able to create something that matches what I have in my head once I come up with the idea.