Charter (WFC Demo)

An interactive art tool for the Wave Function Collapse algorithm made for ProcJam 2024.

Introduction

Click on a color to change your brush, and draw on the small canvas to provide an input template. You can use Right-Click or 'Escape' to deselect your current brush.

Click the 'Discover' button or press 'Enter' to begin the procedural generation. Be patient, it can take some time to complete depending on the complexity of the pattern!

Take screenshots if you find any interesting patterns, I'd love to see them!

Background

The wave function collapse algorithm is an approach to procedural generation that combines two things: a constraint *inferrer*, generating rules for how an input image has been composed together, and a constraint *solver*, using those rules to randomly generate a new, larger image that is 'locally similar' to the first.

When I came across this algorithm (originally by Maxim Gumin - https://github.com/mxgmn/WaveFunctionCollapse), many years ago, I had a go at implementing it but didn't get very far and ended up sidetracked. Fortunately, ProcJam (with a theme of vintage, no less!) gave me a reminder to dig out my work and try to make something new with it.

I originally wanted to make some gameplay based on the algorithm, but found myself with less time than I hoped. Along the way, I noticed that many implementations function as game engine plugins, or proof-of-concept (or proof-of-optimization) demonstrations of the algorithm running on fixed, default inputs, but I never found a web version capable of genuinely responding to arbitrary user input, so that became my goal.

Despite its interactivity, this remains a limited tool. The input and output sizes do not change, the patterns are limited to 2x2 slices of the input, the entropy heuristic is incomplete, and optimization is nearly entirely absent for the sake of time constraints - all things I hope to fix in future. However, as a tiny toy to poke and play with, I'm rather fond of it, and hope you enjoy as well!