Announcing Procrustes

Yes, we made a tool for generating storefront assets.

Publishing games sucks. Preparing all those social media posts, banners, and other marketing assets is a pain in the ass. Cropping and resizing images into 50 different sizes for 10 different storefronts is especially awful.

I had to deal with all this bullshit earlier this year, while setting up the store pages for my game, Operius DX. The problem is that every storefront (Steam, itch.io, Nintendo eShop, etc.) has its own unique set of requirements that you have to follow. I didn't want to spend hours resizing images manually (or, god forbid, actually learn how to use Photoshop properly), so I decided to build a tool to generate the assets for me.

The result is Procrustes, a visual promotional asset editor for indie devs who just want to get this shit done without the headache.

Download Procrustes on itch.io, or try it in your browser!

Also available on our site!

How It Works

Procrustes consists of three main parts:

1. Media Bag: This is where you dump all your images. Pretty self-explanatory.
2. Layouts: This is the visual editor where you can move images around, apply filters, and just throw things together until it looks right.
3. Configs: Here, you select a layout and a template to define your export configuration. Then, you just hit export!

Yeah, it's really that easy. The whole workflow is built around the idea of defining a design once and adapting it to fit every possible aspect ratio needed.

Under the Hood

For the tech-savvy among you, Procrustes is built with TypeScript, Vue, Tailwind, and Tauri.

I initially started this project with C#. At first it was just a command-line tool, but I eventually realized that building separate tools like this for each project wasn't exactly feasible. So I briefly looked into WinUI 3 and Blazor, but neither were particularly great options. Turns out, there are simply no good cross-platform UI frameworks for C# that are mature enough for my tastes, outside of Avalonia, that is. Avalonia did seem like a good enough option, but its similarity to WPF and the lack of accessible resources about it online was a bit of a turnoff for me.

So, I decided to look into the JavaScript side of things, despite my (relative) distaste for the language and the whole ecosystem. React seemed like the obvious choice, but it also seemed kind of overcomplicated for my needs. Then I looked into Vue. Everywhere I looked, people were singing the praises of its DX, and there were tons of resources about it. So, I gave it a shot! And I couldn't be happier with that decision. Vue is surprisingly pleasant to work with, and coming from C# and game development land, Vite is straight up incredible. I will never be able to use Unity and tolerate its build times ever again.

I also decided to give Tailwind a try for styling. I used to HATE Tailwind, but I figured if I'm going to be a hater, at least I should know what I'm hating. And after giving it a serious shot, I finally get why it's so popular. Having your styling and markup in one place is much easier than having it scattered across different files. It can still get real ugly real easily, though, so it's definitely not the perfect solution. But at least it's a good enough one for this project.

For the frontend components, I went with shadcn/vue. I had heard about the React version of it from a mustachioed guy on YouTube a while ago, and I loved the whole idea of a component library where you just import the components directly, and style them by raw dogging into the source code. Finally giving it a try, I can confirm that it actually is really cool! But this is also where the main weakness of Tailwind really shines through. All these components are essentially just Tailwind utility class soups and genuinely look terrifying. Like, if I had never seen Flutter code before I'd call this the ugliest thing I've ever had to look at, but thankfully Google still has the crown on that.

For the desktop wrapper, I went with Tauri over Electron. Why? Because Electron is a bloated piece of shit, and I wanted something a bit leaner. And oh boy, Tauri sure is lean. If I used Electron, the final file size of the app would be over 200MB, but with Tauri, it's less than 10! Isn't that incredible?

That said, I'm not sure if I particularly like the experience of working with Tauri. Separating the code between a Typescript frontend and a Rust backend is a fine idea, except that's not really how Tauri works in practice. Since you need all that stuff to work in the web build as well, you still end up having most of the backend logic still in Typescript. As a result, the Rust backend isn't really much of a real backend, but more of a dumb wrapper for system calls that could've been streamlined a bit more.

The whole permissions system is also a massive pain in the ass that made me waste a TON of time trying to figure out why I couldn't access the filesystem, or even maximize the damn window. Guys, I'm not a baby, you can let me maximize the window programmatically without making me jump through a billion hoops. “Oh but Mors, what about muh security?” shut up man. I do get having a permissions system for stuff like filesystem access, since NPM is a complete security hell, but why in the fuck do I need to enable a special permission for “webview-zoom”? What fucking goddamn security risk is there in zooming a webview? You can get 90% of the functionality of that by just changing the font size so it's not like adding that one extra permission does anything meaningful. Are all Rust devs like this?

Still, just like Tailwind, Tauri is a good enough solution for my needs, and once you figure out its bullshit, it's not that bad.

Holy Awesome

Procrustes is currently in beta. This means things might break between releases until we hit version 1.0, so keep that in mind! That said, the tool is largely feature-complete and should be rather stable.

This was a seriously overkill solution for a simple problem, but it was a fun project to work on! If you're an indie dev drowning in asset requirements, give it a try and let us know what you think!

Download Procrustes on itch.io, or try it in your browser!

Also available on our site!

More Blog Posts