AI生成的课件太丑?两步走,效果翻倍的实操指南

最近帮一位老师做《小马过河》的课件，AI直接生成PPT，效果不尽如人意——配色土气、排版呆板、毫无互动性。

一提到AI生成课件先想到的是AiPPT，但收费限制了我们的使用。至于网上那么多使用AI生成PPT课件的方法，基本上生成的效果也都相差不大，想要特别美观也不好实现。

自从开始用WorkBuddy后发现可以换个思路来解决这个问题……

但当我换成「先做HTML互动课件，再转PPT」的路线后，效果立竿见影。今天就把这套方法拆给你看。

核心思路很简单：HTML课件天然支持互动、动画、多端适配，而且能用代码精细控制每一个细节；PPT适合课堂放映、不依赖网络。两步走，既能享受HTML的创作自由度，又能拿到学校机房能用的PPT文件。

模板固化：大多数AI PPT工具用的是固定模板，配色、字号、版式都是预设的，很难跳出框架。

缺乏互动：PPT本质是静态幻灯片，AI生成的内容再丰富，也只是「能看的图+能读的字」，没有拖拽、投票、语音等真实交互。

学段适配难：小学二年级需要大字号、圆角、明快配色、动物形象——这些细节AI很难一次猜准，往往要反复修改。

选择技能：在WorkBuddy我选用的是AIPPT专家，调用了「互动课件设计师」技能，它能根据教学设计自动生成结构完整的HTML5课件。

输入教学设计：把.docx教学设计文档丢给技能，它会提取知识点、设计问题锚点、规划互动环节。以《小马过河》为例，技能识别出14个生字、8个会写字、分角色朗读、身高对比实验等核心模块。

自动构建：技能会用模板搭建页面结构，接入五件套标准模块（AI学伴、导师卡片、TTS语音讲解、分段提示、知识图谱），再用JavaScript实现真正的互动——点击翻卡片、投票显示理由、词语排序讲故事。

验证交付：用check_baseline.sh校验19项基线，确保无JS报错、移动端不崩、核心互动可用后，双击HTML即可全屏放映。

启动引擎：用slidep-start创建.pptx文件，引擎会读取slides目录下的每个.slide文件并实时编译成.pptx。

同样调用用“AIPPT专家”和“互动课件设计师”技能来完成这个工作，给他提示词：请把这个html互动课件转为PPTX格式的课件。剩下的就交给WorkBuddy自动处理就行了。

。

逐页编写：每页是一个.jsx风格的.slide文件，但不用React——它是受限DSL，直接编译成OOXML。用Box做容器、Text写文字、SVG画插图、Image插入封面图。

踩坑经验：slidep不支持flex简写（如flex: 0 0 60%），要写成flexShrink/flexGrow/flexBasis；不支持calc()，要用固定高度；SVG内不能嵌套React组件。

校验交付：slidep-validate跑全量检查，12页全部通过后，生成.pptx文件可直接在PowerPoint或WPS中放映。

识字闯关：14个生字做成可翻转卡片，点一下显示拼音和组词，计数「已运过河」的麦子袋数，读对14袋触发撒花动画。

身高实验：用SVG画出老牛、小马、松鼠三个动物站在同一条河边，水位线固定，点动物后水位相对变化——直观解释「同一条河说法不同是因为个子不同」。

配音导演：4个角色卡片，点一下用TTS播放示范朗读，通过rate/pitch参数区分老牛（慢低）、松鼠（快高）、小马（犹豫）、老马（亲切）的语气。

四种说法投票：课后题讨论，点同意/不同意后亮出标准分析，配合「身体投票法」降门槛，害羞的孩子也能参与。

小导师学伴：左下角按钮，可以随时在课堂上互动答疑。

教师锦囊：右下角按钮，每页提取教学设计里的「提问话术+冷场处理话术」，专治不举手的班级。

先写一个HTML：哪怕只是3页演示文稿，用它理解互动课件的结构，比直接啃PPT工具上手更快。

复用设计模式：我沉淀了一个fmg-html-ppt skill，记录了这个「HTML→PPT」的工作流，下次遇到类似需求可以直接调用。

我已经把这个skill做成了可以能过一句话、教材截图、或方案（教学设计）一键生成交互效果的html课件和PPT课件，并生成这两种格式的文件。

迭代而非一次性：先出V1，再用反馈打磨——字体大小、配色深浅、互动形式，都可以在HTML阶段快速调整，确定了再转PPT。

AI生成课件的痛点，本质上不是技术不够，而是路径选错了。HTML创作+PPT交付，是一条被验证过的路——前者给你设计和互动的自由，后者给你放映和兼容的保证。

这次《小马过河》的尝试，让我看到了AI辅助教学的真正价值：不是替老师做课件，而是帮老师突破自己不熟悉的技术领域（比如前端开发），把精力集中在教学设计本身。

如果你也在做课件，不妨试试这个两步走。有问题欢迎留言，我可以接着拆。