What it is

A launch page for Auscura, a fictional medtech startup, and its concept digital stethoscope, the Auscura S1, of the kind a hardware startup would commission before launch. It opens on a close-up of the chest piece, pulls back to the whole instrument with a short spec sheet, then takes the chest piece apart into nine labelled parts (diaphragm, silicone rim, chrome bell and chamber, MEMS microphone board, main board, haptic motor, curved battery, LED ring and the electronics ring with its USB-C port). The listen chapter makes the LED ring glow in time with an animated waveform; the modes chapter switches heart, lung and wide, which changes the waveform and the ring colour; then a companion app mock-up in HTML, a finish picker with a drag turntable, and a demo early-access form that sends nothing. A note on the page and in the footer says it is a concept demo, not a medical device. The company, the device, the signal and every figure are invented; figures carry the word "illustrative" and the copy makes no medical, diagnostic or accuracy claims (a unit test checks the copy for such words).

Engineering decisions

• Plain Three.js without React Three Fiber, like Warmline and Aster Bay: one imperative scene module (world.ts) with a frame(input) call; React renders only the HTML around it.
• Everything is modelled in code (model.ts), no model files or image downloads: lathe profiles for the chrome head, the bell, the electronics ring and the ear tips; extruded annuli for the main board, the LED flex and the curved battery cell; Catmull-Rom tubes for the Y-tube, the binaurals and the headset spring bar. Canvas textures draw the diaphragm rings and wordmark, the board's traces and pads, and the engraving round the ring. Chips and LEDs are instanced.
• Exploded view: each chest-piece part is its own group, lifted along the chest piece's axis by an offset from a data table (story.ts). The nine callouts are HTML positioned from projected 3D anchors by the render loop, so scrolling never re-renders React.
• The waveform is a synthetic, illustrative signal from pure functions (signal.ts, unit-tested): heart mode is two short tone bursts per beat at 66 bpm, lung mode is breath-shaped value noise with a faint beat under it, wide mixes both. The pulse glow reads the loudness envelope of the same signal, so the ring and the line stay in step. The card waveforms are 2D canvases drawn by the same loop; the app mock-up uses an SVG path from the same function.
• Story chapters are data (camera pose, turntable angle, tilt, explode, glow); one scrubbed GSAP tween moves a progress value, each segment moves for 80 % and rests for 20 %. On desktop the subject slides to the side opposite the text with a camera view offset; on narrow screens the camera pulls back and the subject sits in the upper part of the screen above the cards.
• Lighting without downloads: a PMREM-baked RoomEnvironment for the chrome reflections, a warm key and a cool rim light, a coloured point light at the LED ring, and a canvas-texture contact shadow. The studio backdrop is a CSS gradient behind a transparent canvas.
• Manrope and Instrument Serif are loaded with next/font inside this experiment only; the page waits for them (at most 3 s) before it reports ready.

Performance notes

Three.js loads only on this page. The scene renders continuously while on screen and the tab is visible (the glow pulses), and stops when off screen or hidden. The low tier (phones, 4 cores or fewer, or ?quality=low) drops antialiasing and clearcoat, caps the pixel ratio at 1.25, halves lathe and tube segments and draws fewer board components. ?debug shows the frame rate. Everything created is disposed on unmount; a lost WebGL context shows the poster.

Reduced motion

Chapters cut to their pose behind a 0.15 s fade instead of flying; no idle sway; the ring glows steadily; the waveforms are drawn once as still lines and the app mock-up's line does not scroll; dragging still turns the model but without momentum, and the rotate buttons jump instead of easing.