How itflies.

The concept

Paper Flight Lab treats a childhood ritual with the seriousness—and the visible joy—of a school aeronautics department. The visual language joins two kinds of precision: pale blue graph paper for measurement and sharp origami geometry for transformation. Pencil-dark typography gives the page authority, while dashed red folds and test-flight orange keep the science playful. Content is written as a working lab record rather than product copy: tolerances, launch conditions, invented researchers and verified hall distances make the room feel inhabited.

The folding bench

The signature fold sequence lives in main.js. The designs object stores aerodynamic coefficients and four instructions for each airframe. foldGeometry() returns fresh SVG polygons and crease paths for every design-step pair; renderFold() swaps that geometry, the operation copy and progress marks together. New polygons receive the paperSnap animation, so every step lands like a pressed crease. The added renderCreaseMemory() layer remembers each mountain and valley operation: the Crease X-ray control reveals the translucent geometry, runs a scanning light and reports a design-specific symmetry estimate. AUTO-FOLD advances the same state machine and pauses while the document is hidden.

The test hall

The launch is drawn on a high-density canvas by drawHall(). calculateFlight() combines launch angle, force, elevator trim and the active design’s lift, drag and stability coefficients. It is intentionally friendly rather than computational-fluid-dynamics accurate: good trim makes a smooth sine-like glide, while excessive positive elevator creates an early apex and steep stall. animateFlight() reveals the sampled trajectory over time, rotates the paper plane along the local slope and chalks the live distance into the hall. Every animation frame is cancelled or paused when the tab is hidden, and reduced-motion visitors receive the completed result immediately.

Air made visible

The four-forces plate is a semantic SVG with custom arrow markers and short plain-language annotations. Farther down, ten SVG smoke paths bend around a fixed wing profile. Their staggered dash animations create the feeling of a smoke comb without a heavy rendering library. CSS graph grids, tiny measurement labels, double-line verification stamps, a subtle inline noise texture and deliberately imperfect rotations build the atmosphere around those primary diagrams.

Palette + type tokens

Epilogue carries every headline and paragraph, ranging from a delicate 300 italic to a compact 900 black. Space Mono is reserved for measurements, controls, captions and evidence. The core CSS tokens—--paper, --ink, --grid, --red and --orange—keep the lab’s hierarchy consistent across paper and dark test-hall sections.