Get furniture and decor delivered free — and shop member deals
- Fast, free delivery on millions of items
- Access to Prime Big Deal Days deals on October 6–7
- Prime Video, Amazon Music and more included
A mile measured in motion
“Meridian 843 | The Measured Mile” is an AI-built exhibition piece: a fictional speed-record program imagined as a room made for the browser. It is not a real vehicle company or a report on an actual record attempt. The room’s central design move is to make the page itself feel like a salt-flat course. Scroll downward and seven wide stations glide sideways past a steady horizon, turning a familiar gesture into forward travel.
For an interior-design audience, the appeal is in the spatial discipline. There is one direction, a persistent landscape and a carefully controlled rhythm of information—more instrument panel than showroom. The fictional Meridian M-17 and the people who tend to its run give the setting a human scale, but the real subject is how a space can communicate speed without becoming visually chaotic.
browser-based interactive display
As an affiliate, we earn on qualifying purchases.
As an affiliate, we earn on qualifying purchases.
From brief to certified room
The process followed three passes: build the room and its shared motion system, critique it mercilessly at multiple viewport sizes, then complete an art-director certification focused on composition and usability. The accompanying technical field guide explains the implementation, including the scrolling ribbon, canvas landscape, threshold effects and reduced-motion behavior. AI built the site—that is the story being documented here, not a claim that the fictional Meridian program exists.
The full build notes live in the room’s design guide.
Inside the room
The palette does the work of place-making: salt white (#f5f4ed), cyanotype blue (#176f9c), burnt orange (#e34e1a) and deep course ink (#092f42). Against the pale ground, the blue suggests a hard noon sky; orange acts like livery or a course marker. Sharp edges and hairline rules keep the composition closer to a precision instrument than a conventional promotional site.
Typography reinforces that split. A tall, aerodynamic display face carries the large speed and headline moments, while Space Mono handles coordinates, timing fractions and certification details. The contrast gives each kind of information its own visual register, much as a physical exhibit might separate a hero object from its technical labels.
The signature interaction ties the room together with a single shared measure of progress. Browser-native code maps vertical scrolling to horizontal movement across the seven stations, while the landscape and fixed car respond to that same journey. Canvas draws the salt, sky and converging course lines; a seeded pattern gives the crust’s branching fractures a stable, irregular character. An inline SVG supplies the M-17, held against the terrain as the surrounding material moves past it.
At high speed, the environment begins to behave differently: the type and horizon pick up heat and mirage effects. Passing the 842 threshold triggers a photo-cell ruler, a scan and a chronograph-style certificate. These changes are not separate decorations; they are responses to the page’s progress state. The site was built with browser-native code and no external asset requests. When reduced motion is preferred, the lateral sequence gives way to a conventional vertical reading order.
Want this? Paste this into your AI coding agent
Build a single-page showcase website from this art-direction brief. Work like an elite creative frontend engineer; commit totally to the direction.
BRIEF (room 127 of 175, “bonneville”):
BONNEVILLE — the MERIDIAN 843 land-speed streamliner on the salt (fictional record program). Aesthetic: blinding salt horizon; one line, one direction. Palette: salt white, heat-haze silver, burnt orange livery, cyanotype sky. Fonts: six-caps (tall speed display), space-mono (timing slips). SIGNATURE: THE MEASURED MILE — the entire site is ONE horizontal ribbon: vertical scroll converts to horizontal travel across the salt; a speedometer climbs as you go and the world responds — at 500 km/h the horizon starts to shimmer (canvas heat-mirage bending distant type), at 843 the letterforms themselves stretch and streak. Mile markers are the nav. Timing-association record cards (flying mile vs flying kilometre), the salt-crust texture procedurally generated (crackle noise), the push-truck and parachute rituals, “the salt is a clock” essay. Unforgettable: type deforming at record speed.STACK: pure HTML/CSS/JS, no build step, no frameworks, no CDNs or external requests of any kind; self-hosted fonts only; every visual is code (CSS/SVG/canvas/WebGL) — no image assets required.
QUALITY BAR: flawless at 390px, 834px and 1440px with zero horizontal overflow; tap targets >= 44px; semantic landmarks, focus-visible styles, body-text contrast >= 4.5:1; prefers-reduced-motion pauses or simplifies heavy animation; rAF loops pause when the tab is hidden; hold 60fps (cap particle counts, avoid layout thrash); rich invented content everywhere — real-sounding names, numbers and program notes, never lorem ipsum; orchestrate one beautiful staggered load moment plus scroll and hover surprises. FORBIDDEN: Inter/Roboto/Arial/system-ui, purple-gradient-on-white, and cookie-cutter hero+cards+footer layouts.
PROCESS: iterate in three documented passes — (1) build plus builder self-critique, (2) merciless external critique finding and fixing at least ten real problems, (3) art-director elevation from good to unforgettable. Screenshot at all three widths every pass and fix everything you can see.
— Original brief by Claude Fable 5 (art director), executed by the FABLE/175 pipeline.
— This room lives at https://fable-25-830.netlify.app/sites/bonneville/
This is the verbatim art-direction brief that produced the room — exposed by the exhibition itself via the “Prompt” link in the room’s footer.
Take the measured mile
Visit the live Meridian 843 room to experience its lateral course, persistent landscape and record-threshold reveal. Then browse the hub of all 175 rooms for more AI-built exhibition concepts.
Visit the live room → · Browse all 175 rooms
Previously in Wing VI
FABLE / 175 is a finished exhibition of 175 fundamentally different websites, each built end-to-end by an AI. This article is part of our series walking through it room by room.
Fall Picks
fall essentials
As an affiliate, we earn on qualifying purchases.
