ai21.net
语言

No plugins, no app, just a single HTML file running Three.…

演示视频

No plugins, no app, just a single HTML file running Three.… — 1

提示词

No plugins, no app, just a single HTML file running Three.js on WebGPU.

It's an interactive 3D house that builds itself in five stages: Foundation → Skeleton → Systems → Envelope → Finished. Every part has its own window on the timeline, so you can scrub through the construction like a video.

What's inside:
→ X-ray mode that makes the structure transparent and shows the water, power, sewage and airflow routes, with filters for each system
→ Explode, to pull the layers apart
→ Cut, a section plane that slices through the building
→ Dusk, a lighting switch to see it at night
→ Instanced vegetation, so a dozen olive trees cost almost nothing to render
→ Callouts and preset cameras for each stage

The subject is a traditional hillside villa, but the format works for any building. A developer could show a buyer exactly what's behind the walls before a single wall exists.

中文译文

没有插件,没有应用,只有一个在 WebGPU 上运行 Three.js 的单一 HTML 文件。

它是一座可交互的 3D 房屋,分五个阶段自行搭建:Foundation → Skeleton → Systems → Envelope → Finished。每个部件在时间轴上都有自己的窗口,因此你可以像拖视频进度条一样浏览整个建造过程。

里面包含:
→ X-ray 模式,让结构变透明,并显示水、电、污水和气流路线,每个系统都有筛选器
→ Explode,把各层拉开
→ Cut,一个剖切平面,切开整栋建筑
→ Dusk,一个光照开关,用来看它在夜晚的样子
→ 实例化植被,因此十几棵橄榄树渲染起来几乎不花什么开销
→ 每个阶段的标注和预设相机

主体是一栋传统的山坡别墅,但这种形式适用于任何建筑。开发商可以在哪怕一面墙都还不存在的时候,就向买家展示墙后究竟是什么。

溯源

原作者
MrKindey
发布日期
2026-10-07(由推文 ID 反解)
原始出处
查看原帖 ↗
收录来源
yihui-dev/awesome-opus5-5-videos · mrkindey-267498 · MIT