🔍 Read the full analysis: Can An AI Workflow Render A Floating-Seam Journey Without Images? on ThorstenMeyerAI.com

Buying for a business?Offer from Amazon

Get business pricing on monitors, keyboards and dev gear

• Business-only prices and quantity discounts
• Tax-exempt purchasing
• Multiple users, one account, clear invoices

Create a free Business account →Free to register

As an affiliate, we earn on qualifying purchases.Hide

KIRIN EXPRESS, an AI-built website presenting a fictional maglev train traveling at 603 km/h, uses browser-drawn scenery and motion rather than photographs or video, as described in the original analysis. The exhibition treats an imagined 10-centimetre gap between train and guideway as both its visual theme and a guide to moving through the page.

The project is explicitly an exhibition piece, not a real rail service, manufacturer, or transport product. Its page depicts invented stations and landscapes, with the landscape blurring between stops and sharpening as a station approaches the screen’s centre. Vehicle shapes, scenery, instruments and movement are rendered in the browser, according to the project description; it says no image assets are used.

The design pairs porcelain white and cool grey with deep indigo and occasional sakura pink. Floating panels and indigo-tinted shadows echo the levitation concept, while the page’s persistent luminous seam represents the magnetic field. The description names Zen Kaku Gothic New for display text and IBM Plex Mono for measurements, times and controls.

Scrolling drives the journey’s visual changes. The project’s JavaScript function, updateJourney(), checks which station is nearest the vertical centre of the viewport and adjusts blur and speed values accordingly. A canvas routine draws up to 72 horizontal motion lines, with their length and pace responding to scrolling, the source says. The animation is limited to the relevant part of the page, pauses when a browser tab is hidden, and switches to a still treatment for visitors who prefer reduced motion.

How the Gap Shapes the Interface

The project’s main design idea is that a technical detail can organize an entire digital experience. Rather than using a standard set of transport photographs, the imagined levitation gap informs the shadows, spacing, glowing seam and transitions between stations. Scroll becomes a way to travel through the fictional landscape, not just move down a page.

That makes the showcase relevant to designers and developers exploring what a browser can communicate without image files. The source describes a combination of HTML, CSS, JavaScript, canvas and drawn forms, with interaction providing context that static visuals alone might not. It is a design demonstration, however, not evidence that an AI can independently deliver a production-ready website or that the approach is more accessible or efficient than other methods.

A Fictional Journey, Built in Code

The KIRIN EXPRESS brief calls for a fictional intercity line and a single-page showcase made with pure HTML, CSS and JavaScript, without frameworks, build tools, CDNs or external requests. It asks for all visuals to be generated in code, including CSS, SVG, canvas or WebGL work, and for self-hosted fonts. The source describes the result as AI-built but does not identify the specific AI tools or explain how much of the implementation was written or revised by a person.

The page’s controls extend the concept beyond the scroll sequence. A 20-second departure console runs through platform preparation, levitation and acceleration, using one progress value for both a circular instrument and a miniature train. A separate guideway cross-section lets visitors switch between magnetic attraction and repulsion, while a field-test control sends a pulse along the seam. A dusk slider changes the window view, including lighting and the displayed time.

The accompanying account says the build was refined in three passes: creating and critiquing the experience, addressing problems found in an external critique, then making a final art-direction pass. It also describes an AI-written design guide documenting the visual system, interactions and motion safeguards. These are process details reported by the project; the source does not provide independent testing or a full record of the critique.

“A train designed around the space beneath it.”

— KIRIN EXPRESS project description

What the Showcase Does Not Verify

The source describes the design and its intended behaviour, but it does not provide independent confirmation that the page meets every technical target in the brief. Those targets include zero horizontal overflow at 390-, 834- and 1440-pixel widths, tap targets of at least 44 pixels, specified text contrast, and performance near 60 frames per second. No test results, measurements, screenshots or accessibility audit are included in the material provided.

It is also unclear which parts were generated by AI, what human editing took place, and what the external critique identified or changed. The page is presented as a fictional concept; its speed and maglev controls do not establish real-world train performance or engineering feasibility.

The Live Page and Its Design Notes

The project description directs readers to the live website and a separate design guide for a closer look at the rendered experience and implementation notes. Those materials would be the next place to inspect the station sequence, controls and responsive behaviour directly. The supplied account does not give a dated release schedule, announce a further development milestone, or say whether testing results will be published.

For now, the clearest confirmed development is the presentation of an AI-built, fictional journey organized around code-rendered visuals and interactive browser behaviour. Any broader claims about production quality, accessibility or performance remain dependent on evidence beyond the description provided.

Key Questions

Is KIRIN EXPRESS a real train or rail operator?

No. The source identifies KIRIN EXPRESS as a fictional exhibition piece, not a real operator, company product or train service.

How does the page create its visuals without images?

The project description says vehicle forms, scenery, instruments and motion are drawn in the browser, using code-based techniques. It says the experience uses no photographs or video.

What does the 10-centimetre gap represent?

It is the fictional distance between the train and guideway. The page uses that levitation gap as a visual system for floating panels, shadows, a luminous seam and the journey’s interactions.

How does scrolling affect the journey?

As visitors scroll, the page checks which station is nearest the centre of the screen. The described code uses that position to change blur and speed effects, bringing the nearest station into focus.

Has the project’s accessibility and performance been independently tested?

The source lists accessibility and performance goals, including reduced-motion handling and pausing animation when a tab is hidden, but provides no independent audit or measured test results.

Source: ThorstenMeyerAI.com