🏠 首页Home · 三条路径The three paths · 路径 3:换成自己的课文Path 3: Put your own text in it
路径 3 · 不必碰程序码 PATH 3 · still no code

✍️ 换成自己的课文

✍️ Put your own text in it

你在 Excel 里写题目,AI 负责把它变成游戏。你从头到尾不需要看懂任何一行程序码 —— 你只要会用 Excel,会复制贴上。

You write the questions in Excel; the AI turns them into the game. You never have to read a line of code — if you can use Excel and copy-paste, you can do this.

1

下载两个档案

Download the two files

按下面两颗钮,存到同一个资料夹里(例如桌面新建一个「我的论证游戏」)。

Click both buttons and save them into the same folder (e.g. a new folder on your desktop).

💡 题库模板里已经填好现有的 20 道题 —— 那既是范例,也是你要覆盖的内容。照着同样的写法改,格式就不会错。

💡 The workbook already contains the current 20 questions — they're both your worked example and the thing you're replacing. Follow the same style and the format stays correct.

2

在 Excel 里换成你的题目

Replace the questions in Excel

四个工作表分别是:

The four sheets:

改的时候记住四件事

Four things to keep in mind

  1. 保持 20 题最省事。要增减题数也可以,AI 会一并调整,但记得在「设定」里改总题数。
  2. 20 questions is the least work. You may change the count — the AI will adjust — but update the total on the Settings sheet.
  3. 三个选项长度尽量接近,学生才不会靠「哪个最长」猜答案。
  4. Keep the three options similar in length, so students can't guess by picking the longest.
  5. 「正确答案」栏只填 A、B 或 C(档案里已设好下拉选单)。
  6. The Answer column takes only A, B or C (a dropdown is already set up).
  7. 答后解释写「为什么」,别只写「答对了」—— 学生答错时就是靠这一句学会的。
  8. Explanations should say why, not just "correct" — that sentence is where a wrong answer turns into learning.
3

把两个档案交给 AI,贴上这段提示语

Give both files to an AI with this prompt

打开 Claude 或 ChatGPT(免费账号就够用),在对话框里上传你改好的 xlsx 和 game.html,然后按下面的「复制」,把整段贴进去送出。

Open Claude or ChatGPT (a free account is enough), attach your edited xlsx and game.html, then press Copy below, paste the whole thing in and send.

我要把一个 HTML5 华文游戏改成我自己的课文。我上传了两个档案:
1. game.html —— 原版游戏,目前可以正常运行
2. question-bank-template.xlsx —— 我填好的新题目

【很重要】请用你的程式执行工具(Python)来完成,不要用手打的方式重写整份 HTML。
game.html 里有一段很长的图片编码(base64 字串),手打一定会出错或被截断。

请这样做:

一、读取 xlsx 的这三个工作表:
   「2. 选择题 MCQ」「3. 配对题 Matching」「4. 设定 Settings」

二、依下面的格式组出新的 const QS=[...] 数组:
   选择题:{type:'mcq', logic:'…', ext:'…', t:'…', o:['选项A','选项B','选项C'], a:0, e:'…'}
     · logic = 「论点」栏,ext = 「引文」栏;该栏若留空,就把这个键整个省略
     · a 是正确答案的索引:A→0、B→1、C→2
     · 题目顺序照「题号」由小到大排
   配对题:{type:'match', t:'…', items:[{text:'…', c:0}, …], cats:['类别1','类别2'], e:'…'}
     · c 是类别索引:类别1→0、类别2→1
     · 配对题要放在它「题号」应该在的位置
   字串一律用单引号;内容里若出现单引号,请写成 \'

三、在 game.html 里只替换以下几处,其余一个字都不要动:
   · const QS=[ … ];  → 换成新数组
   · const LVNAMES=[…]  → 换成「设定」里的两个关卡名称
   · <title> 和 <div id="titleBar"> 里的标题 → 换成「设定」里的游戏标题
   · 开场画面 showScr('⚔️',…) 与 showScr('📖',…) 里的课文名称与页码 → 换成「设定」里的内容
   · function lvDone() 里的三段完成语 → 换成「设定」里的三段
   · const G={… lives:5 …} 以及三处 G.lives=5 → 换成「设定」里的生命数

四、如果题数不是 20 题,请同时:
   · 更新 const LV_Q=[[0,9],[10,19]]
   · 更新 buildLv() 里 bd 数组的方块数量(每关方块数必须等于每关题数)
   · 把开场说明里的「20题,满分20分」改成新的数字

五、绝对不要改动:sprite.src 那一长串 base64、游戏物理、绘图、音效、xAPI 相关程序码。

六、交件前请自己检查并告诉我结果:
   · 新档案里 QS 的题数是多少
   · 引号与逗号是否成对(可用 Python 粗略检查)
   · base64 字串的长度是否与原档完全相同
   · 最后把改好的 game.html 存成档案让我下载,不要只把片段贴在对话里
I want to adapt an HTML5 Chinese-language game to my own text. I've attached two files:
1. game.html — the original game, currently working
2. question-bank-template.xlsx — my new questions, filled in

[IMPORTANT] Do this with your code/Python tool. Do NOT retype or regenerate the HTML by hand:
game.html contains a very long base64 image string that will be corrupted or truncated if you rewrite it.

Please do the following:

1. Read these three sheets from the xlsx:
   "2. 选择题 MCQ", "3. 配对题 Matching", "4. 设定 Settings"

2. Build a new const QS=[...] array in this exact format:
   MCQ:   {type:'mcq', logic:'…', ext:'…', t:'…', o:['option A','option B','option C'], a:0, e:'…'}
     · logic = the Claim column, ext = the Quote column; if the cell is blank, omit that key entirely
     · a is the index of the correct answer: A→0, B→1, C→2
     · order the questions by their question number
   Matching: {type:'match', t:'…', items:[{text:'…', c:0}, …], cats:['category 1','category 2'], e:'…'}
     · c is the category index: 1→0, 2→1
     · place the matching question at the position its question number calls for
   Use single quotes for strings; escape any single quote inside the content as \'

3. In game.html, replace ONLY the following, leaving everything else byte-for-byte untouched:
   · const QS=[ … ];  → the new array
   · const LVNAMES=[…]  → the two level names from the Settings sheet
   · the title in <title> and <div id="titleBar">  → the game title from Settings
   · the text names and page numbers in showScr('⚔️',…) and showScr('📖',…)  → from Settings
   · the three closing-feedback strings in function lvDone()  → from Settings
   · const G={… lives:5 …} and the three G.lives=5  → the number of lives from Settings

4. If the number of questions is not 20, also:
   · update const LV_Q=[[0,9],[10,19]]
   · update the bd array in buildLv() so each level has exactly as many blocks as questions
   · update "20题,满分20分" in the opening screen to the new number

5. Never touch: the long base64 in sprite.src, the game physics, the rendering, the sound code, or the xAPI code.

6. Before you hand it back, check and report:
   · how many questions ended up in QS
   · whether quotes and commas are balanced (a rough Python check is fine)
   · whether the base64 string is exactly the same length as in the original
   · then save the modified game.html as a file I can download — don't just paste snippets in the chat

⚠️ 上传前请确认档案里没有学生的个人资料。题目、课文摘录没问题;学生姓名、成绩、班级名单不要上传到 AI 平台。

⚠️ Before uploading, make sure the files contain no student personal data. Questions and text extracts are fine; names, marks and class lists should not go to an AI platform.

4

下载 AI 给你的新档案,先自己玩一遍

Download the new file and play it yourself first

把 AI 给的 game.html 存到电脑,双击就能在浏览器里打开,不必上传任何地方。请照这份清单检查:

Save the game.html the AI gives you and double-click it — it opens in your browser, nothing to upload. Then run through this checklist:

画面卡在开场、什么都不动?多半是题目里的引号或逗号出了问题。把这句话回给 AI:「游戏卡在开场画面,请检查 QS 数组的引号与逗号,修好后再给我一次档案。」

Stuck on the opening screen? Almost always a quote or comma in the questions. Reply to the AI: "The game is stuck on the opening screen — please check the quotes and commas in the QS array and give me the fixed file again."

5

放上网,发给学生

Put it online and share it

还没有 GitHub 账号?先看 路径 1 的步骤 1–3(开账号、复制 repo、开启 Pages),三分钟就好。已经有了的话:

No GitHub account yet? Do steps 1–3 of Path 1 first (account, fork, Pages) — about three minutes. If you already have one:

  1. 打开你 fork 的 repo,点进 game.html。
  2. Open your forked repo and click into game.html.
  3. 右上角 Add file → Upload files,把新的 game.html 拖进去(档名要一样,才会覆盖旧的)。
  4. Top right: Add file → Upload files and drag the new game.html in — same filename, so it replaces the old one.
  5. 下方按 Commit changes。
  6. Click Commit changes at the bottom.
  7. 等 1–2 分钟,打开你的网址加上 game.html,就是你的新版本了。
  8. Wait 1–2 minutes, open your address with game.html on the end, and there's your version.
6

(可选)也要一份会记分到 SLS 教师后台的

(Optional) A version that reports into your SLS gradebook

同样的做法再来一次,只是这次把 SLS 版一起上传给 AI,请它「用同一份 xlsx,对这个档案做完全一样的替换」。

Same routine again — upload the SLS build too and ask the AI to "apply exactly the same replacements to this file, using the same xlsx".

拿到新档案后压缩成 .zip(档名必须是 index.html、放在压缩档最外层),在 SLS 选 Question → Free Response → Interactive Response 上传,Maximum Marks 设成你的总题数。详见 docs/sls-deployment.md。

元件一定要选 Interactive Response。选成 Text/Media,游戏照样打得开、学生照样做完,但分数一个都不会记录,而且画面上看不出任何异样 —— 要等到你去看成绩才发现后台是空的。

The component must be Interactive Response. With Text/Media the game still opens and students still finish it, but not a single mark is recorded and nothing on screen shows it — you find out when you go looking for the marks and the gradebook is empty.

Zip the file you get back (it must be named index.html at the top level of the archive), upload it in SLS under Question → Free Response → Interactive Response, and set Maximum Marks to your total number of questions. Details: docs/sls-deployment.md.

← 回三条路径← Back to the three paths