运动博物馆:五个展项的 3D 物理科普

一座可以在浏览器里逛的 3D 科学博物馆,五个展项各锁一类物理现象:玻璃蒸馏器里的多体碰撞、摆之林的连杆与动量、丝绸厅的布料与风、波之厅的空间干涉,以及从桌面浑天仪扩展到天象馆尺度的「三日」。值得看的是它把镜头动线当成策展来做——五个展项就是五个检查点,镜头在其间连续过渡,而不是切场景。

交互体验Katia Gil Guzman收录

  • next.js
  • react
约 2MB,点击后才开始下载

3D 模型由原作者提供并授权使用(已取得作者授权(2026-09-20)),著作权归 Katia Gil Guzman

实现过程

难点不在于渲染单个物理效果,而在于让五种完全不同的模拟(碰撞、连杆、布料、波、引力)住在同一座馆里还显得是一个作品。作者的解法是先用 Blender 把整座馆的几何按可复跑的脚本生成,让尺度与材质从一开始就统一,再给每个展项配一种现象、一个镜头检查点。

  1. 建五个交互展项

    操作
    作者给 AI 的指令原文
    Build a polished interactive science museum with five exhibits.
    The concept
    Create a beautiful museum that visitors move through in 3D. The museum and its sculptural exhibits must be authored in Blender, with editable .blend sources and a reproducible asset-generation script, then exported for the interactive web experience. Do not put a live model in the visitor experience: all five exhibits are authored in advance, and visitors play with their fixed interactions. No prompt field, chat interface, or runtime content generation.
    This should feel like entering a small, extraordinary science museum: architectural daylight, pale mineral walls, a dark reflective floor used sparingly, brass details, translucent glass, carefully composed shadows, and restrained accents of color. Make the objects, lighting, motion, and camera choreography the attraction. Each installation should have a different silhouette and occupy the space differently; some sit on pedestals and others surround the visitor. Avoid turning this into a scrolling landing page or a grid of cards.
    The journey
    Build one coherent 3D environment with exactly five checkpoints. Start inside the museum with the first exhibit visible and a clear “Begin” action. Previous/Next and a compact 1–5 progress control move the camera smoothly between checkpoints; there is no vertical page scroll. At a checkpoint, offer a well-framed close inspection view with bounded orbit controls and a clear way back. Use short exhibit titles, one sentence inviting the interaction, and only the controls needed for that exhibit. Provide touch-friendly controls, keyboard navigation, a visible Reset, and reduced-motion camera transitions. Give each interaction an obvious, satisfying visual response within a few seconds. The whole guided visit should work as a roughly 2–3 minute demo, with room to linger and experiment.
    Implement these five distinct exhibits:
    1. The Glass Alembic — many-body collisions.
    A tall, intricate glass apparatus on a stone-and-brass pedestal: a bulbous upper reservoir, a visible gate, a wide funnel, a helical chute, a split path, and collecting vessels. Clicking “Release the pearls” sends hundreds of luminous pearlescent spheres through it. They collide, bounce, bunch up at a narrow throat, spill around curves, and form a convincing pile in the vessels. A single fixed gate toggle changes which path the next pearls take. Offer slow motion and reset. This is the hero exhibit: transparent material, readable depth, precise geometry, and tactile collision behavior must look excellent. Build the visible shell and colliders together so beads actually travel through the apparatus and do not clip through it. Use instancing and a particle/body count that the measured performance can sustain. Decorative highlights must not obscure the physics.
    2. The Pendulum Grove — linked mechanisms and momentum.
    A room-height kinetic sculpture made of suspended brass arms, counterweights, joints, and differently sized pendulums, arranged like a branching mechanical tree. A visitor pulls and releases one clearly marked handle with bounded drag, or presses a fixed “Set in motion” button. Motion travels through the articulated structure: arms trade momentum, weights swing out of phase, and the whole sculpture resolves into a shifting spatial pattern. A second authored release preset creates a visibly different rhythm. Brief fading trails can reveal the paths without cluttering the scene. Use actual constrained rigid-body dynamics with damping and joint limits; make the cause and effect legible, with a stable reset pose. This installation should feel like a delicate moving sculpture, not another marble track.
    3. The Silk Chamber — cloth, wind, and contact.
    Enter a small pavilion containing a flowing silk canopy and long fabric ribbons around a smooth, sculptural torus or similarly distinctive Blender-authored form. Visitors choose among three authored wind states: Still, Breeze, and Gust. Fabric should billow, wrinkle, drape, and react to contact with the central form. The Gust action creates a dramatic sweep that briefly reveals the form before the cloth settles back. Use a bounded real-time cloth simulation with explicit distance/bending constraints and collision handling at an appropriate resolution. Choose anchor points and collider geometry that make stable, visibly convincing behavior achievable. Do not substitute a looping sine-wave shader and call it cloth physics. Favor readable folds, backlighting, and rich fabric material over excessive mesh density.
    4. The Wave Chamber — interference in a spatial field.
    Move to the edge of a broad circular shallow basin beneath an architectural dome. Its surface is a luminous, translucent membrane or stylized water, with a sculptural obstacle in the basin. Two fixed source points can be tapped individually or together. Visitors can select an authored in-phase or opposing-phase preset and watch expanding waves meet, interfere, reflect at boundaries, and form changing standing-wave patterns. The camera can lower toward the surface so peaks and troughs feel spatial, then return overhead to reveal the pattern. Implement a stable numerical wave-field simulation with damping and sensible boundaries. Let the field itself drive surface displacement and restrained lighting effects. Describe it accurately as a wave simulation; do not imply a complete fluid solver.
    5. Three Suns — orbital motion and an immersive finale.
    The final installation begins as a floating miniature orrery. Pressing “Step inside” moves the visitor into a planetarium-scale view of the same system, surrounded by the trails of three luminous masses. Provide two curated starting conditions: a carefully validated stable choreography and a small perturbation of that initial condition that produces a visibly different trajectory. Let visitors replay and slow time to inspect how paths diverge. Use numerical gravitational integration with bounded simulation duration, a controlled time step, appropriate handling of near encounters, and honest scaling. Keep bright bodies distinct from their trails; use trails as geometry in space rather than a flat overlay. If a proposed stable preset is not numerically reliable, choose a well-supported preset and validate it before shipping. Finish with a quiet view back across the museum and a “Visit again” action.
    生成物
    建五个交互展项

    一个 prompt 就把馆体、五个展项、动线与交互全部要了,后面五步全是在这个骨架上迭代。两处值得留意:它明确要求「不要在访客体验里放实时模型」——五个展项都事先在 Blender 里作好,访客玩的是固定交互;以及每个展项都写清了「不许用什么冒充什么」(不许拿正弦波 shader 冒充布料、不许暗示做了完整流体求解)。

  2. 加行走与鼠标视角

    操作
    作者给 AI 的指令原文
    Add first-person movement with mouse look and arrow-key walking.
    生成物
    加行走与鼠标视角

    第一版是相机在五个检查点之间飞,这一步把它变成「人在馆里走」。一句话的指令,改的是整个体验的身体感——从看幻灯片变成逛博物馆。

  3. 把展项排进开放的房间

    操作
    作者给 AI 的指令原文
    Arrange the exhibits in an open room with clearer walking paths.
    生成物

    能走了之后,动线问题就暴露出来。这一步的生成物在 3D 里最直观:正俯视一看,五个展台怎么围着走廊布置、彼此留了多少空,一目了然。

  4. 点击展项推近查看

    操作
    作者给 AI 的指令原文
    Move closer to an exhibit with a click and enrich the room.
    生成物
    点击展项推近查看

    「推近」不是缩放,是相机飞到展项前的一个精心框好的机位。我们抓图时量过:切换展项后相机要飞约 8 秒才停——这段过渡本身就是作品的一部分。

  5. 在检视视角再点一次启动

    操作
    作者给 AI 的指令原文
    Start an exhibit by clicking it again from the inspection view.
    生成物
    在检视视角再点一次启动

    推近与启动拆成两次点击:第一次只是看,第二次才让它动。观众先看清楚静态结构,再看它怎么运动——这是科普展项和游戏特效的分别。

  6. 改善材质与光照

    操作
    作者给 AI 的指令原文
    Give the sculptures richer surfaces and more deliberate lighting.
    生成物
    改善材质与光照

    最后一步只动材质与光。导出的 glb 里零纹理、全靠 PBR 参数与 KHR_materials_transmission 的玻璃透射——玻璃蒸馏器就是这一步的代表作,3D 里飞过去看它对光的折射。

据以下公开资料整理,核对于 。 指令原文引自作者公开的构建记录;编辑部注与其中的判断由昆仑编辑部撰写,不代表原作者观点。

本页是昆仑编辑部撰写的导读,不包含作品内容。作品著作权归 Katia Gil Guzman 所有,请前往原地址体验。 缩略图由本站截取。