VECTORCLAD

A three.js tech demo for VECTORCLAD: an Armored Core-style mech, the FS-07A Vanguard or the HV-02 Obsidian heavy frame, flown in from the harbor under a heavy lifter and set down in Port Meridian, a harbor city overrun by spider-frames, six-legged machines that climb the towers, scorpion-frames that claw and sting, swarms of eight-foot riftlings that leap onto the mech's hull and burst there, and a black robotic millipede long enough to lie across several city blocks. In this build nothing comes on its own: a debug menu (the ` key) summons any of them through portals in the sky. Packs of dropships set allied tanks down in the streets to hunt them too. The mech walks, boost-dashes, jump-jets, and fires beam rifles, cannons and full missile salvos. The city is alive: people walk its sidewalks and fill its buildings, traffic drives its streets and trains run on its elevated railway, and all of it can be blown apart. Everything is procedural geometry: the mech and its weapons are textured from two sheets in textures/, the city from fifty-two more in textures/city-src/ and the eighty asset packs' sheets in assets/ (facades, storefronts, roofs, bark and foliage, and car skins) and its sixty billboard ads, the ceilings inside its buildings from five in textures/ceiling-src/, and the spiders and scorpions from ten in textures/spider-src/. There is no build step.

Run it

Serve the repository root with any static server and open it in a browser:

npx http-server -p 8080 .
# then visit http://localhost:8080/

three.js 0.170.0 loads from jsDelivr, so the first load needs a network connection.

It's a sandbox: there are no waves, and the fight starts empty. Monsters come only from the summon menu.

Deploy

.github/workflows/pages.yml publishes the game to GitHub Pages on every push to main. To turn it on, go to Settings → Pages → Build and deployment → Source and choose GitHub Actions. The game is then served at https://agilancer.github.io/vectorclad/.

Title screen

Before anything else loads, a boot screen downloads the title theme (see Music below). Then the game opens on a title screen with the live 3D VECTORCLAD logo (from the vectorclad-brand kit) while textures and the city load behind it. A tap, click or any key fades it out and hands over to the loading screen or, once loading is done, the intro card. The game doesn't start rendering until the title is gone, so the two never compete for the GPU.

On phones held upright, a "Rotate your phone" overlay covers the screen until the phone is turned sideways. Tapping start on a phone also asks for fullscreen and a landscape lock, which Android browsers honor and iOS ignores. Turning a phone upright mid-fight, or leaving the page, pauses the game in the hangar.

The logo files live in js/title/. logo.js and wordmark-data.js are copied from the brand kit; regenerate them there rather than editing them here. The title's three.js add-ons (bloom, post-processing) load through the import map in index.html, which points three at the same 0.170.0 build as js/three.js; keep the two versions in sync.

Music

The soundtrack is eight songs by THEDEMONMECHANIZEDMACHINEDESTROYER in audio/music/. Vectors is the title theme. js/boot.js downloads it before the title screen or the game start loading, and it plays on the title screen. Getting past the title lowers the music to 55% over about a second, so the sound effects sit on top of it. After Vectors the other seven (Oh No, Robot Insects, Sentient Plague, They Came From the Sky! and Vectors II to V) play in a shuffled order, then Vectors again, then the seven in a new order, for as long as the game runs. Each song downloads in full while the one before it plays (from 30 seconds in, so it doesn't slow the texture download), and the music pauses while the tab is hidden. The hangar has a Music toggle next to Sound.

Browsers don't play audio until the player taps, clicks or presses a key. When the browser blocks autoplay, which is usual on a first visit, the boot screen shows "Tap to power up" once Vectors has loaded, and the music and title start on that tap. On iOS, which ignores audio.volume, the music goes through a Web Audio gain node that it shares with the sound effects (audioContext() in js/audio.js).

The masters are 48 kHz WAVs kept outside the repo. To re-encode them as 160 kbps MP3s:

pip install lameenc
python tools/build_music.py "F:/! THEDEMONMECHANIZEDMACHINEDESTROYER"

The song list is at the top of js/music.js.

Controls

Action	Keyboard / mouse	Touch
Move	W A S D	Left thumb stick
Aim	Mouse (click to capture), arrow keys	Drag the right side
Lock on / switch target (press again to release)	T	LOCK
Right-hand weapon	Left mouse	FIRE
Left-hand weapon / raise shield	Right mouse	L
Shoulder cannons (vulcan, beam cannon)	F or middle mouse	CNN
Single missile	Q	MSL
Full missile salvo	E	SALVO
Jump (hold to jet upward)	Space	JUMP
Boost dash	Shift	DASH
Reload	R	Reload
Hangar / pause	Tab, M, or Esc	Hangar
Summon menu (tech demo)	` (or ~), or the Summon button	Summon
Camera zoom	Mouse wheel

The aim reaches straight up and straight down, so the weapons fire in any direction. Looking steeply down, the view slides forward so the crosshair rests on the ground just ahead of the feet, where the arms can reach. The camera starts zoomed all the way in.

Dashing and jump-jetting draw on one boost gauge. A full gauge holds about nine seconds of dash and refills in about three once the mech is back on the ground. If it runs dry the boosters overheat and stay off until the gauge is back to 40.

The lock-on button holds one target. Aimed weapons lead it, the arms track it, the camera keeps it in view, and single missiles go to it first. When it is destroyed the lock moves to the next target in view.

Missiles lock onto targets inside the dashed circle. A salvo spreads its missiles across every lock; with nothing locked they fly to the crosshair. Leg pods pop their missiles almost straight up so they arc over the ground in front of the feet.

On foot

With the mech standing still on the ground, hold G to climb out. Back beside the frame, hold G again to climb in. The pilot wears thick sci-fi armor with a jetpack and a grappling hook on the right forearm, and carries a small copy of the mech's beam rifle in a dark finish. On foot the armor gauge is the pilot's own (60 points); the frame keeps what it had.

Action	Keyboard / mouse
Fire the rifle	Left mouse
Grappling hook: fire (a new press lets go of the old line and fires again)	Right mouse
Sticky grenade	Q (or E)
Jump; press again in the air to light the jetpack; on the hook, let go	Space
Jetpack dash	Shift
First person / over-the-shoulder third person	Mouse wheel

The view starts in first person, the rifle held in the right hand. The wheel pulls back to a close over-the-shoulder view of the little armored pilot. The jetpack and dash burn the mech's boost gauge at 1.5 times the frame's rate. The grappling hook reaches about a city block. It reels the pilot in fast on a rope that won't stretch, so it swings round corners like a pendulum, and stops the pilot dead at the hook: hanging off a wall or ceiling, or standing on a floor or rooftop. Press Space to let go mid-swing and keep the speed, or fire it again in a new direction, which drops the old line and shoots the new one in one press. A sticky grenade sticks to whatever it hits and, after a short blinking fuse, blows out the one square tile of wall or floor it is stuck to.

Rides

The frame select also offers three rides: pick the Kestrel, the Hornet or the Bastion APC there and Deploy goes straight into the fight in it. The Kestrel and the Hornet come in hovering over the seawall on the south coast; the APC rolls in on the riverside esplanade at the east edge of town. The mech is left standing on the starting plaza for the pilot to come back to.

On foot, hold G beside a ride to get in, and hold it again to get out. All three rides are also parked by the starting plaza when the mech is flown in, and any car in the city can be stolen, parked or driving.

The two flyers handle like a hovering gunship in Warhawk: W A S D fly along the view, Space climbs, C or Ctrl sinks, Shift boosts, and the nose turns to follow the aim. Missiles home on the target nearest the crosshair, and empty pods reload on their own.

Ride	Weapons and controls
Kestrel	The dropship that flies the mech in, flown as a gunship. Left mouse: twin plasma cannons in the chin turret. Right mouse: a rocket barrage from both wing pods. Q one homing missile, E a salvo of all eighteen.
Hornet	An attack helicopter. Left mouse: twin chin vulcans. Right mouse: the HEAVY VULCAN, which spins up and fires a little faster than the vulcans, with bigger, faster rounds. Q one missile, E a salvo from every pod. 1-4 swap the pod on each of the four weapon points: missile pod, heavy missile pod, micro missile pod or unguided rocket pod.
Bastion APC	W/S drive, A/D steer, the turret follows the view. Left mouse: the twin heavy vulcans.
Cars	W/S drive, A/D steer, Shift for more speed.

A ride has its own armor; losing it ends the fight. js/rides.js holds the rides; the Hornet's model is built there with the vehicle workshop in js/vehicles/models.js, and the Kestrel is that file's dropship.

Summoning

This is still a tech demo and a sandbox: there are no waves, and nothing attacks until it is called in. Right before the fight starts (the moment the Kestrel H's clamps would open), the drop holds on a notice saying so; Okay (or Enter) lets the frame go.

Press ` in the fight (or click Summon on the HUD, or tap it on a touchscreen) to open the summon menu on the left. The game keeps running behind it, and the pointer is free to use the sliders; ` again or Close takes the pointer back for aiming (Esc or a click on the view closes it too). Every monster in the game has a row: a slider for how many and a Summon button. The HUD's HOSTILES box counts everything out there or on its way through a portal.

On a touchscreen (no ` key) the loadout and pause hangar also have a Debug button. From the pause hangar it goes back into the fight with the menu open; from the loadout before a drop it opens the menu over the loadout, where a Summon only queues the monster (the button reads Queued; press it again to take it back) and everything queued comes through as soon as the frame is released.

Monsters	How many per summon
Spider-frames: Stalker, Skitterer, Weaver, Lancer, Bombardier	1 to 20
Medium spider-frames: Bulwark, Warden, Mender, Magnetar, Quarrier	1 to 5
Scorpion-frames: Burrower, Prowler, Berserker, Shocktail, Scorcher, Venomtail	1 to 20
Emperor scorpion	1 to 5
Riftlings: Acid, Blast, Shade, Spire	1 to 500
Broodmother	1 to 5
The millipede	1 (only one at a time)

A kind's button is disabled for a minute after it summons, counting down on the button. If there's no room left (136 spiders, 128 scorpions and 500 riftlings at once), a summon brings what fits.

Portals. Every monster comes through a portal of its own, about 800 ft straight ahead of where the mech is looking (kept inside the city):

• Sky portals lie flat, 400 ft up, a little wider than the monster they carry (about 12 m across for a riftling, 40 m for a stalker, up to 80 m for an Emperor). Each is a swirling vortex in the monster's glow color with a dark heart, a hot rim and a crackling halo; it springs open, the monster drops out of its face and falls to the street or roof below, and it snaps shut. The vortex is drawn opaque, so the monster stays hidden until it falls through.
• They only open in clear sky: never over a tower's roof, and never beside a building that reaches up near them. And they open where the mech can see them: each portal is checked against the mech's line of sight and rises (as high as 650 ft) to show over the roofs in between, or moves elsewhere in the area. If the patch ahead is all towers, or hidden behind them, the area slides to the nearest open sky the mech can see, up to about 180 m off to the side.
• A summon of many staggers its portals one after another across an area that grows with the count (up to about 140 m across for riftlings, 200 m for the big kinds), so twenty stalkers drop in over nine seconds and two hundred riftlings come down like rain over eight.
• The millipede's portal stands upright a few meters off the street, 54 m across. js/millipede.js tries 90 spots and headings near the 800 ft mark for one whose disc clears whatever is under it and stands clear of the buildings beside it, in view of the mech, with a route that leaves it lying on the roofs, low and clear of the mech. The body crawls out through it, sloping down onto the rooftops; everything still behind the portal is clipped away (and can't be shot or locked), its legs reach for holds as they come through, and the portal closes behind the tail.

js/summons.js holds the list, the placement and the cooldowns, js/portals.js draws every portal as one instance of two instanced meshes (two draw calls for a whole rain of them), and SummonMenu in js/ui.js is the menu.

Frames

Launch on the intro card opens the frame select screen, then the loadout, then Deploy flies the frame in (see Insertion). Quick deploy skips straight to the drop with the last frame and loadout. After a lost fight, Hangar goes back to the frame select and Redeploy flies a fresh frame in.

Frame	Armor	Walk	Dash	Boost
FS-07A Vanguard	1000 AP	46 km/h	220 km/h	9.6 s	The field-trial frame; takes the hangar's paint schemes
HV-02 Obsidian	1450 AP	39 km/h	189 km/h	7.7 s	Heavy armor in black, ivory and gold (assets/heavy-frame)
PX-09 Pontifex	880 AP	51 km/h	238 km/h	10.6 s	White plate on a dark frame, with the longest legs in the bay (assets/pontifex-frame)

The select screen shows each frame's armor, walk and dash speeds and how long a full boost gauge lasts, and puts the picked frame on show in the plaza. All the frames are built on the same rig, sockets and thrusters (HeavyMech and PontifexMech subclass Mech and reskin it; the Pontifex also brings its own leg lengths), so a loadout moves across unchanged; the world is always scaled from the Vanguard, so the city's size never changes with the frame. The frame can also be swapped in the pause hangar mid-fight: it keeps the same share of its armor. The frame list is in js/frames.js; the pick is saved under vectorclad.frame.

Hangar

The hangar sets the loadout for six hardpoints (both hands, both shoulders, both legs), the frame, a frame paint scheme (the Vanguard's; the Obsidian wears its own finish), and one of eight colorways per weapon. It has five presets and settings for sound, music, graphics, shadows, ink outlines, look sensitivity, inverted look and render resolution. Before a drop it is the loadout screen, with Deploy and a way back to the frames; in a fight it pauses the game. The loadout and settings are saved in localStorage under vectorclad.* keys (saves from earlier builds under fs07.* still load).

Weapons, from the weapon sheet:

• BR-07 Beam Rifle: fast pink beam bolts
• HB-90 Hyper Bazooka: heavy rockets with back-blast and smoke trails (a 30% tighter blast than it used to have)
• MG-79 Machine Gun: spinning rotary barrels and tracers
• SC-12 Shotgun Cannon: ten-pellet spread
• GL-6 Grenade Launcher: rotating drum, arcing shells (blast 30% tighter, like the bazooka's; the missile pods keep theirs)
• MBC-2 Mega Beam Cannon: charge, then a sustained beam (hand or shoulder)
• VP-4 Vulcan Pod: shoulder gatling
• MP-6 Missile Pod: 6 homing missiles behind an opening hatch (shoulder or leg)
• HMP-8 Heavy Missile Pod: 8 large missiles (shoulder)
• μMP-24 Micro Missile Pod: 24 swarming micro missiles (shoulder or leg)
• RX-S Shield: left forearm, raised with the left trigger

Graphics

The hangar's Graphics setting picks how each frame is drawn (js/post.js):

Setting
Low	The scene straight to the screen. Phones and tablets start here.
High	Bloom on everything that glows, heat shimmer round it, glare round the sun, a light grade and vignette, and red closing in from the edges as the mech is hit
Ultra	High, plus ambient occlusion, god rays and a sun shadow map twice as sharp
Auto	Ultra to begin with, then a setting lower whenever play stays under about 45 frames a second for four seconds. The default on desktop.

• The same picture underneath. High and Ultra draw the scene into an offscreen target exactly as Low draws it onto the canvas: tone-mapped and sRGB-encoded in the shaders (three does that for the canvas and XR targets only, so the target says it is one), into plain RGBA8 so blending works the same too, with MSAA. Every hand-tuned shader keeps its colors, and the effects go on top.
• Only what glows blooms. Materials that skip tone mapping (eyes, sensors, tracers, bolts) and additive ones (beams, thruster plumes, fire, flashes, the spiders' eyes) are drawn again each frame, alone, into a glow target that shares the scene's depth, so walls still hide them. The glow is blurred down a six-level mip chain and back up and added over the scene, so the sky and sunlit concrete never bloom. The wider levels of the same blur drive the heat shimmer.
• Depth does the rest. The sun's glare is as strong as the share of its disc that shows past the buildings, read from the depth buffer. On Ultra, god rays smear the open sky out from the sun, and ambient occlusion samples a hemisphere round each pixel at half resolution, with normals rebuilt from depth and a blur that keeps to surfaces at the same depth. Neither draws the scene again.

On every setting:

• Haze. three's linear fog is reworked for every material through its shader chunks (js/world.js): measured along the ray, not the view axis, so it doesn't shift as the camera turns; thickest along the ground and thinning with height, so tower tops stand out of it; warm toward the sun and cool away from it.
• Clouds. Fair-weather cumulus drift across the sky, lit from the sun's side, gray underneath, thinning into the haze toward the horizon.
• Drawing less. Besides the cars and trees (below):
  • The spiders' instanced parts, eyes and silk are drawn only up to the highest slot in use, not for all 64 spiders (the scorpions already were).
  • The frame and its weapons are a few hundred meshes, each with its outline, each drawn again for the sun's shadow. Meshes under the same joint with the same material are merged into one, and each joint's outlines into one (batchRigid() in js/atlas.js): what code still moves, hides or recolors (pistons, thrusters, hatches, barrels) is left alone. The Vanguard goes from about 500 draw calls to 260. Outlines no longer cast shadows.
  • Instanced meshes with nothing in them (furniture before a building breaks open, spider parts between waves, stumps, idle particles) are taken off the camera's layer, so they don't bind their shaders every frame for nothing.

The city

Port Meridian: a 15 x 15 grid of blocks on a peninsula between two rivers and a harbor, with a forest along its west side, built entirely from the city texture sheets and the asset packs. The mech stands 40 ft (12.2 m) tall: at startup main.js measures the top of its head in the idle stance and sets the world scale from that (about 1.71 m per game unit), and the city is laid out in real meters.

• Street grid: 28 m avenues and cross streets, both four lanes wide (a 20 m roadway on the cross streets), on long east-west blocks. Avenues run one way; cross streets alternate between one way and two way with a double yellow.
  • Crosswalks, stop bars, lane arrows, "don't block the box" junctions and manholes are keyed out of the asphalt sheets.
  • Sidewalks are raised with granite curbs and rounded corners.
  • Streets and sidewalks draw on ten ground kits (tactile, crisp, cobble, ruin, faded, redcurb, hazard, buslane, grime, fresh), picked by how worn the pavement is in each part of town:
    • A smooth wear field over the city leaves about half the intersections clean, a quarter worn and a quarter broken.
    • Clean streets get fresh asphalt, crisp lane lines, double yellows and crosswalks; worn and broken ones get faded and cracked paint, stained or broken slabs, and cracked patches and potholes laid over the asphalt in soft-edged rounds.
    • Each road keeps one asphalt per wear level along its whole length, laid in world space and mirrored at the tile edges, so it has no seams. Avenues run unbroken through the intersections, and the surface only changes where the wear does. The asphalt is drawn from plain tiles without painted lines and close in tone.
    • Each sidewalk picks its own tile, so the paving changes block by block. The original slab tiles stay in the clean mix.
    • Manholes, sidewalk covers and grates, tree pits under the street trees, and the starting plaza's paving (setts, fan cobbles, herringbone brick or pavers) come from the kits too.
• Buildings: several kinds, mixed by how close a block is to one of three tall clusters (one around the starting plaza, one to the southeast and a smaller one beyond it toward the highway):
  • Walk-ups with storefronts and cornices; prewar mid-rises with setbacks.
  • Glass office slabs and towers with mechanical penthouses; a third of the towers wear a crown instead.
  • Twisting towers, whose square floors turn a quarter turn or so on the way up, and tapering octagonal and hexagonal towers with spires.
  • Stacked towers of shifted boxes that swing from side to side and hang out over the sidewalks, alternating two facades.
  • Stone setback towers with a couple of shallow steps.
  • Crowns: a sloped glass wedge, a glowing halo ring held on struts over a glass drum, or a steel lattice lantern around a needle.
  • Signature blocks: the observation needle (the city's landmark, a tapering concrete shaft with a flared pod, a glass viewing ring and a beaconed mast), twin towers on a podium joined by a sky bridge, a gate building whose bridge of floors spans a plaza the mech can walk through, and a stepped ziggurat with a garden and trees on every terrace.
  • Roofs carry gardens, steel tanks, masts, solar panels, billboards and helipads. About half the walk-ups and prewar buildings also carry an old timber water tower on braced steel legs.

Cars and traffic

Every car wears one of a hundred skins from the car sheets in assets/car-sprites (ten each of sedans, hatchbacks, coupes, supercars, muscle cars, SUVs, pickups, vans, wagons and rally cars), and its body is built to fit its skin. Each sheet holds unfolded car nets: a plan strip (hood, roof, trunk) between two full-length side profiles, the front fascia above and the rear below. tools/build_asset_atlas.py cuts every net into its five pieces (where pieces touch, the fascias hang off the plan strip like tabs; they are cut free along the narrowest gap, row by row, and where a side's windows run into the plan strip, along the plan strip's edge as it runs there; each piece is trimmed to its opaque pixels, which drops the sheets' soft fringes, and the plan strip loses its mirror arms) and measures the side profile and plan at 28 stations from bumper to bumper. The car's sides follow the painted silhouette, wheels, arches, windshield and roof line included, its top wears the plan strip and its ends the fascias. All cars share one topology and one draw call: the vertex shader reads each instance's skin from a data texture and moves the vertices to fit it. Each frame only the cars in view (out to 1.2 km), and those near the mech whose shadows can fall in view, are copied into that draw; the rest of the city's thousand-odd cars cost nothing.

• Parked cars line the curb lanes of every street.
• Traffic keeps to the middle lanes, one way along the avenues and one way or two way on the cross streets; the roads round the edge of the city run both ways, so a car that comes to the edge always has somewhere to turn. Cars follow the car ahead, turn at intersections where the streets allow, and stop for the mech, for wrecks, rubble and pieces of building in the road, and for fallen trees. Up to 180 drive at once; new ones keep coming in out of the mech's sight to replace those lost, and wrecks are cleared away once nobody is near.
• Driving cars are as breakable as parked ones: the mech treads on them, and shots and blasts set them burning.

People

The city is full of people, at their true size beside the 12 m mech (js/people.js):

• Fifty models: twenty you'd meet in a city (office workers, a banker, a businesswoman, a construction worker in a hard hat, a police officer, a nurse, a cook, joggers, a tourist, students, a courier, retirees, children, a skater, a mechanic, a doctor, a musician) and thirty more from the city's wardrobe. Each is a build (height, girth), a skin tone, a haircut, clothes (shirts and jackets with short or long sleeves, trousers, shorts or skirts, shoes) and now and then a hat or a bag.
• Animated on a rig of joint angles: they idle (shifting their weight, looking round), walk, run, die (toppling over), slide backward off a ledge (leaning back, feet scrabbling, arms windmilling) and fall (tumbling, flailing). Every part of every person is one InstancedMesh, so the crowd draws in a handful of calls.
• On the sidewalks: some thirteen hundred (under four hundred on phones) walk the loops round the blocks near the mech, stopping now and then and crossing the streets at the corners. Those left far behind are moved on to blocks near the mech again, out of its sight.
• In the buildings: when a building is first broken open, its floors round the hole fill with people and furniture, some buildings far more than others (offices most, homes fewer). The ones by the hole are thrown out of it or slide backward off the broken floor and fall; the rest stay inside until the next blast throws them or the floor under them goes.
• What happens to them: explosions throw and kill them, rounds and beams cut them down, the mech's feet squash them, falling pieces of building and train cars crush them, and a fall from more than a storey or so ends in a little red splat on the pavement. Blasts, falling buildings and the mech coming close send everyone near running.
• Blood (js/gore.js): every death bursts in a small explosion of red droplets and a puff of red mist. The droplets fly and fall until they hit something (the street, a sidewalk, a floor, a wall or a ceiling, a piece of falling building), and each one leaves a splatter stuck flat to that surface, streaked the way it was going. Splatters stay until the surface under them is shot away, or newer ones take their place (up to 9,000, 2,500 on phones). Bodies trodden on or slammed down by a blast spray more.
• Screams: every death plays one of two dozen different sounds, picked at random and never the same one twice running (death() in js/audio.js): twelve squishes (a wet slap, a squelch, bones crunching and snapping, a deep splat, a gurgle, dripping, a suction pop, a squash, a slosh, a thud, a hissing spray) and twelve screams synthesized from vowel formants (a man's yell, a woman's shriek, a child, a yelp cut off, a scream through blood, a falling wail, a hoarse shout, "oh, no", a whimper, a choked gasp, a squeal and a groan). When a blast kills a crowd they come as a chorus, up to sixteen in a second and a half.

Furniture (js/furniture.js): sixteen pieces modeled in three.js from boxes and cylinders: desks with monitors and office chairs, filing cabinets, bookshelves full of books, water coolers and potted plants for the offices; sofas, armchairs, beds, tables and chairs, televisions, fridges, wardrobes and floor lamps for the homes. Blasts throw them out through the holes, tumbling; a piece whose floor is shot away falls; they bounce and come to rest on the street, on the rubble or on the floors below.

Trains

A train comes in on the elevated railway about once a minute, out of the north end of the line beyond the barricade (js/train.js): cab cars at both ends and four coaches between, stainless steel from the silver aluminum facade sheet with ribbed titanium roofs, on bogies. It runs south down the line, stops at the end of it by the water, crosses over to the other track and runs back north out of the city.

It brakes to a stop for the mech standing on the track, and for a train stopped ahead of it, so trains held up queue behind each other (and the next one waits to come in). But wherever the deck has been shot away under it, or a wreck is lying on the line, it derails: the cars stay coupled while it brakes, and each one leaves the rails as it runs off the broken end of the track (the leading one as it runs into the wreck ahead), going on as a rigid body with the train's speed. It tumbles off and crashes down onto whatever is below, crushing cars, people and trees. Whatever is left when the train stops lies on the deck for the next one to plough into. The trains keep coming whether or not the line is still there, so the wrecks pile up in and under the gap, each settled car becoming something solid for the next ones to land on and for the mech to climb. A settled wreck stays put only while something holds it up: shoot the deck out from under one, or the wreck it lies on, and it comes down.

Atlases

All city surfaces sample six texture atlases (textures/city-facade.jpg, city-surface.jpg, city-ground.jpg, city-panels.jpg, city-roads.jpg, city-structs.webp) through a shader that tiles inside one atlas cell with textureGrad, so the whole city is merged into a few dozen meshes. Each vertex carries its cell's rectangle, so cells can be any size. If the facade, ground or structure panels ever outgrow one 4096 px page, the build splits them over city-panels2.jpg (or city-roads2.jpg, city-structs2.webp) and on, keeping each kit on one page, and the city gives each page its materials. The structure atlas is WebP so its see-through pieces keep their alpha. tools/build_city_atlas.py rebuilds the atlases and js/cityTiles.js from the source sheets in textures/city-src/. The asset packs add four more pages, built by python3 tools/build_asset_atlas.py [--review DIR] (it needs NumPy, Pillow and SciPy) into js/kitTiles.js, which merges them into the city's tiles: city-kits.jpg (the skyscraper facade kits), city-stores.jpg (the storefront kits), city-roofs.jpg (roof coverings and details), plus trees.jpg (bark and foliage) and cars.webp (the car skins, with alpha). Every facade, storefront, roof and foliage sheet is a 4 x 4 grid of modules; the build finds the grid lines near the quarter marks and cuts each module a little inside them, so no sliver of its neighbor repeats along an edge. --review draws the car cuts over each car sheet. python3 tools/build_billboard_atlas.py (Pillow and NumPy) scales the billboard ads into the 16:9 cells of textures/billboards.jpg and writes where each one sits into js/billboards.js. Collision uses a spatial grid, and rays walk it with a 2D DDA.

The panel kits (the sheets named in KITS in tools/build_city_atlas.py) are sheets of loose panels on dark gutters. python3 tools/build_city_atlas.py --segment <review dir> cuts them out along the gutter network (it needs OpenCV), writes each panel's rectangle to tools/city-panels.json, and draws numbered sheets into the review directory. Each kit sets the gray level that counts as gutter and, for sheets whose gutters fade in places, a gap bridge that closes short breaks along a gutter line; PANEL_FIXES lists the rare panels the cut still gets wrong. The last field of each panel is its role, picked by hand: B window bay, P pier, S solid wall, V vent, x unused. Roles carry over when the sheets are cut again. The normal build packs every panel in use into city-panels.jpg at its own aspect ratio, scaled to a common texel density from each kit's measured floor height.

The ground kits (GROUND_KITS) are road and sidewalk tiles between thin separator lines, so --segment cuts them along rows and columns instead: by the separators' color, by thin lines lighter than their surroundings, along only the lines that cross the whole sheet, or along lines given by hand for a sheet whose separators are too faint. Their roles are A asphalt, W sidewalk, Z plaza paving, C crosswalk, L white lane line, Y yellow center line, X box junction, O round cover, Q square cover or grate, T tree pit and H damage (cracks and potholes). The build packs them into city-roads.jpg, and on the way turns crosswalks and lines so their stripes run up the tile, crops lines to their paint and covers and pits to their outline, and evens out broad stains on the tiled surfaces so they don't show as a checkerboard.

The structure kits (STRUCT_KITS) are loose pieces on a charcoal background, cut like the facade panels but keeping sparse shapes such as towers, piers and lamp posts. Their roles are D road deck, K track deck, F concrete slab, B barrier, G girder face, C column, S block or pile cap, L cable bundle, T truss, R railing, U balustrade, H hanger, N steel bent, M lamp post, P pier, W tower and Y pylon. Tiles are packed as they are; the rest have the background keyed out into the atlas's alpha, so trusses, railings and balustrades draw as see-through cards (and cast see-through shadows). Piers, towers and pylons also have their outline traced into OUTLINES in js/cityTiles.js, holes included, and the city extrudes them into solid slabs with the piece on both faces. Bridges size their towers and pylons from these outlines, so the deck always passes through the opening under the crossbeam.

Destruction

Everything the mech can shoot in the playable city can be shot apart: buildings and towers, their cornices, penthouses, billboards, solar panels and the old timber water towers on the walk-up and prewar roofs, lamp posts, signals, kiosks, subway entrances, the El and the elevated highway. (The bridges and the distant skylines stay whole; trees have their own physics in js/trees.js.) It lives in js/destruct/.

• Hits carve cells. A structure stays part of the city's merged meshes until something hits it. Then it is voxelized into cells of about half a meter (up to 1.25 m for the biggest towers). The grid lines snap to every wall, floor and setback, so cell faces lie exactly on the original surfaces. Each round takes its own bite:

  • machine gun, vulcan and shotgun rounds punch holes about 1.5 m across;
  • beam rifle bolts blow out holes about 3 m across;
  • rockets, grenades and missiles leave craters 4 to 10 m across;
  • the mega beam burns a trench as deep as it is held on a spot, so a sweep cuts a line through a building.

  Spider fire chips the city too, but less: plasma bolts, lasers, mortar shells and skitterer blasts.

  • Outer walls are built a little tougher than the rest: every cell facing the outside has a quarter more hit points.

• Holes are cut to the pixel. A damaged structure keeps the triangles it was drawn with as a skin. A 3D mask texture, one texel per cell, drops every fragment whose cell is gone, with torn cladding at the edges and scorch around them, and the shadow map uses the same mask, so light falls through the holes. Behind the skin, the cells are built like a building: one-cell walls of the facade's material (glass curtain wall, stone, brick or panel), floor slabs, a grid of columns about 7 m apart, a core in tall towers, and rooms between them.

  • A hole shows broken concrete with rebar, brick or shattered curtain wall, and the rooms behind it, lit by their ceilings (see Ceilings and lights below).
  • Faces are greedy-meshed one 16-cell chunk at a time, so a hit only re-meshes what it touched.

• Load paths are built in. Where one volume stands on another (a setback tier, the needle's shaft on its lobby drum, its pod on the shaft, a penthouse on a roof), there is a slab between them, and the upper walls carry on down through the rooms below to what holds them up. Flaring and tapering walls are one connected shell, and crowns, masts and halos are tied to what holds them. Nothing in a building floats free until it is cut free.

• Structures fail like structures. After damage, a standing structure is checked four ways:

  • Islands: cells cut off from the ground break away. After a collapse, anything else it left hanging in the air goes too.
  • Sections: at each weakened level, the section that is left (walls, columns and core: the outer walls carry load like the rest) is analysed as an elastic section under the weight above it.
    • The load's offset from what is left bends the section: it squeezes harder on one side and pulls on the other. Pulled too hard, that side cracks open and the rest takes it all.

Ceilings and lights

Blow a building open and its floors are lit, each its own way. js/destruct/ceilings.js draws the ceilings per pixel in the broken faces' shader, so they cost no geometry.

• A theme per building. What a building is clad in picks its theme, and the theme picks a house set of fixtures, tiles and diffusers:
  • glass towers get modern flat LED panels and linear lights in fine tiles, cool white, or tech floors of perforated metal pans with slots of light run end to end;
  • concrete and panel blocks get offices of louvered and basket troffers in speckled tile, or institutional prismatic lenses with grilles and returns;
  • prewar brick and stone get old troffers and warm tubes, water-stained tiles, more dead tubes and the odd failing ballast.
• A layout per floor. Fixtures sit on the 0.6 m ceiling grid, square ones in one module and long ones in three or four. Runs of one to four floors share a tenant's layout: the fixture, its spacing, whether rows run end to end or stagger, and which way they run. Every floor then shifts, turns or respaces it and mixes its own tiles and vents. The lowest floor is a lobby of bright, widely spaced panels, and now and then a vacant floor is left dark. Fixtures are set sparsely: twice the spacing of a real office each way (rows run end to end sit four times as far apart), a quarter as many lights. The layouts are a float texture with one texel per grid layer, which the shader decodes.
• The fixtures light the rooms. Floors, walls and columns add the light of the four fixtures of the ceiling over them, with the fixtures' tint, and the tiles round a fixture glow. Little of the sky reaches that deep into a building, so a room with its power off is dark.
• Power. A big hit makes the whole building flicker: fixtures cut in and out and the supply dips, then it settles. Round the hit, fixtures crackle out with a shower of blue sparks from the ceiling and stay dead. A fixture whose piece of ceiling is shot away goes out. A level giving way browns out what is left standing. A piece that breaks away loses its supply: its lights sputter and die one by one as it falls.

tools/build_ceiling_atlas.py cuts the fixtures, tiles and vents out of the sheets in textures/ceiling-src/ (a light is trimmed to its opening in the T-bar, which the shader draws itself) and packs them into textures/ceiling.jpg. It writes a glow map of only the lit diffusers to textures/ceiling-glow.jpg and the slots and theme tags to js/ceilingTiles.js.

The test script tools/tests/destruction.js (headless Chromium through Playwright) runs these scenarios: bullet holes, a tower cut past halfway, a pancake collapse, props, the needle felled by missiles into one side of its base, a building dropped between its flush neighbors, a building corner blown out, the El, walking into a breach, activation cost of the biggest structures, real weapons, ceilings of each theme with a blast and a slice through them, and a soak with the swarm. It prints timings and writes screenshots to tools/tests/out/. On a machine without a GPU or without access to the CDN, SIM=1 runs game time without rendering between screenshots, and THREE_DIR serves a local copy of the three.js package.

Spider-frames

The enemies are six-legged spider machines cut from the spider texture sheets. They're big (a stalker's body alone is longer than the mech is tall) but weak alone (one beam rifle bolt, one missile or a short burst drops most of them; the big Lancers and Bombardiers take two bolts). They come only when summoned, dropping out of portals in the sky:

• Variants: each kind has its own palette, proportions, tactics and weapon. Every one of them has the same glowing red eyes.

Variant	Palette	What it does
Stalker	Gunmetal, red glow	The all-rounder. Crawls the towers, leaps between perches, fires plasma bursts, and charges a red laser from its perch.
Skitterer	Rust, toxic green glow	Small, fast and fragile. Rushes the mech in packs of two to four along streets and walls, pounces on it from up to 60 units away (even off a wall), and bursts on contact. It also bursts when shot, hurting anything nearby, mech and spiders alike.
Weaver	Bone white, cyan glow	Long-legged with a long abdomen; leaps the most. Spits pairs of web globs that slow the mech and its boost regen for about three seconds. Dashing tears free faster.
Lancer	Blue steel, violet glow	Big and slow, with a dorsal lance over its head. Climbs high and perches far off (55 to 170 units), then charges a heavy violet beam for 1.7 seconds. Takes two rifle bolts.
Bombardier	Brass, orange glow	Bulbous mortar sac. Stays on rooftops and lobs shells at where the mech is heading. A pulsing orange ring marks each landing spot. Takes two rifle bolts.
Broodmother	Near black, magenta glow	A boss two and a half times a stalker's size with 320 HP. Fires five-bolt fans and sets down pairs of skitterers every seven to ten seconds.

• Weapons: plasma bolts are led at the mech. Lasers show a flickering aiming line while they charge, lock just before they fire, then burn along that line, so a dash at the right moment dodges them.
• Armor: the mech has 1000 AP, regenerating after four seconds out of contact. The raised shield turns away hits from the front. Hits flash the screen edges and show arcs around the reticle pointing at the shooter. At 0 AP the frame is destroyed; Redeploy starts again in an empty city.

How they move

Locomotion follows how real spiders, and the procedural spider rigs built on them, move:

• Surfaces: each spider rides a surface with its own up vector: the street, a wall or a roof. Two rays ahead, low and high, find a wall in the way, and the spider tips up onto it (an inside edge). When the ground runs out under the next step, a ray back under the body finds the far side of the roof edge or building corner, and the spider wraps over it (an outside edge). With nothing to hold, it falls.
• Feet: each foot stays planted in world space until it strays too far from its rest spot, then steps. A ray from the hip toward the rest spot finds the foothold, so feet reach onto a wall or around a corner before the body does. A foot only steps if the new hold is closer to where it wants to be.
• Gait: the legs step in an alternating tripod: front and back on one side with the middle on the other, so three feet are always down. Each leg is a two-bone IK chain with the knee thrown high and outward.
• Jumps: spiders leap between buildings, from roofs and from walls, after checking that the arc is clear. They crouch, fly a ballistic arc, turn their undersides to the landing surface in the air, grab on with every foot at once, and leave a silk dragline behind.
• Behavior: they climb to perches that can see the mech and fire from there, rear up to aim, leap to new perches, or drop to the street and rush in. How far they like to perch, how often they leap and how long they stay depend on the variant: lancers and bombardiers keep to high perches, and skitterers never perch at all.

Building them from the sheets

tools/build_spider_atlas.py traces the parts out of the source sheets along the dark gaps around each piece (each part is picked by a point inside it), packs them into textures/spider.jpg, writes a glow map of only the lit red tubes and slits to textures/spider-glow.jpg, and records each part's rectangle and outline in js/spiderParts.js. In js/frameParts.js (shared with the scorpions), the outlines become extruded plates with the art mapped onto them: curved blades for the upper legs, striped claws for the lower legs (each crossed with a second plate so it has body from any angle), the skull face, brow, fangs and spine crest. The ribbed dome and the slit plate are wrapped onto the abdomen and the carapace. The eyes are additive glow points.

Palette swaps happen per spider in the shader. Each instance carries a tint for the bare metal, an accent that replaces the red paint (picked out by how much redder a texel is than its green and blue), and a glow color for the lit tubes. So every variant shares the same atlas and the same instanced meshes. Variants also differ in leg length, abdomen shape and size, and lancers carry an extra dorsal lance plate.

Every spider part is an InstancedMesh shared by the whole swarm, so 64 spiders cost about fifteen draw calls.

Medium spider-frames

Twice the size of a stalker, slow, and built to soak up fire: 170 to 300 HP, six to ten beam rifle bolts or two or three bazooka hits. They're too heavy to leap. To get from one roof to the next a medium spider bridges: it walks to the edge facing the next roof and, if the gap is within its leg span and the roofs are close enough in height, stretches across, rear feet gripping one roof and front feet the other, until its body is over. A gap too wide (any street) means climbing down, crossing and climbing up the other side.

Variant	Palette	What sets it apart
Bulwark	Brass, amber glow	A riot-shield plate over its face turns away three quarters of direct fire from in front, and 40% of blasts. Fires twelve-round gatling bursts. Flank it, or shoot it from behind.
Mender	White, green glow	Keeps near the other frames and plays medic: a green beam from the emitter on its crane arm repairs the most damaged frame within 70 units, 32 HP a second. Shoots at the mech when nothing needs fixing. Kill it first.
Warden	Blue steel, gold glow	Raises a shield dome (240 HP) over itself and whatever stands near it. Shots from outside stop on the dome, blasts outside it don't reach in, and missiles can't lock onto it. Broken, it comes back eight seconds later. Step inside it, or break it and finish the Warden before it's back.
Magnetar	Silver, red trim, blue glow	Two spinning coils on its back charge a tractor beam that holds the mech for three seconds and drags it toward the Magnetar a little faster than the mech can walk. Dash to pull away.
Quarrier	Sandstone, orange glow	Tears a boulder out of the roof it stands on, holds it overhead and hurls it at where the mech is heading. The boulder smashes what it lands on (about 57 AP on a direct hit).

js/mediums.js gives them their goals, their bridging and their gear; the spider code in js/spiders.js walks and draws them like any other spider.

Scorpion-frames

Eight-legged ground hunters built from the same spider sheets and palette swap, summoned the same way, and bigger than the spiders: a Burrower's raised tail stands as tall as the mech, and an Emperor's more than twice as tall. They don't leap or shoot from the rooftops. They drop out of their portals onto the street or a roof and come straight for the mech to fight up close:

• Pincers: a claw opens as it winds up, then snaps shut on the mech's hips or torso (12 AP).
• Stinger: the tail cocks back while its venom bulb glows, then whips over the scorpion's head onto the mech (30 AP).
• Telegraphs: every hit is tested against where the rendered pincer or stinger tip actually is, so a dash during the wind-up dodges it. The raised shield turns away strikes from the front, along with the venom, shock and grab that ride on them.

Weakness: a scorpion can only climb about 100 ft (30 m) up a wall. Past that its grip gives out: it scrabbles at the wall, slips back down and tries again, so scorpions chasing a mech up a tower end up lined along the wall with their heads at the 100 ft mark. They can still climb over buildings shorter than that, but a mech on a higher roof, or high in the air, is out of reach of everything but their ranged attacks. Their pincers do reach a little past the line, so a mech standing right at the edge of a roof just above it can still be clawed.

Variant	Palette	What sets it apart
Burrower	Desert tan, amber glow	Dives into the street and tunnels at the mech, untargetable, straight under buildings, while the street heaves above it. A pulsing ring marks where it will burst out 0.6 seconds later, pincers first (24 AP).
Prowler	Black	Runs dark: its lights go out and neither the lock-on button nor missile locks can find it. It swings wide round the mech to strike from behind, where the shield can't help and its hits do 50% more. Its lights flare whenever it strikes or is hit.
Berserker	Dark red	Tougher (two rifle bolts). Below half its armor it goes berserk: glow flaring and venting red steam, it moves half again as fast and strikes and recovers far quicker.
Venomtail	Neon green	Its sting injects venom that eats 7 AP a second for six seconds and holds off armor regeneration; its pincers inject a little too. Lobs pairs of venom globs from range, or at a mech out of reach.
Shocktail	Neon blue	Its sting shorts out the mech's boost (45 drained, regen stalled). From range, and at a mech out of reach, it charges and arcs jagged lightning from its tail that drains boost too.
Scorcher	Neon orange	Sprays a stream of fire from its tail that drags after the mech's legs, burning it while it stands in the stream and setting the street alight. Burning patches last a few seconds.
Emperor	Royal purple, gold trim	Nearly twice the size of the other scorpions, with 160 HP and hits half again as hard. Its pincer seizes the mech and pins it for 1.8 seconds (dash to break free three times faster) while it reels itself in and stings.

How they're built

js/scorpions.js builds scorpions from the spider atlas parts: the thorax plate on a flat carapace hull, the ribbed dome stretched into the segmented body with the spine plate along its back, femur and tibia plates for the legs and arms, heavy hulls for the claw hands, striped claw plates for the fingers and stinger, and the glowing turbine disc wrapped onto the venom bulb. The neon kinds use a fourth channel on the palette's accent that makes the paint itself glow.

• Legs: eight, stepping in alternating tetrapods with knees thrown wide and the body slung low. They share the spiders' surface crawling and foot planting.
• Tail: five segments posed with planar CCD in a plane that turns toward the target. Each joint only curls forward, so the tail arches over the back at rest and whips over the head when it stings. The strike aims at the torso, chest or hips, whichever the stinger can reach.
• Pincers: two-bone arms with the elbows thrown outward. Each hand points its own way, forward at rest and at the mech in a strike, and a hinged finger swings open against a fixed one.

Every part is an InstancedMesh, drawn only up to the highest scorpion slot in use, so the 24 scorpions that can be alive at once cost about a dozen draw calls.

Riftlings

Eight-foot, six-limbed predators (the asset in assets/riftlings/): a split crest, scythe arms and a barbed tail. They come only from the summon menu, up to five hundred at a time, each through its own small portal, in four packs of one color apiece. A summon is dealt out into packs of that color's size, and the first of each pack to come through leads it. Alone they're frail (one rifle bolt, or two machine-gun rounds), but they're fast and many.

• Hunting: once the leader is down on its feet it screams the pack on, and the pack runs at the mech by the streets, round the blocks in its way. Close in, it comes straight on. Low walls and cars it hops, low buildings it climbs up and over, and when the mech is up on a roof it climbs the wall to it.
• Leap and latch: in range, a riftling crouches and leaps at the hull, leading the mech (so a dash at the right moment makes it miss). It clings where it struck, head up and claws in, for about a second, turning and moving with the mech and clawing at the armor (1.5 AP a stroke), then bursts with a wet splat in a spray of its color. On the hull it's out of reach of the mech's own guns and locks. A swarm's claws are handed to the mech once a frame, as one hit.
• Shot dead: it bursts in a smaller spray, collapses, lies a moment, then melts away into a colored fume.
• Underfoot: the mech's footfalls squash any under its feet, a hard landing squashes a wider ring, and a dashing mech bowls them over. A Blast squashed underfoot still goes off.

Pack	Color	Pack size	What sets it apart
Acid	Green	10 to 18	The biggest, fastest packs: they run at twice the mech's walking speed and leap from 22 units. Every splat sprays acid that eats armor the way a Venomtail's venom does, and splats add up, to six seconds of it.
Blast	Orange	5 to 9	Bloated, slower, glowing in pulses, and running in a tight clump behind their leader. Each one goes off like a grenade when it splats (21 AP) or is shot, killing whatever is close, so one shot into the clump sets the rest off in a ripple, and one going off on the hull blows the others there off it.
Shade	Purple	5 to 8	Runs dark, its glow dimmed and no lock-on able to find it. The pack spreads out to surround the mech 24 units out, keeping low and ducking sideways out of the crosshair, until the leader screams: they light up and all pounce at once, from every side, where the shield can only turn away the ones in front.
Spire	Blue	5 to 8	Comes over the rooftops, not the streets: climbs every wall in its way but the towers', bounds across the streets from roof to roof, and leaps at the mech from up high (44 units out) and straight off walls, so it can reach a mech up on a roof or in the air. Each latch shorts out 9 boost and stalls its regeneration.

js/riftlings.js runs them for the swarm (js/spiders.js); js/summons.js calls them in. They're drawn by the asset's own instanced swarm at its lower detail (about 2,400 triangles each): one InstancedMesh for all of them, posed in the vertex shader from its thirteen clips baked into a pose texture, so five hundred cost one draw call, plus one for the soft contact shadows under them (the posed mesh can't cast real ones). Each riftling is a point on a street, a roof, a wall or the hull, pushed out of the buildings (the same push-out the mech uses), out of the mech's legs and away from each other. The way to the mech by street is a flow field: the city's footprint is a grid of 3-unit cells, blocked under buildings and walls, and a breadth-first search out from the mech's cell (searched again as it moves) gives every street cell its distance to the mech, so a riftling only has to head downhill to come round the blocks, never into a dead end. Clips follow what each one is doing, their speed matched to its own: falling out of the portals, idle and screaming at the muster, running and walking, stalking and crawling for the Shades, dodging, leaping (with the clip's own hop taken out, so the arc it flies is the real one), the climbing clip turned head up for walls and the hull, hit and death.

The millipede

Summoned, a black robotic millipede hundreds of feet long crawls out of an upright portal (see Summoning) along the rooftops, and never stops crawling. Draped over the roofs and sagging over the streets between them, it grips roofs and facades with two pairs of legs under each of its ten armored sections.

• On the prowl: it doesn't come straight for the mech. It roams the blocks round it, 120 to 250 m out, heading for one spot and then another. It climbs over what it can, up to about 75 m at once; anything taller it bores straight through with the hooks on its face, slowing as it tunnels, when it can't turn away in time. It would rather not crawl over its own coils, but rides up over them when it must.

• A menace: every step drives a foot into the building under it, punching holes in roofs and facades, and its head bites anything it runs into.

• Turrets: two on its head, two on the section halfway down its body and three on its tail. They turn to track the mech and fire plasma bursts (head), gatling bursts (middle) and fans of bolts (tail) whenever they have a clear line. Each can be locked onto and shot off; three beam rifle hits or a bazooka does it.

• Armor: each section carries three layers of plates: black, then steel, then bronze. Weapons break plates off one at a time (they tumble off the body), the outer ones first; a plate is gone after a beam rifle hit or two or three machine gun rounds, and a plate with another still over it takes a third of a blast. Nothing else wears them down: not the roofs it lies on, not its own coils. The keel underneath never comes off.

• Reactor cores: a hole through all three layers over the middle of a section opens its reactor core, a rainbow gem in a cage. A few more hits destroy it and the section goes dark. Roughly four bazooka hits per core, or a missile salvo on one spot.

• The head can't be hurt while any core still burns. It rides right up against the front of the body and leads it.

• Breaking loose: with the last core gone the body dies where it lies. Thrusters in its neck light, the head tears free, climbs, flies off a fair way, turns and hunts the mech from the air with twin solid red beams from its eyes. They charge for a second, then burn for three, dragging after the mech (walking won't shake them, dashing will) and carving through whatever buildings they cross. The head takes 1900 damage, about fifteen direct bazooka hits.

• Death: the dying head rams through twenty to thirty buildings, tearing a tunnel through each, then climbs, spins faster and faster, and blows apart in a huge explosion with fireworks and a ring of smoke rolling out. The rest of the body goes up section by section.

The boss bar counts its reactor cores, then the head's armor.

How it's built

js/millipede.js plans its first stretch from its portal (see Summoning): a straight run back through the portal for the body still to come, and a gentle arc forward from it. Over the arc it lays the tightest drape: the lowest line over every roof it passes that never slopes more steeply than 0.65, starting from the portal's height. Of 90 tries it takes the one in view of the mech that lies most on roofs, low and smooth, and clear of the mech.

From then on the head leads and the body follows its trail, which it plans 72 units ahead of the head as it goes, a step at a time. Every few steps it tries nine headings, each turned as sharply as it can (no tighter than a 32-unit radius), and scores the next 54 units of each: how far it bends from the spot it's prowling to, how much it would climb, whether anything is too tall to climb (it would have to bore), whether it would pass over its own body, back behind its portal or out of the city. Each new step drapes down off a roof no more steeply than 1.3, climbs no more steeply than 1 (raising the stretch still ahead of the head to meet a roof), bores level through anything more than 46 units above it, and rises over its own body where that will still be lying when the head gets there. Where the trail bores, the head blasts a tunnel ahead of itself. The trail behind the tail is forgotten. Each section is a rigid piece laid along the trail and lifted until it clears every roof under it, with a ribbed sleeve over each joint.

The 1260 plates are curved tiles in three instanced meshes, one per layer. Shots are tested against each section analytically: the ray moves into the section's frame and meets the three armor cylinders, the keel, the core and the end frames in turn, so it stops on the first plate still there, or on the core through a hole. Blasts reach every plate in range, shielded by whatever is still on top. The legs reuse the spider atlas plates and two-bone IK, finding holds on roofs, walls or nothing (they dangle). The head is built from primitives with the body's own plates on its crown; it's a target of its own, armored until the cores are gone. The turrets are targets of their own too, each riding its frame (the head, the middle section, the tail tip) and turning in its own base's frame. A foot that comes down on a building carves a small hole: up to eight a second in buildings already broken into, and only one every 0.6 s that breaks into a whole one, which is costly.

Insertion

Every deploy starts with the frame slung under a Kestrel H heavy lifter: a gunmetal variant of the Kestrel dropship, half again its size, with ducted lift fans in place of the rocket pods and a cradle under the belly whose clamp arms hold the mech by the shoulders. There is no control during the flight, about twenty-three seconds behind letterbox bars with a release countdown:

• It starts some 250 meters up over the harbor south of the city, the skyline ahead, and swoops down onto the line of an avenue, pulling out just over the traffic at the seawall.
• From there it threads the streets between the towers with the mech's feet some twenty meters over the road: up the avenue, a left onto a cross street through the tallest canyon, a right, a left past the twisting supertall, and a wide right over the starting plaza that brings it to a hover with its nose north. It banks into every turn, dips its nose as it speeds up and lifts it as it brakes, and bobs gently as it goes.
• Its line and pace are worked out each time from the city: the route is counted in blocks from the plaza and runs down the middle of the gap the buildings leave in each street, its corners are arcs tight enough that the wings clear the towers, it never drops below what clears every roof under its wings, and it slows for each turn and speeds up out of it, every change of pace eased so none is sudden.
• The camera starts off its right flank over the water, swings in behind it as it reaches the city and rides its line through the streets, hanging back further the faster it goes, and eases into the usual over-the-shoulder view by the release.
• Space (a tap on a touch screen) lets go of the frame at any point in the flight: the clamps click, open a moment later, and the frame drops into the street with the lifter's speed. Over the open water it waits until the lifter crosses the seawall. The lifter, lighter, flies on along its line, climbing out of the streets until it is out of sight.
• The clamps open about seven meters up and the frame drops onto the plaza; it is the player's from the moment it lets go. The lifter climbs straight out of the towers and flies off north. The swarm can't touch it.

Allies

Packs of three to ten Kestrel assault lifters, each with a Bastion armored carrier slung under it, fly in about every minute (the first a quarter of a minute after the release), mostly over the harbor, sometimes over the rivers east or west. Both are the models from the Riftlings preview (assets/riftlings/preview.html), ported to js/vehicles/models.js.

• Kestrels fly in a V at a height that clears every roof on the way, split up over the city, each to its own street: a crossing or the middle of a block 40 to 260 m from the mech, with open sky over it (never under the El or the highway). Over its spot a Kestrel turns to lie along the street, comes straight down between the buildings, sets its tank down, and climbs back out over the skyline. While it is low its chin turret covers the street in short bursts.
• Bastions drive the street grid, keeping to the right of the road, from crossing to crossing toward the nearest bug, or back toward the mech when there is none. They stop to shoot at whatever they can see within 175 m, leading it, with twin guns that elevate to hit bugs on walls and roofs, and roll over cars and flatten them. Tanks give each other room, and one that can't get past rubble or wrecks marks that block and finds another way.
• The swarm hunts them back. A spider, scorpion or medium frame goes after a tank or Kestrel that is a good deal nearer than the mech: it crawls, perches and aims at it, and its plasma, lasers, mortar shells, pounces, pincers and stings land on it. Bosses keep to the mech. A Bastion has 150 armor; wrecked, it burns for half a minute with its turret blown off its ring. A Kestrel has 300; shot down, it spins in burning and crashes, and a tank still under it is lost with it. Only the Kestrel H carrying the mech is safe.
• Tank kills don't count toward the mech's kills or light its hit marker. There are at most 16 tanks and 12 Kestrels at once (10 and 8 on touch devices), drawn as instanced meshes: one per part and material of each model, posed per copy, so a whole pack costs a few dozen draw calls.

The headless test tools/tests/allies.js [frames|drop|tanks|soak] checks the frame select and loadout screens on a desktop and a landscape phone, flies an insertion and checks the landing, forces a pack in and watches the tanks fight the swarm (and a Kestrel shot down), and plays two minutes in real time for the frame rate. Screenshots go to tools/tests/out/.

Design notes

The suit follows Armored Core's style:

• Silhouette: tall, hunched frame, narrow waist, long arms with heavy forearms.
• Armor: sharp, faceted plates that sweep backward.
• Head: a beast head thrust forward between raised collar plates, on red hydraulic neck rams:
  • A pointed prow leans out over an open maw lit red behind its fangs, above a lower jaw that ends in a hanging chin.
  • Armor scales layer up and back from the prow into a crest of swept fins.
  • Each eye is a slanted red slit with an orange core, set under a heavy brow with a glowing seam. The eyes glow red in every paint; only the glint at their core takes the paint's eye color.
• Legs: blade knees, thin shins and talon feet with heel spurs.
• Back: a booster pack with swept stabilizer fins. Missile pods and cannons mount on top of it.
• Paint: dark armor over a gold-trimmed frame. The default is Lynx Navy; Unsung Black, Shrieker Steel, Glint White, Desert Ops and Crimson are in the hangar.

Walking is procedural:

• Foot planting: each foot locks to its spot on the ground while planted, so feet never slide.
• Stepping: a lifted foot peels its heel, arcs forward, and lands heel-first on a spot predicted from the current velocity. Each foot spends 60% of the cycle planted.
• Leg solving: two-joint IK bends the hip and knee to reach the foot, with the knees steered forward and outward.
• Body motion: the body sinks after each footfall and rises at the passing pose. Weight shifts over the planted leg, the hips twist with the stride while the torso counter-twists and jolts on impact, and the arms swing against the legs.
• Standing still: the feet settle into a staggered stance. Turning in place shuffles them to follow.
• Air and dash: jumps and dashes use canned leg poses that blend back into the walking system on landing.

The thrusters are built to read as real hardware:

• Main engines: two bell nozzles hang from armored housings under the backpack.
  • Each sits in a gimbal ring with hydraulic rams. The rams stretch as the bell swings back for a dash and down for a climb.
  • The bells are heat-tinted, gold at the throat shading to blue at the lip, and glow inside when lit.
• Backpack verniers: small nozzles on the pack's upper corners.
• Calf verniers: each sits in a recessed bay behind a two-piece armored cover that swings open when they fire.
• Heel verniers: set into a notch at the back of each foot.
• Exhaust: a camera-facing plume with shock diamonds, a turbulent inner shell and an exit glow. A light and a ground glow wash the area under the suit during a climb.

Armor plates are cut straight from the body sheet: js/pieces.js holds the outlines of the sheet's panels, traced in sheet pixels. pieceGeo() in js/atlas.js extrudes a plate to that outline and maps the panel's art onto its face, so the E-07 hatch, R-07 forearm plate, shin plates, hazard pads and DANGER intake panel all keep their painted shapes on the model. An inverted-hull pass (addOutline()) draws ink outlines for the anime look; it can be turned off in the hangar settings.

Code map

File	What it does
js/regions.js	Pixel rectangles of the panels used from each texture sheet
js/pieces.js	Traced outlines of the cut-out armor pieces on the body sheet
js/atlas.js	Texture loading, box-projected atlas UVs, geometry helpers, ink outlines and merging rigid parts, paints and skins
js/mech.js	Mech model, gimbaled bell-nozzle thrusters with plume shaders, IK foot-planting gait, dash/jump/aim animation
js/frames.js	The frames in the hangar (FS-07A Vanguard, HV-02 Obsidian): armor, speeds, boost, and how each is built
assets/heavy-frame/heavy-mech.js	The HV-02 Obsidian: new armor on the stock rig (subclasses Mech)
js/weapons.js	Weapon definitions and models, projectiles, homing missiles, lock-on
js/fx.js	Instanced billboard particles (smoke, fire, sparks), explosions, light pool, decals
js/city.js	Port Meridian: street grid, buildings, houses and row houses, roofs, parks, the forest, street furniture, elevated railway and highway, waterfront, bridges, distant scenery
js/trees.js	Trees: species, textured trunks and crowns instanced by chunk, uprooting, rigid-body tumbling and rolling, burning
js/cars.js	Cars: bodies shaped to their skins in the vertex shader, parked cars, lane-following traffic that turns and respawns
js/pilot.js	The pilot on foot: the armored model, the first person arm and rifle, jetpack movement, the grappling hook, sticky grenades
js/rides.js	Rides for the pilot: the Kestrel gunship (the dropship), the Hornet helicopter (model, vulcans, heavy vulcan, swappable missile pods), the APC and stolen cars
js/people.js	People: fifty models, the rig and its animations, sidewalk walkers, panic, building occupants, falls and splats
js/gore.js	Blood: the spray of droplets when someone dies, and the splatters they leave stuck to floors and walls
js/furniture.js	Furniture: sixteen modeled pieces, furnishing broken floors, thrown and tumbling pieces

The atlas mapping in atlas.js (mapUV) assigns each triangle to one of six directions by its normal and maps it into the region chosen for that direction, cropping the region to the face's aspect ratio so panels never stretch. To re-skin a part, change the region names passed in its faces object.