各位老师们大家好，我是来自苏州电信智云中心 AI 团队的 TeleAgent 技术支撑小南。
老师备课时，有一件事很常见：教案已经有了，课堂怎么讲也基本想清楚了，但真正做到课件这一步，还是要重新拆页、排版、画图、设置动画，再把每一页的出现顺序调一遍。
这类课件看起来像 PPT，但本质上是一个网页文件。它可以做逐步出现、图形变化、点击揭晓答案、进度提示等效果。而且如果做成单文件，复制到教室电脑上就能打开，不需要重新安装一套课件软件。
本课流程已经做成“HTML动画课件生成助手”Skill，老师们可直接在 TeleAgent 技能广场搜索下载使用。
一、先准备老师本来就有的材料
这次演示用的是一节苏州某小学三年级数学课《认识几分之一》，按一节40分钟课堂设计。
为了避免把演示做成“AI专用材料”，我们只准备一份普通备课材料，里面有教学目标、重点难点、例题、练习和老师自己的课堂备注。
不需要为了 AI 再整理一份逐页脚本，也不需要先把动画怎么做写清楚。真正希望交给 Agent 的，恰恰就是“从一节课变成一套课件”的这部分机械工作。
二、先让 AI 规划课件，不要一上来就写代码
把备课材料上传给 TeleAgent 后，先输入：
请阅读我上传的备课材料。先不要生成 HTML。 请先把这节课整理成一套适合课堂放映的课件结构，明确每一屏的教学目的、核心内容、教师操作和适合使用的动画或交互。 要求： 1. 保持原备课材料中的知识点和教学顺序； 2. 动画必须服务于理解，不为了好看而堆效果； 3. 一屏只承担一个主要教学任务； 4. 需要学生思考的问题，不要提前显示答案； 5. 原材料没有的信息不要自行补成教材事实； 6. 先输出课件结构，等我确认后再生成文件。
先看结构很重要。因为课件真正容易出问题的地方，通常不是颜色不好看，而是这一页该不该出现、答案是不是提前露出来、动画有没有把知识关系讲清楚。
三、结构确认后，再生成一个完整 HTML 文件
结构没有问题以后继续输入：
请根据刚才确认的课件结构，生成一个完整、可直接打开的 HTML 动画课件。 要求采用16:9课堂放映比例。 视觉效果简洁、现代、适合教室大屏，保持统一色板、清晰的大字号和充足留白，不使用与教学无关的花哨转场。 所有核心样式和脚本尽量放在同一个 HTML 文件中，不依赖必须联网才能加载的外部资源。 课件需要支持上一页、下一页、键盘方向键切换、当前页进度提示。 需要逐步讲解的内容采用点击或按键后再出现。 数学图形和分数演示优先使用 HTML、CSS 或内嵌 SVG 实现。 请生成实际 .html 文件，不要只在对话中展示代码。 生成后再检查一次页面切换、按钮、动画和文字是否完整。
这一步最适合录屏。老师会直接看到，原来的一份备课材料，最后变成一个真正可以播放的课件文件。
四、打开浏览器，重点检查四件事
第一看知识有没有讲错，尤其是“平均分”“几分之一”“同一个整体”等关键表述。
第二看动画顺序。比如先出现完整图形，再等分，再突出其中一份，最后才出现“1/2”，不能一开始把答案全部摆出来。
第三看课堂操作。方向键、点击揭晓、上一页和下一页都要实际试一遍。
第四看教室环境。把网络断开以后再打开一次，确认核心内容仍然能正常显示。
五、不会改代码，也可以继续让 AI 改
HTML 课件一个很实用的地方，是老师不用自己找代码位置。哪里不合适，直接描述课堂需求即可。
例如：
请修改刚才生成的 HTML 课件，不要重做整套内容。 把“判断是否平均分”这一页提前到认识1/2之后。 把答案改成点击后出现。 减少无关的转场动画。 保留原来的整体视觉风格和键盘控制。 修改完成后生成新的 HTML 文件，并检查其他页面是否受到影响。
这样修改的是课堂需求，不是代码。
六、最后一道关，还是老师自己看
HTML 做得再漂亮，也不代表它可以不检查就进课堂。
老师至少要确认三件事：知识内容没有错误，节奏符合自己的学生，所有需要点击和切换的地方都实际操作过。
TeleAgent 这次能够稳定完成“读取备课材料—规划课件—生成 HTML—按反馈修改—重新检查”这套流程，所以我们把它做成“HTML动画课件生成助手”Skill，老师们可直接在 TeleAgent 技能广场搜索下载使用。
以后换语文、数学、科学，老师只需要上传新的原始材料，不必每次重新解释页面比例、动画原则、键盘控制和离线要求。
今天真正省下来的，不是“写一段网页代码”的时间，而是从一节已经备好的课，重新拆成十几页课件，再逐页排版、设置出现顺序和反复修改的时间。
课怎么教仍然由老师决定，AI 负责把已经明确的教学设计变成一个可播放、可修改的课堂工具。