Urban Park Design Using Wave Function Collapse

For my graduation project at the University of Twente, I built a browser-based tool that helps designers generate layout ideas for urban parks using the Wave Function Collapse (WFC) algorithm. The tool allows users to define high-level zoning—for example, where walking paths, trees, benches, or playgrounds should appear—and then automatically generates layouts that follow spatial rules and patterns. The goal was to explore how procedural generation can support creative workflows in urban design, especially in early concept development. The tool runs entirely in the browser, and the source code is available on GitHub.

This is the full interface of the tool. On the left, users can choose ground types (like water, grass, or dirt), tree styles based on seasons, and decorative items such as logs, mushrooms, and flowers. On the right, they can lock or unlock specific tiles or elements to guide the generator. After selecting preferences, clicking “Generate” creates a new park layout in the center grid.

An example of a full park layout created by the tool. The layout shows curved paths, trees placed in natural clusters, water areas, and decorative items like rocks and mushrooms. The layout follows placement rules defined in the system, ensuring that everything connects and looks visually balanced.