ai互动教材:把知识点做成带 3D 动画的 HTML 互动课件

前言

备课时常见做法是 PPT 加口播,或录一段固定流程的视频。学生只能被动看,抽象概念(例如分子结构、力学过程)在平面页面上也不好建立空间感。若希望交付物是可在浏览器里打开、能点能拖、必要时带简单测验的单页 HTML,通常要自己写 Three.js、调交互和版式,成本不低。

下面介绍 SkillHub 社区 Skill「ai互动教材」(坐标 @user_db77c98e/aibook,当前版本 v1.5.2)。它在对话里按技能说明组织生成流程,把知识点转成带 3D 动画的 HTML 互动教材,覆盖基础互动课件、3D 视觉隐喻动画、随堂测验和完整微课等形态。标签标明 requires_api_key=false,不依赖额外 API Key。

这是什么

ai互动教材是 SkillHub 上的 education 类社区 Skill,发布者为 user_db77c98e,来源为 community。官方入口:

  • SkillHub 页面:https://www.skillhub.cn/skills/user_db77c98e/aibook
  • API 资源地址:https://api.skillhub.cn/user_db77c98e/aibook

它解决的是「用自然语言描述教学目标,由 Agent 按 Skill 规范产出可本地打开的 HTML 互动教材」,而不是替代专业课件平台或实验仿真系统。

核心功能

以下能力均来自官方简介,未在资料中出现的细节不展开:

  1. 基础互动课件:知识点以可操作的 HTML 页面呈现,适合课堂演示或学生自学打开。
  2. 3D 视觉隐喻教学动画:用三维场景辅助理解抽象概念(官方表述为「视觉隐喻」类 3D 教学动画)。
  3. 随堂测验:可在同一套 HTML 教材里嵌入测验环节。
  4. 完整微课:支持按「一节微课」粒度组织内容,而不只是单页示意图。

触发词(在已安装 Skill 的 Agent 里可直接使用):生成课件、互动教材、3D课件、微课、教学动画、帮我做一个课件、做一节微课、HTML课件、3D lesson、educational animation。

适用学段与场景:K12、高等教育、职业教育、科普向内容。

明确不适用(官方注意项):本专业深度内容、实验原始数据、实时数据、保密内容——这些不应交给该 Skill 自动生成。

安装与启用

SkillHub 页面给出的安装指引是:让 Agent 按 SkillHub 安装文档 安装 @user_db77c98e/aibook。下面是与文档一致的可复现步骤。

1. 检查或安装 SkillHub CLI

先确认本机是否已有 skillhub:

command -v skillhub && skillhub --version

若未安装,可使用官方安装脚本(完整安装含 CLI 与默认 Skill):

curl -fsSL https://skillhub-1388575217.cos.ap-guangzhou.myqcloud.com/install/install.sh | bash

仅需 CLI 时:

curl -fsSL https://skillhub-1388575217.cos.ap-guangzhou.myqcloud.com/install/install.sh | bash -s -- --cli-only

2. 安装到当前 Agent 的 skills 目录

安装技能时必须用 --dir 指向当前 Agent 实际读取的 skills 目录;默认装到 ./skills/ 可能不会被识别。官方文档列出的常见路径如下:

Agent / 客户端 skills 目录
Cursor ~/.cursor/skills/
Claude Code ~/.claude/skills/
Codex ~/.codex/skills/ 或项目下 .agents/skills/
Windsurf ~/.codeium/windsurf/skills/ 或 .windsurf/skills/

在 Cursor 中示例:

skillhub install @user_db77c98e/aibook --dir ~/.cursor/skills/

也可用搜索再安装(将 abc 换成关键词):

skillhub search aibook
skillhub install @user_db77c98e/aibook --dir ~/.cursor/skills/

安装后按你所用客户端要求重启或重新加载 Agent,使 Skill 生效。页面未单独区分 Cursor、Codex CLI、Claude Code 的安装包差异,差异主要体现在 --dir 目标路径。

典型用法

官方未提供固定命令行子工具;用法是在已启用 Skill 的对话里用触发词说明需求。可按「目标受众 → 知识点 → 产出形态」组织提示,例如:

  1. 说明学段与主题(如高中物理「平抛运动」、职教「安全用电」科普)。
  2. 写明希望形态:基础互动页、带 3D 隐喻动画、是否要随堂测验、是否按一节微课结构(导入—讲解—练习)。
  3. 使用触发词之一,如:「帮我做一个课件」「做一节微课」「生成互动教材」。

Agent 会按 Skill 内规范生成 HTML 等交付物;具体文件结构与交互细节以安装后的 SKILL.md 为准。生成后应在浏览器中本地打开检查动画与测验逻辑是否符合课堂要求,再决定是否用于教学。

适用场景与注意

适合谁

  • 教师、教研人员、科普作者:需要快速产出可演示、可分享的 HTML 互动页,而非长期维护的大型 LMS 课程包。
  • 在 Cursor、Claude Code 等已支持 Skills 的环境里备课的开发者或助教。

使用注意

  • 勿用于含保密信息、实时监测数据或本专业实验原始数据的场景(官方明确排除)。
  • 社区来源(community),版本随 SkillHub 更新;当前页面显示为 v1.5.2,安装前可在 SkillHub 核对评分与下载量(页面数据会变动,以站点为准)。
  • 3D 与互动效果依赖生成结果与本地浏览器能力;正式上课前建议试讲并备份离线副本。

结尾

ai互动教材把「知识点 → 带 3D 与测验的 HTML 互动教材」收敛到一条对话工作流,适合 K12、高教、职教与科普场景的快速课件原型。安装坐标为 @user_db77c98e/aibook,遵循 SkillHub 安装文档 即可。

  • SkillHub:https://www.skillhub.cn/skills/user_db77c98e/aibook
  • 资源 API:https://api.skillhub.cn/user_db77c98e/aibook
羽毛球分组比赛记分
小程序二维码

欢迎使用《羽毛球分组比赛记分》微信小程序

Xiaoye