TL;DR
Abyssal Station, a live room in the FABLE / 175 web exhibition, turns page scrolling into a simulated 3,800-meter ocean descent. Its credited production process used AI to build and refine a custom HTML, CSS and JavaScript system, although the source does not document the models, prompts or human oversight behind each decision.
Abyssal Station, the sixth room in the completed FABLE / 175 exhibition, is now presented as a live, AI-built website that converts scrolling into a 3,800-meter simulated dive. As detailed in the original analysis, the project’s defining system links depth, color, lighting, pressure data and animated marine life to one scroll position, offering a concrete example of how AI-assisted production can support a technically coordinated interactive experience.
The website uses a master scroll anchor to measure a visitor’s position and translate it into simulated water depth. According to the project account, JavaScript interpolation then updates dependent systems, including the background, light level, pressure display, particle movement and creature animation. CSS variables distribute those changing values across the interface.
A fixed meter tracks the descent through ocean zones as the palette moves from surface teal toward hadal black. A canvas engine supplies schooling fish, pulsing jellyfish, an anglerfish lure, marine snow and ghostly amphipods. At the bottom, the station lights activate as the experience’s restrained finale.
The published brief specifies plain HTML, CSS and JavaScript, with no frameworks, build step, content-delivery networks or external requests. It also calls for self-hosted fonts, semantic landmarks, keyboard access, visible focus styles and a reduced-motion mode. Animation loops are meant to pause when the page is hidden, while capped particle counts and limited layout work are intended to support 60-frame-per-second performance.
One Scroll Position Runs Everything
The project matters less as a claim about autonomous AI creativity than as a demonstration of coordinated interaction design. By deriving many visual states from one depth value, Abyssal Station avoids treating animation, interface data and color as separate effects. That architecture gives the page a consistent physical logic: every system responds to the same fictional descent.
For designers and developers, the room also shows how a strong art-direction brief can give an AI coding workflow measurable technical constraints. Screen widths, minimum tap-target sizes, contrast, motion preferences and performance behavior were specified alongside the visual concept. The result suggests that detailed constraints can shape AI-generated frontend work more reliably than a broad request for an underwater-themed page.
HTML CSS Javascript Starter Kit
As an affiliate, we earn on qualifying purchases.
As an affiliate, we earn on qualifying purchases.
Room Six in an AI Exhibition
Abyssal Station is room six of 175 in FABLE / 175, which describes itself as a finished exhibition of fundamentally different websites built end to end by AI. The exhibition credits the original brief to Claude Fable 5 in an art-director role and says the room was executed through the FABLE / 175 pipeline.
The source describes a three-pass production process: an initial build and self-critique, an external critique required to identify and fix at least 10 problems, and an art-direction pass intended to raise the final presentation. The brief also required screenshots at 390, 834 and 1,440 pixels during each pass, with visible layout problems corrected.
“The page is a descent.”
— The published Abyssal Station art-direction brief
AI’s Exact Role Is Undocumented
The supplied material does not disclose which model versions produced the code, how many generations were required or how much human editing occurred. It also does not provide prompt logs, code revisions or critique records that would let readers verify the claimed three-pass workflow.
Several quality statements remain claims from the project brief rather than independently reported test results. The source does not publish frame-rate measurements, accessibility audit findings or browser-compatibility data. It is also unclear whether the required 10 critique fixes were completed exactly as specified or which issues were changed before release.
Live Testing Will Judge the Engine
The room is available at the exhibition’s live site, where visitors can test the depth engine, responsive layouts and reduced-motion behavior directly. A fuller evaluation would require access to the final source code, production records and performance tests across the three specified viewport widths. Future room-by-room reports from FABLE / 175 may also show whether the same build-and-critique pipeline produces comparable results across different visual concepts.
Key Questions
What is Abyssal Station?
Abyssal Station is a single-page interactive website depicting a crewed research station descending through ocean zones. It is room six in the 175-site FABLE / 175 exhibition.
How does the depth engine work?
A master scroll position is converted into simulated depth. JavaScript interpolation and CSS variables use that value to coordinate lighting, color, pressure data, particles and creatures.
Was the entire site made by AI?
The exhibition describes the room as built end to end by AI and credits Claude Fable 5 and the FABLE / 175 pipeline. The supplied account does not state the extent of human review or code editing.
Does Abyssal Station use external images or frameworks?
The published brief calls for no frameworks, external requests or image assets. Its visuals are specified as code generated through CSS, SVG, canvas or WebGL.
Is the experience accessible to people sensitive to motion?
The brief requires a prefers-reduced-motion fallback, keyboard navigation, visible focus states and minimum 44-pixel tap targets. The source does not include an independent accessibility audit confirming the final implementation.
Source: Thorsten Meyer AI
