AI Demo Collection

AI 辅助生成的交互式前端 Demo 合集
OPEN SOURCE · MIT 欢迎复用、改进与分享
REACT / THREE.JS / 3D HOME

栖居 HABITAT · 家庭 3D 空间

可环绕探索的 108㎡ 家庭模型,支持自动隐墙、多灯独立控制、家电菜单、日夜光影与生活场景联动。

可交互
THREE.JS / 多能流守恒仿真

H₂ NEXUS · 综合能源数字孪生

电、热、冷、氢与天然气协同的 3D 工业园区,支持设备参数查看、能流粒子、气象与负荷实时调节。

可交互
THREE.JS / CHART.JS

智慧校园 3D 数据大屏

等距视角校园场景 + 数据看板,支持昼夜切换、双相机、悬停提示与循环车流。

可运行
THREE.JS R160 / 完全离线

方寸之间 · 体素工地沙盘

桌面上的微缩建筑工地:挖掘机、渣土车、塔吊昼夜运转,支持暴雨天气与实体旋钮交互。

可运行
THREE.JS R160 / 完全离线

深夜拉面摊 · 体素沙盘

巷口的深夜拉面摊:摩托穿巷送外卖、师傅抻面下锅、竹竿吊运灯笼,雨夜里水洼映着灯火。

可运行
THREE.JS R186 / 模块化微缩沙盘

樱花街角 · 电车与便利店

晴暖春日的日式乡村车站街角:单线电车与站台、落地玻璃里逐件可见的便利店、带玻璃门的贩卖机,三株樱花与持续落樱。拖拽环视、无极缩放,画面零 UI。

可交互
THREE.JS / OPENSTREETMAP / 3D ATLAS

三坊七巷 · 坊巷漫游

基于真实地图的白墙黛瓦古城沙盘:拖拽旋转、滚轮缩放、点击景点飞行,支持搜索、俯瞰、夜景与精选空中漫游。

可交互
BLENDER / 工程动画

双极空气开关精细建模

MCB 断路器程序化建模与 22 秒 8 章节工程动画,Three.js 直接加载 .glb 交互查看。

可交互
BLENDER / THREE.JS / 机械动画

TERRA 728 · 现代四驱拖拉机

1482 个对象的程序化精细建模:差速滚动与 Ackermann 转向、可开机罩与发动机舱、驾驶室门与内饰、后三点悬挂、雨刷与操作台,15 秒六章节机械演示。

可交互