一、先看成品:一座正在运转的幼儿园

先放结果。打开 晴芽幼儿园,你会看到一个阳光里的微缩园区:两层通透主楼、环形跑道、足球场、滑梯、双人秋千、跷跷板、沙坑和阅读角——全部在浏览器里实时渲染,不是视频,不是静态图。

晴芽幼儿园全景(桌面端实时截图)
▲ 晴芽幼儿园全景:拖动可旋转视角,截图停在这一刻,场景里的活动还在继续
24 位小朋友 3 位老师 5 个活动分区 ≈60 FPS 实时渲染 0 外部模型文件

跑道上有人追逐,足球在场地里滚动,秋千来回摆,老师陪着孩子散步。点击「教室」,镜头会平滑推进主楼,透过玻璃看到桌椅和课堂活动:

教室视角
▲ 教室视角:透过立面看楼内空间
游乐区视角
▲ 游乐区:滑梯、秋千、跷跷板各有活动

整个场景由 Three.js + WebGL 纯代码生成——没有外部角色模型,没有预渲染。网页上线后由浏览器渲染,游览时不需要持续调用大模型,跑一次构建就永久可玩。手机上也能打开:

手机端效果
▲ 窄屏视口下的自适应布局

二、为什么这次能成:关键不在「写代码」

OpenAI 把 GPT-6 Astra 定位为面向高难度端到端工作的模型,支持跨代码、浏览器和专业软件执行多步骤工作,还能在工作中追加指令。这次实战验证了其中最有价值的一条:

它会把「实现 → 检查 → 发现问题 → 修复 → 再验证」这一整段工作自己做完。

第一版交付前,它自行发现并修复了这些问题(我在提示词里只写了「运行检查」,没有逐条指出):

  • 入口墙体遮挡视线;
  • 滑梯回程高度不合适,孩子会「飘」;
  • 平台屋顶碰到人物头部;
  • 手机窄屏下全景被裁切;
  • 首帧时间差引发的偶发动画报错。

它通过运行网页、查看截图、执行交互检查发现异常,再调整代码、重新验证。这就是「端到端」和普通代码生成的差别:不只是产出代码,而是交付一个被检查过的东西

三、搭建四步:从文字需求到上线

把整个过程拆开看,其实是清晰的四步。你复刻任何场景,都走同一条路:

  1. 把文字需求拆成空间。楼放哪里、跑道占多大、设施之间留多少位置,都要落到坐标、尺寸和镜头构图上。想复用现有站点风格的(比如本站的米白、浅绿、圆角),也在这一步说清楚。
  2. 把动作接到具体设施上。秋千上的孩子要跟着座椅摆动,滑梯上的孩子沿滑道下滑再返回,跑步路线要绕开主要设施——人物、道具、场地三方配合,这是工作量最密集的一步。
  3. 打开浏览器自查。在提示词里明确要求「运行检查、看截图、做交互测试」,让模型自己走完「发现→修复→再验证」的循环,而不是你逐条替它找 bug。
  4. 发布出去。确认版本后推送仓库、部署服务器、从公网打开验证。纯前端场景没有后端依赖,挂到任意静态托管就能跑。
本次实测:本地 Chrome / Edge 约 59–60 FPS,线上约 56 FPS。人物标签、分区镜头、自动漫游循环均通过检查,线上无页面报错。

四、完整原始提示词(可直接复制)

这是本次使用的完整原始提示词,保留原文,没有压缩。你可以整段复制交给 AI,也可以按下一节的公式替换成你自己的场景:

kindergarten-prompt.md
# 晴芽幼儿园 · 完整原始提示词
基于Three.js+WebGL开发可在现代浏览器直接运行的实时3D动态幼儿园网页Demo,为可交互实时渲染Web3D场景,非静态图与预渲染视频,整体采用高质量低多边形卡通微缩画风,造型圆润柔和、光照明亮自然、阴影柔和、材质干净清新,贴合儿童动画质感,无写实风格与廉价Demo质感,打造真实运转的迷你童趣幼儿园场景。场景包含2-3层带彩色装饰与中英文标识的幼儿园主楼,大面积玻璃窗可展示室内桌椅与课堂活动,户外搭建精致微缩园区,涵盖草坪、塑胶操场、环形跑道、小型足球场、滑梯、秋千、跷跷板、沙坑、花草树木、长椅、围栏与校门,整体布局紧凑,单视角可预览大部分园区。场景内置15至25名卡通儿童及2至4名卡通老师,全员配备待机、行走、奔跑、静坐、玩耍、挥手、交谈、跳跃等基础动画,人物动作时间错开、互不重复,随机实现荡秋千、滑滑梯、踢球、沙坑玩耍、追逐跑动、草坪闲聊、师生散步、室内学习、举手答题、绘画阅读等多样动态行为。场景搭载自然舒缓的全局环境动画,包含草木随风摆动、云朵缓慢平移、秋千跷跷板自主运动、风车旋转、足球微动、小鸟间歇飞过、室内人物小幅活动,动态细腻不杂乱。镜头默认采用四分之三俯视等距视角,支持鼠标拖拽旋转、滚轮缩放,可点击操场、游乐区、教室、阅读区、午休区实现镜头平滑过渡聚焦,新增自动漫游功能,可按全景、操场、游乐区、教室、阅读区的路径自动循环巡航。交互上支持人物悬停与点击展示户外活动、绘画阅读、体育活动等无隐私信息标签,点击单个小朋友可让镜头平滑拉近观察,支持返回全景。项目纯前端实现,兼容Chrome、Edge浏览器,支持屏幕自适应,通过轻量化建模、实例化渲染、LOD层级优化、合理阴影配置与RAF动画机制保障流畅帧率,自带加载动画与平滑入场效果,全程规避穿模、人物漂浮、动作同步僵硬、镜头穿墙等问题,优先完成高视觉质量MVP,重点优化场景质感、园区布局、人物动态、镜头交互、环境动画与性能适配,呈现阳光清新、全程动态鲜活的真实幼儿园微缩场景效果。

注意到它的结构了吗?看似一大段,其实是六个模块拼起来的。下一节拆开。

五、提示词公式:6 个模块,换掉就能复用

这段提示词之所以一次成型,是因为每个模块都回答了 AI 必须知道的问题。写你自己的场景时,按这张表逐格填:

模块回答的问题原文示例
① 技术定调用什么做、不是什么「Three.js+WebGL…非静态图与预渲染视频」
② 画风氛围看起来什么感觉「低多边形卡通微缩画风…无写实风格与廉价Demo质感」
③ 空间清单场景里有什么、怎么布局「主楼+跑道+足球场+滑梯…布局紧凑,单视角预览大部分园区」
④ 角色与行为谁在里面、各干什么「15-25名儿童+2-4名老师…动作时间错开、互不重复」
⑤ 镜头与交互怎么看、怎么玩「3/4俯视等距视角…分区聚焦+自动漫游+点击拉近」
⑥ 性能与验收做到什么程度算完「实例化渲染+LOD+RAF…规避穿模、漂浮、动作僵硬」

三个最容易被忽略、但决定成败的细节:

  • 「动作时间错开、互不重复」——不写这句,所有角色会像排练过一样整齐划一,瞬间露馅;
  • 「单视角可预览大部分园区」——约束布局紧凑度,第一眼的构图就靠它;
  • 「规避穿模、人物漂浮、镜头穿墙」——把验收标准写进需求,AI 自查时才有靶子。
一句话公式:技术定调 + 画风氛围 + 空间清单 + 角色行为 + 镜头交互 + 验收标准。六个格子都填满,剩下的交给模型。

六、灵感库:把幼儿园换成你的世界

幼儿园只是一个起点。空间清单和角色行为两块一换,就是完全不同的世界。给你六个现成方向,每张卡片里的「替换核心句」可以直接嵌进提示词公式:

📚 深夜书店

暖黄灯光、木质书架、咖啡香。安静向场景,靠氛围动画取胜。

替换核心句:场景包含两层挑高书店,落地窗外是雨夜街道,店内书架、阅读卡座、咖啡吧台与旋转楼梯;8-12名读者或翻书、或小憩、或临窗办公,1-2名店员整理书架与递送咖啡;雨丝沿玻璃滑落,暖光台灯呼吸式明暗,风铃随门开合轻响。

🌾 山间小农场

农田、牲畜、四季感。适合做成「一天的时间流逝」。

替换核心句:场景包含梯田农田、谷仓、鸡舍、小牛犊围栏与稻草人,一条土路蜿蜒至山脚;3-5名农夫播种、挑水、喂鸡、驱赶麻雀,鸡群啄食、小狗绕场跑动;麦田随风起伏如波浪,炊烟从农舍升起,光影随时间从清晨暖橙过渡到正午明亮。

🏫 记忆里的校园

教室、黑板报、下课铃。情绪价值最高的方向。

替换核心句:场景包含老式教学楼、水泥操场、双杠、公告栏与小卖部,操场边有高大梧桐;20余名穿校服的学生做课间操、追逐、趴栏杆聊天、在小卖部前排队,2-3名老师抱作业本走过走廊;梧桐叶飘落,广播体操音乐节拍带动群体动作错拍起伏。

☕ 街角咖啡馆

小而美的入门练手场景,空间小、角色少、容易出质感。

替换核心句:场景包含转角咖啡馆,户外遮阳伞座位、室内吧台与黑胶唱机角落,门口有黑板菜单与绿植;4-6名客人交谈、敲笔记本、逗猫,1名咖啡师拉花与出品;蒸汽从咖啡杯升起,店猫在窗台翻身,街灯随天色渐暗逐个亮起。

🚀 轨道空间站

硬核方向:失重漂浮、机械臂、舷窗外的地球。镜头语言完全不同。

替换核心句:场景包含环形空间站主体、对接舱、太阳能翼与观测穹顶,舷窗外可见缓慢转动的地球;4-6名宇航员漂浮移动、检修设备、在穹顶观测记录,1台机器人沿轨道滑行巡检;舱内指示灯呼吸闪烁,机械臂缓慢转动,地球云层实时流转。

🏮 古镇夜市

灯笼、摊位、人流。动态密度最高的场景,性能优化的最佳练兵场。

替换核心句:场景包含青石板主街、木质骑楼、夜市摊位群与小桥流水,屋檐下挂满红灯笼;15-20名游客驻足摊前、拍照、沿河散步,3-4名摊主翻炒、叫卖、打包;灯笼随风轻摆,河面倒映暖光摇曳,糖炒栗子的白雾从摊位升起。

选场景的建议:第一次做,选空间小、角色少的(咖啡馆 > 农场 > 夜市)。空间清单越短,第一版成功率越高;跑通后再加密度。

七、说清楚边界,再去动手

晴芽是一份可交互的程序化 3D MVP:人物按预设路径和关节动画活动,没有完整物理系统,也没有让每个孩子独立思考的 AI。单个案例不能证明模型在所有任务里都能稳定交付,更不能承诺「一句话做出任何产品」。

但它证明了一件具体的事:以前容易停留在脑海里的互动想法,现在有了可以打开、试玩、继续修改的版本。

我的协作体会,三条:

  1. 把「想看到什么、先做好什么、最后怎么验收」讲清楚,协作效率翻倍;
  2. 验收标准写进提示词(穿模、漂浮、帧率、窄屏),模型的自查才有方向;
  3. 模型负责推进实现,你负责决定方向——以及判断这个结果是否值得留下。
→ 先去小世界里逛一圈:晴芽幼儿园

本文是「GPT-6 Astra 做了一座 3D 幼儿园」实录的指引篇。想看那次搭建的完整过程与能力分析,可在公众号「小易AI实践」查看原文。

WECHAT OFFICIAL ACCOUNT

小易AI实践
持续更新:一个人 + AI 能做出什么

小易AI实践公众号二维码