← RETURN TO FLIGHT DOCUMENT TW7‑FM‑139 / REV C

Design & Interaction Field Manual

BUILDING
THE ASCENT.

This room treats a web page as a launch vehicle: it counts down, clears the tower, sheds structural mass, reaches apogee, and returns under fabric. Every image and instrument is made from browser-native code.

01 / CONCEPT

Garage Nerve.
Range Discipline.

Trägerwerk 7 is a fictional Baltic high-power rocketry collective. Its visual world combines a scuffed concrete pad, a cold telemetry console, bright Nomex covers, and seven people who document everything. Ambition is allowed to feel large; carelessness is not. Orange marks heat and consequential action. Green marks a live instrument or a safe state.

The page follows one complete flight instead of arranging unrelated feature cards. Dark electronics surround boost and telemetry. Daylight returns with the airframe inspection, then softens into the Baltic recovery field. The emotional arc moves from compression to acceleration to suspension.

02 / STAGING

A Page That
Sheds Mass.

The opening sequence in main.js advances T−10, fills a continuity track, flashes ignition, and adds .is-ready. That class launches a staggered handoff: copy rises, the rocket enters, and telemetry resolves last. It is a short ceremony, not a toll gate.

At each boundary an IntersectionObserver fires the separator once. CSS moves the paired .stage-shell sleeves away from the glowing core while bolts tumble outward. makeSmoke() adds seven temporary puffs and removes them after their animations. setRailStage() advances the fixed flight rail, so the whole document retains a visible position inside the stack.

01 / RELEASEclamps
02 / BOOSTtrace
03 / COASTimpulse
04 / MAX‑Qstructure
05 / DEPLOYrecovery
03 / TELEMETRY

Scroll Becomes
Flight Time.

requestFlightUpdate() caps scroll work at one animation frame. updateFlight() reads the plot position once, normalizes it to 0–1, and drives the SVG trace, playhead, altitude, velocity, and phase from that shared value. getPointAtLength() keeps the glowing dot physically attached to the altitude path.

The same file runs the final safety litany through runRangeCheck(). Each response confirms in sequence, the lamp turns green only after the third call, and the control can replay the check. runDeploymentTest() adds a tactile recovery-bench moment: it reefs the CSS canopy, loads the shrouds, tugs the capsule, and reports each state through an accessible live region. When the document is hidden, scheduled drawing stops and CSS animation play states pause.

SCROLL / 0–1DRAW / SVG PATHREPORT / VALUESPHASE / APOGEE
04 / MATERIALS

Pad, Flame
& Phosphor.

The palette uses two dominant fields rather than evenly weighted swatches. Range black owns ascent; pad concrete owns the workshop. Telemetry green is reserved for state and signal, while Nomex orange cuts across both fields. A peach fringe appears only in combustion and deployment light.

RANGE BLACK#07100C
PAD CONCRETE#C9C7BA
TELEMETRY#91FF9F
NOMEX#FF6238

Sora supplies tightly tracked mass for headlines. VT323 carries coordinates, witness marks, timing, and values with tabular numerals. Both fonts are self-hosted. Grain comes from a tiny inline SVG turbulence texture; flame, parachute, rocket, gantry, plots, fields, and smoke are CSS or SVG.

SORA / MASS & DIRECTIONVT323 / 05462 M AGL / LINK 98.7%
NO GENERATED ASSETS. NO EXTERNAL REQUESTS. THE CONSTRAINT IS THE EXHIBIT: EVERY VISIBLE MACHINE PART CAN BE INSPECTED IN HTML, CSS, OR SVG.
05 / REPRODUCE

Prompt The
Whole Flight.

Ask an AI coding agent for a narrative system, not isolated components. Specify a sequence, material vocabulary, one repeatable signature interaction, exact responsive widths, and firm performance and accessibility limits.

Build a responsive launch-club field log that behaves like a complete rocket flight. Open with a brief countdown and staged hero reveal. Turn every section boundary into a one-shot mechanical separation with bolts, sleeves, smoke, and persistent mission progress. Map scroll to one coherent SVG telemetry instrument. Shift from hard boost motion to suspended recovery drift, then end with a replayable range-safety check. Use concrete, phosphor green, heat orange, Sora, and VT323. Create every visual in code, stop work while hidden, honor reduced motion, and write specific fictional engineering content.