How to build a procedural "Slay the Spire" style Node Map in Unity (Without using LineRenderers)
Hey everyone,
For the last few months, I’ve been working on a procedural roguelike map system in Unity UI, and I wanted to share the approach I ended up settling on.
It took way more trial and error than I expected. The hardest parts were:
- generating clean forward-only paths without the map becoming chaotic,
- drawing connections in a way that works properly with UI masks and scroll views,
- and keeping navigation smooth instead of jittery.
What finally worked for me was:
- Layered generation with deterministic jitter Instead of placing everything randomly, I generate nodes in hidden layers and apply a small seed-based jitter using an FNV-1a hash. That way, the same seed always produces the same map across platforms.
- Bezier curves directly in UI I abandoned
LineRendererand built a customMaskableGraphicthat renders cubic Bezier paths right inside the Canvas. That solved the masking and scaling issues much more cleanly. - Object pooling Rebuilding a map with lots of nodes and paths can create unnecessary GC spikes, so I pool everything instead of constantly instantiating and destroying objects.
- Smarter auto-pan behavior I added a
MapNavigatorthat only moves the view when the selected node gets close to the edge of the screen. That made the whole thing feel a lot less annoying to use.
After spending too much time on it, I cleaned everything up, added custom inspectors, and built a live preview so I could test seeds without entering Play Mode.
I turned it into a framework called CraftMap and published it on the Asset Store.
I’m also giving away 3 free vouchers for launch. If you’re building a roguelike, deckbuilder, or any kind of node-based progression map, leave a comment about what you’re working on and I’ll pick 3 random devs tomorrow.
Happy to answer any questions about the Bezier rendering, deterministic generation, or the UI setup.