I Wanted a World Tree in My Three.js City — So I Built a GitHub Copilot Plugin

Hyeon Sang Jeon — Sat, 11 Jul 2026 19:38:00 +0000

Repolis is a walkable Three.js city built from my GitHub repositories. Each repository becomes a building, activity changes the skyline, and visitors can walk or ask an AI taxi to find a project.

After finishing the repolis-2 iteration and deploying it, I wanted the city to have a real landmark: a luminous World Tree above the night skyline.

Watch the 27-second build-to-deployment video on Reddit

The first temptation was to hand-build one tree and stop. Instead, I treated it as a reusable question:

Can an agent turn a visual reference into structured procedural code, explore several useful concepts, and still preserve the object’s identity?

From a reference to a sculpt contract

While exploring that question, I found Vinh Hiển’s MIT-licensed Three.js Object Sculptor.

Its workflow does not pretend that one image contains a complete 3D mesh. It first checks whether the reference has a readable silhouette and enough depth cues. It then creates a structured specification for components, materials, pivots, sockets, colliders, and visual evidence.

The model is built through locked passes:

blockout → structure → form → materials → surface → lighting → optimization

Each pass produces a browser screenshot. The screenshot is compared with the reference before the next pass unlocks.

I ported that foundation into the GitHub Copilot plugin format so the workflow could operate directly inside a development repository.

Sculpt DNA is constrained variation, not random noise

My original layer is Sculpt DNA.

A Sculpt DNA parameter describes a decision that a designer understands: canopy density, branch warmth, cyan foliage ratio, bark roughness, repetition count, or surface age. Every parameter has a bounded range and a semantic purpose.

At the same time, invariants protect what must not change:

component IDs and parent links
attachment roots and local starts
material references
sockets and collider contracts
build-pass order and visual review targets

The Coverage Curator generates a larger deterministic candidate pool and then selects a small, broadly separated family. It avoids presenting three nearly identical random samples as meaningful design exploration.

For the Repolis tree it produced 24 safe candidates and selected three concepts:

Golden Canopy
Solar Archive
Aurora Index

These were intermediate design directions, not three finished flagship assets. Their semantic hierarchy, attachment roots, sockets, colliders, and review targets stayed protected while their bounded material and repetition parameters changed.

Selecting and shipping Solar Archive

I selected Solar Archive and continued with object-specific art direction: curve geometry, branch hierarchy, generated PBR, instanced foliage, moss, code glyphs, energy paths, lighting, camera behavior, and mobile optimization.

The production Repolis version uses deterministic seed 20260711 and contains:

0 imported meshes
15 macro branches
56 secondary branches
112 merged fine branches
3,016 instanced leaves
68,904 tree triangles
124 draws

Most importantly, the production factory used by the interactive plugin demo is the same factory integrated into Repolis. The city owns only a thin placement adapter.

What the project is — and is not

threejs-sculpt-dna is not photogrammetry, exact mesh extraction, or a promise that every generated preview will look like a hand-finished asset.

It is a disciplined way to move through:

reference → structured procedural build → constrained family → curated concept → art-directed result

That distinction matters. Automation creates leverage, but a flagship still needs a clear quality contract and visual judgment.

Try it

Interactive tree demo:
https://hyeonsangjeon.github.io/threejs-sculpt-dna/

Walk through the live Repolis deployment:
https://hyeonsangjeon.github.io/Repolis/

Source and documentation:
https://github.com/hyeonsangjeon/threejs-sculpt-dna

Install the Copilot plugin marketplace and plugin:

copilot plugin marketplace add hyeonsangjeon/threejs-sculpt-dna
copilot plugin install threejs-sculpt-dna@threejs-copilot-plugins