Third-party work

Grass

Grass blades are based on James Smyth's three-grass-demo (MIT, © 2020–2021 James Smyth), from his write-up "Breath of the Wild style grass in Three.js". Changed: the blades are instanced rather than baked into one buffer, and they shade through a standard material so the scene's fog and lights apply.

Foliage

The near trees are built from Dan Greenheck's ez-tree (MIT, © Daniel Greenheck): the leaf card construction, its rounded-normal shading, and the placement rule that sows leaves along each branch segment rather than only at the tips. Changed: the leaf texture is generated procedurally instead of shipping the package's bark and leaf art, to keep the site's load size down.

Grid shader

The city's crisp facade lines were checked against Ben Golus, "The Best Darn Grid Shader (Yet)", code in his gist (Unlicense / CC0). Read as reference; the box-filtering approach used in the end came from a different source, credited below.

Aurora

The Observatory's curtains follow the shape of nimitz's "Auroras" (CC BY-NC-SA 3.0): a divisor held away from zero at the horizon, density read straight off the noise rather than as a contour, and a running average taken along the march. Reference only — the shader here is our own, with its own noise and its own rays.

Surface nets

The statues' hair, which only reads as hair through a texture in the source models, is rebuilt as one solid mass using three.js's bundled implementation of Mikola Lysenko's surface nets algorithm (MIT).

Statue models

Four figures stand in the City. Each has its triangle count cut down by our own bake script and is shown either as plain stone or with its own colour textures baked onto the cut mesh.

• "Cloud Strife - Final Fantasy 7 Remake" (skfb.ly/oSUrZ) by chatholoboom7745289 is licensed under Creative Commons Attribution-NonCommercial 4.0. Changed: frozen at the first frame of an animation, and the hair rebuilt as a solid mass (see Surface nets, above).
• "Sherlock Holmes" (printables.com/model/1418143) by Senki_86 is licensed under Creative Commons Attribution-NonCommercial-NoDerivatives 4.0. Shown adapted: cut to a bust, with a pipe added.
• "MEW" (sketchfab.com/3d-models/mew-8210ff...) by isana is licensed under Creative Commons Attribution 4.0. Shown with its blue body paint shifted to pink.
• "Shackled Ultralisk - Starcraft 2" (sketchfab.com/3d-models/shackled-ultralisk...) by Catholomew is licensed under Creative Commons Attribution-NonCommercial 4.0.
• "Chinese Zodiac Snake Cobra Head Model" (printables.com/model/1340507), via Printables, author name not recorded, is CC0 Public Domain. Used for the twin serpent statues' heads.

Character designs belong to their respective owners — Cloud Strife to Square Enix, Mew to Nintendo / The Pokémon Company, the Ultralisk to Blizzard — and are shown here as fan tributes.

Techniques and references

Read for the technique or the underlying fact; no code or image taken from any of these.

• al-ro, "Instancing" grass
• Eddie Lee, "Realistic real-time grass rendering"
• SpeedTree, leaf generator documentation
• Polycount, "Foliage vertex normals editing in SpeedTree"
• SpeedTree forum, tree shading normals
• Sunstrike Studios, foliage painting guide
• John Whigham, "Planetary rings"
• SpaceEngine, volumetric rings
• Yasui, Ohtsuki & Daisaka, "Dynamics of Self-Gravity Wakes in Dense Planetary Rings I: Pitch Angle"
• Esri CityEngine, "Tutorial 8: Mass modeling"
• Esri CityEngine, "Tutorial 6: Basic shape grammar"
• Inigo Quilez, "Filtering procedural patterns"
• Guardian Glass, "Spandrels"
• PRL Glass, "Spandrel glass panels"
• UpCodes, "Spandrel panels in glass curtain walls"
• Inigo Quilez, "Fog"
• Codrops, "The Sleepers"
• three.js discourse, ground fog