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
羽毛球分组比赛记分
小程序二维码

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

小夜