你在 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.
按下面两颗钮,存到同一个资料夹里(例如桌面新建一个「我的论证游戏」)。
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.
打开 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.
把 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."
还没有 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:
game.html。game.html.game.html 拖进去(档名要一样,才会覆盖旧的)。game.html in — same filename, so it replaces the old one.game.html,就是你的新版本了。game.html on the end, and there's your version.同样的做法再来一次,只是这次把 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.