SpellForge

• 

  Title Screen

Inspiration

Every VR game with "magic" gives you the same thing: a short list of gestures someone else designed. You imitate the designer. We wanted the opposite: you invent the spell language.

We started from a simple question: what if casting felt like signing, and your spellbook was your own personal sign language? Then we added the part that made us excited: spells that combine into new ones, the way hand signs combine in anime. We built it for Hacklanta with one rule: no controllers, no installs, just your hands and a browser.

What it does

SpellForge VR is a hand-tracked spellcasting and destruction sandbox that runs in the Meta Quest browser.

• Start with three signs. A finger-gun fires a Bolt, an open palm Repels, and a closed fist Grasps.
• Fuse spells to discover new ones.
  • Bolt + Pull makes Blue, a gravity well that drags everything inward.
  • Bolt + Repel makes Red, a blast that throws everything away.
  • Hold Blue in one hand and Red in the other and bring them together. They swirl into Purple, a slow, heavy orb that erases whatever it touches.
• Forge your own signs. Every time you unlock a spell, a cinematic reveals its orb. You then record your own hand pose for it. Your spellbook becomes yours.
• Break almost everything. Bamboo, houses, pagodas and the torii gate are all destructible. Purple carves holes through buildings that match their shape. Training dummies get back up after a few seconds.
• Learn it in minutes. A cinematic main menu leads into a guided tutorial that takes you from your first Bolt to your first custom sign.

How we built it

• Rendering: Three.js (WebXR) with a toon-shaded, cel-style look. Models get inverted-hull outlines, including the skinned dummies and the swaying lanterns.
• Hand tracking: each hand frame is reduced to a small feature vector: finger curls, palm normal and fingertip positions in a hand-relative frame. A sign matches when a weighted distance to its stored template is under its threshold:

$$ d(\mathbf{v},\mathbf{s}) = \sqrt{\sum_i w_i\,(v_i - s_i)^2} \;<\; \tau $$

Each hand has its own hold-and-release state machine with hysteresis, so a sign has to be held to fire but doesn't flicker out when tracking jitters.

• Physics: Rapier. Bolts bounce, debris tumbles, and the gravity wells and repulsors push real rigid bodies.
• Destruction:
  • Small props are instanced meshes that turn into physics debris.
  • Buildings use a voxelized stand-in built from each building's own model. The model's surface is sampled into small boxes with the model's own texture colours, with cell size $h/14$ for a building of height $h$. While a building is intact you see the real model. When Purple passes through, the model swaps for the box shell and only the boxes inside the beam are deleted. Other spells collapse it into debris pieces.
• Fusion and unlock flow: a state machine drives the menu, tutorial and sandbox. Orbs merge through a swirl whose radius shrinks as $r(u)=0.16\,(1-e(u))+0.01$ with the smoothstep $e(u)=3u^2-2u^3$.
• Audio: WebAudio with a shared reverb and echo bus for a big outdoor space, plus synthesized rumbles and thumps layered under our recorded sounds.

Challenges we ran into

• Making hand signs feel reliable. Early on, the label under your hand said you were making a sign, but nothing fired. A single shared timer let one hand block the other. Giving each hand its own state machine fixed it.
• Gestures that are too forgiving. A pointing finger with no thumb out counted as a finger-gun, so we added a thumb-out requirement while loosening Repel.
• Left-hand mirroring. The stored fingertip x coordinates are mirrored for the left hand, so left-hand and two-hand sign drawings came out crossed until we flipped them for display.
• Destructible, good-looking buildings. Big buildings can't just be one block, and fracturing arbitrary models fails on thin, non-closed meshes. Voxelizing the model's surface gave us shape-matched holes without hand-modelling every collider.
• Performance on a Quest 2. We kept collision boxes cheap while a building is intact and only create the many small ones while it is being carved. We also cap the number of debris bodies.
• Tooling gremlins. Non-ASCII text got mangled by PowerShell mid-project, which cost us a few hours of cleanup.

Accomplishments that we're proud of

• A full loop: menu, tutorial, sandbox, with fusion, custom signs and cinematic unlocks.
• A hand-sign system where the spell language is the player's own.
• Destruction that respects each building's real silhouette.
• Pure web delivery. You open a URL on the headset and you're casting.

What we learned

• Hand tracking is noisy, and good feel comes from hysteresis, per-hand state and tuning thresholds, not from a perfect model.
• Sound and small animations (a swirl, a pop, a thump under a hit) turn a mechanic into a spell.
• Simple, cheap proxies built from the real data (voxels from the model) often beat complex ones.

What's next

More spells to fuse, more creatures and structures to destroy, shareable custom sign sets, and multiplayer duels.

Built with

Three.js, WebXR (hand tracking), Rapier physics, Web Audio, Vite, JavaScript. Models and sounds are credited in the repo.

Built With

• gamedev
• localstorage
• procedural-generation
• spatial-computing
• three-pinata
• three.quarks
• wasm