物探 Lab 是一个初中物理互动仿真实验台:把课本上声学、光学、热学、力学、电学、电磁学六大门类、共 30 个经典实验,变成可以亲手调节参数、通断开关、读取仪表的动态仿真。每一个现象背后都由物理公式实时计算,打开浏览器就能用,不用安装、不用登录,老师发一个链接,课堂投影或学生自己点开就能做实验。
缘起:当年那些 “只在课本上见过” 的实验
还记得中学第一次上物理课,老师在讲台上讲光的折射、讲欧姆定律,很多知识对我来说一直停留在概念和插图层面,因为器材有限,不是每个实验都能亲手做,更多时候是 “记住结论”。
今年教师节,看到这次 Vibe Coding 挑战,我就想:老师在讲台上把一个抽象概念讲过成百上千遍,如果能有一个小工具,让学生自己拖一拖滑块、拨一下开关、看着仪表数字实时变化,把 “背公式” 变成 “看见原理”,是不是也能帮老师省下反复讲解的几分钟?于是有了物探 Lab。
成果展示
首页只放六大门类,点进去才是具体实验,刻意做得很克制:不堆颜色、不抢注意力,让学生专注在实验本身。
进入任意一个实验,左边是仿真画布,右边是操作面板和实时数据 / 公式 / 原理三件套。以欧姆定律为例:拨上开关、拖动电压和电阻,电流表、电压表和功率会按 I=U/R、P=UI 实时变化;光的色散里转动入射角,能看到白光被三棱镜拆成七色光谱。
体验方式
- GitHub 仓库:https://github.com/shangtianqiang/wutan-lab
- 在线体验(GitHub Pages):https://shangtianqiang.github.io/wutan-lab/
纯前端实现,手机、平板、电脑浏览器都能直接打开。
创作分享:一句话想法,是怎么一步步变成作品的
整个过程没有写一行 “从零手写” 的代码,更像是在和 TraeCode 里的 Agent 不断对话、一起把想法磨清楚。
1)一切始于一句很朴素的话
我想做一个物理实验工作台,把课本上的实验,变成可以动手操作的动态仿真,覆盖初中物理声学、光学、热学、力学、电学、电磁学六大门类。像真实实验一样调节参数、通断开关、读取仪表,物理过程由公式实时计算并动态呈现,帮助理解实验现象背后的原理。
2)它没有急着写代码,而是先反问我
这一步挺出乎我意料。它判断 “六大门类全建工程量极大”,给了我几个方案让我选,而不是闷头生成一个我不想要的东西。最后我决定按人教版教材,把 30 个典型实验分门类全部做出来。这种 “先对齐再动手” 的过程,反而很像真实做产品。
3)像老师批改作业一样,逐个核对物理事实
这是我觉得最有意义、也最 “较真” 的部分。给学生用的东西,物理上不能错。第一版生成后我逐个实验去试,果然发现了一些违背事实的地方:天平 “左物右码” 摆反了、光的折射和全反射公式用混了、奥斯特实验里小磁针偏转方向不对、还有比热容单位、响度公式前后矛盾…… 我一个个指出来,和 Agent 反复核对修正。
改到后面甚至给电磁铁、电动机补上了电流方向切换。这件事让我意识到:AI 负责快速搭建,但教育作品的 “正确性把关”,依然需要人来做 , 这恰恰是老师每天在做的事。
4)UI 也是聊出来的
第一版是科技蓝加六个彩色门类,看久了觉得太花,我让它换成黑白简约;Emoji 图标全部换成 SVG;首页加上若隐若现的物理公式。中间还遇到一个挺隐蔽的 bug:首页大标题和漂浮公式重叠、文字像 “糊” 在一起,一层层排查才发现是布局把首屏区域压缩裁切了,修完之后整个页面才清爽。
5)最后部署上线到 GitHub
最后一步我只说了句 “帮我保存到 GitHub 并加上 Pages 预览链接”,它就自动建好了 public 仓库、推到 main、开启了强制 HTTPS 的 GitHub Pages。从想法到能发给别人体验的链接,全程都在对话里完成。
写在最后
以前总觉得 “做一个能给老师用的教学工具” 离自己很远,要会设计、会前端、会部署。这次靠和 TraeCode 一轮轮对话,真的把它做出来了。
它或许不完美,但希望这份小小的作品,能让某个正在为 “凸透镜到底成什么像” 发愁的学生自己拨一下滑块就看懂,也能让某位老师在课堂上多一个顺手的小工具,这就是我今年教师节,想送出的心意。
也欢迎大家点开链接玩玩,提提建议,我会继续把实验补全、打磨好。





