Building AI-Generated 3D Narrative Websites: From a Block of Stone to a Complete Interactive Experience

With generative AI iterating at a rapid pace, using large language models to produce interactive 3D websites directly has become a reality. Recently, working around the theme of “how Michelangelo’s David was born from a block of stone,” I ran two complete build experiments using different AI coding tools. The entire process covered requirement definition, asset retrieval, code generation, architectural adjustment, and cross-tool collaboration, ultimately delivering two interactive websites with very different narrative angles, both built on real 3D scan data. This article is a full retrospective of that workflow, along with key lessons on model selection, cost control, and production pipeline optimization.

1. Project Goal: Reshaping How Users Understand Sculpting Through Interactive Narrative

The core task was not to build an ordinary educational page, but an ambitious interactive website that helps everyday users understand how the David statue emerged from rough stone to a perfect human form. The hope is that after browsing, visitors take away more than a few historical dates or dimensions—they gain a new understanding of what “sculpting” means, and feel motivated to linger and observe the work closely.

To achieve this, my prompt explicitly required the AI tool to make its own decisions on four fronts:

• Narrative angle: Create an emotionally resonant storyline rather than a flat recitation of history.
• Visual style: Match the artistic temperament of the Renaissance while keeping web rendering performance solid.
• Interaction: Let users experience the logic of “subtractive carving” firsthand through actions such as clicking and pressing.
• Technical route: Prefer 3D rendering solutions that run smoothly in the browser, avoiding heavy plugins.

I also explicitly required the tool not to stop at the proposal or mockup stage—it had to deliver a runnable, experienceable finished product.

2. First Experiment: “Remaining Form,” a Concrete Interactive Approach

1. Core Concept: “What’s Left” as the Narrative Spine

The first AI tool proposed a concept it named “Remaining Form.” Its narrative logic is remarkably subtle: David was not “created”—he is what “remained” in the stone. The site opens on a dark room with an uncarved block of white marble at its center. The user must press and hold a button on the page to simulate striking with a chisel. With each press, a piece of stone breaks away along the carving path, and David’s figure gradually emerges until the complete statue is fully revealed.

The brilliance of this interaction design is that it turns “sculpting is subtraction” into a tangible physical action. Every press of the user’s finger corresponds to a “chisel strike” in art history—a mapping far more impactful than reading text.

2. The Finishing Touch: “Marble Has No Undo Key”

Within the interactive flow, the design includes a detail rich in philosophical meaning: the page offers an “Undo” button, but when the user clicks it, no undo happens. Instead, a single line appears: “Marble has no undo key.”

This line is simultaneously a technical fact (carving is irreversible) and an artistic metaphor (every step in a creation carries consequences). Elevating a technical limitation into a narrative element was the most valuable moment in the AI-generated content.

3. Technical Implementation

This version uses WebGL for real-time 3D rendering. It loads an actual STL scan of the David statue (from the public Scan the World project, under a CC BY-SA 4.0 license), and the shader dynamically adjusts mesh vertex visibility based on the cumulative amount of user presses, simulating stone flaking away. For performance reasons, the original model was compressed to roughly 200,000 faces, with normal maps restoring surface detail.

3. Second Experiment: “The Man in the Stone,” an Exhibition-Catalog Experience

1. Core Concept: Act-by-Act Reading and Timeline Comparison

The second AI tool took a completely different direction. It adopted the reading experience of an exhibition catalog, set against a light beige paper background, and divided the entire discovery process into four acts: quarrying, rough carving, refined carving, and polishing. Each act displays the corresponding 3D model state, and dragging a timeline slider lets users watch the square rough block shrink, layer by layer, into an elegant human figure.

This approach is closer to the logic of traditional museum digital collection displays, emphasizing “process visualization” over “hands-on operation.” It suits users who want a quick overview without complex interactions interrupting their reading rhythm.

2. Asset Handling and Comparative Advantages

Both versions used the same real 3D scan data of David. The difference is that the first emphasizes local interaction, while the second emphasizes the visual impact of the overall transformation. The comparison reveals a pattern: the value of an AI-generated website comes not from a single technical capability, but from different interpretive perspectives applied to the same material.

In actual testing, “Remaining Form” performed better on dwell time and social sharing intent, while “The Man in the Stone” had the edge in information delivery efficiency and mobile adaptation.

4. Extension: Generating Promotional Videos with AI

After the websites were finished, I went further and asked each AI tool to generate a 9:16 vertical promotional video aimed at a general audience. The prompt required the assistant to “decide how this story best suits video expression, target ordinary viewers, help them grasp the essence of the site, and spark interest in learning more about the statue,” while also delivering a playable MP4 file, an editable project file, and an asset source list.

This stage tests a model’s grasp of cross-media narrative language—how to translate a website’s “interactive experience” into a video’s “visual rhythm,” for example by using camera movement to simulate click actions, or cut speed to convey the force of carving. After reviewing the finished videos, I still had to manually fix obvious transition glitches and subtitle misalignment, which shows that fully automated video delivery remains some distance away.

5. Practical Findings and Efficiency Optimization Strategies

1. Balancing Model Capability and Cost

In this project, I tested two different model configurations. The newer high-performance model stood out in creative depth and narrative planning, but had clear speed and cost bottlenecks: a single generation took considerable time, and if the conversation grew too complex, the process would sometimes break. Resuming from a breakpoint preserved the already-generated work, but repeated interruptions disrupted the creative flow.

2. Hybrid Usage to Reduce Cost

An effective strategy for this problem is mixing models with different positioning—use a strong reasoning model for stages that require deep reasoning and creative ideation, and switch to a lighter model for quickly filling in code, polishing details, or executing repetitive edits. In testing, the lightweight model was able to take over an existing project folder, automatically understand the context from the directory structure, and finish the remaining website work in 6 minutes, plus the video editing in 31 minutes. This division of labor—creativity with the expensive model, execution with the fast model—effectively controlled overall cost.

3. Interrupt Recovery and Engineering Discipline

To keep a project seamlessly resumable, I recommend requiring, in the initial prompt, that the model split the work into independent modules with reading instructions. When an interruption occurs, a new model can quickly understand the current progress by reading the project structure files. This mirrors the engineering emphasis on modularity and documentation, which applies just as well in AI collaboration scenarios.

6. Summary and Outlook

This practice shows that current AI generation tools are already capable of building, from scratch, a website with 3D rendering, complex interaction, and complete narrative. The core bottleneck is not technical implementation, but how to translate artistic understanding into program logic. When a model can propose a narrative gem like “marble has no undo key” on its own, we have clearly crossed the threshold between “tool” and “collaborator.”

For developers and creators, I recommend three strategies for more stable output: first, explicitly define deliverables as runnable finished products; second, separate the creative stage from the execution stage and choose different models for each; third, maintain engineering discipline so the project can recover quickly after an interruption. As model capabilities keep spreading downward and inference costs continue to fall, individual creators will have unprecedented digital storytelling tools—and that is exactly the most worthwhile direction to explore right now.