一款关于**游戏本地化(LQA)**知识的网页互动游戏。玩家扮演刚入行的本地化特工,在六大关卡中学习真实行业知识,最终成长为能独当一面的本地化总监。
不是选择题刷题,而是动手操作 —— 在真实出过事故的本地化案例中亲手修复错误。
| # | 章节 | 知识点 | 玩法 |
|---|---|---|---|
| 1 | 术语侦探所 | 术语库一致性 · Termbase | 点击替换不一致术语 |
| 2 | 字数刑场 | UI 字符限制 · 文本膨胀率 | 输入压缩译文 + 溢出裁切动画 |
| 3 | 变量爆破现场 | 占位符 · ICU Message | 保留变量标签 + 复数规则 |
| 4 | 文化雷区 | 审查 · 文化禁忌 | 放行/修改/拒绝判定 |
| 5 | 创译工坊 | 双关 · 角色语域 | 自由创译 + AI 三维度评分 |
| 6 | 终局考核 | LQA 全流程 | 截图找茬 + 分类 + 报告卡 |
每章 10 道关卡,共 60 道可玩关卡。
| 层 | 选型 |
|---|---|
| 前端 | Vite + React 18 + TypeScript + Tailwind CSS + Zustand |
| 后端 | Node.js + Express + SQLite (better-sqlite3) |
| AI 评分 | OpenAI 兼容 API(用户自建) |
# 1. 安装依赖
npm install
# 2. 配置后端 LLM(AI 评分用)
cd apps/server
cp .env.example .env
# 编辑 .env 填入你的 LLM 服务地址和模型名
# LLM_BASE_URL=http://localhost:11434/v1
# LLM_MODEL=qwen2.5:14b
# 3. 启动后端(终端 1,端口 3000)
npm run dev -w apps/server
# 4. 启动前端(终端 2,端口 5173)
npm run dev -w apps/web
# 5. 浏览器打开
# 本机: http://localhost:5173
# 局域网: http://<本机IP>:5173也可以一键启动(需要 concurrently):
npm run dev前端(Vite)和後端(Express)均已监听 0.0.0.0,局域网内其他设备可以通过 http://<本机IP>:5173 访问游戏,通过 http://<本机IP>:3000/api/health 检查后端状态。
⚠️ 前端的/api请求在开发模式下通过 Vite proxy(5173 -> 3000)转发,因此局域网设备只需访问前端端口即可正常游戏。
本游戏在 Ch5 创译工坊和 Ch6 报告点评中使用 AI 评分。需要配置一个 OpenAI 兼容的 API:
| 服务 | 示例 LLM_BASE_URL |
说明 |
|---|---|---|
| Ollama | http://localhost:11434/v1 |
本地推理,免费 |
| LM Studio | http://localhost:1234/v1 |
本地推理,兼容性好 |
| vLLM | http://localhost:8000/v1 |
高性能推理 |
| 远程 API | https://api.openai.com/v1 |
需有效 API key |
如果 AI 评分不可用,Ch5 仍可游玩(走兜底评分逻辑)。
Learn-LQA-With-Game/
├── apps/
│ ├── web/ # 前端
│ │ └── src/
│ │ ├── chapters/ # 6 章运行器
│ │ ├── components/ # 共享 UI
│ │ ├── data/ # 60 道关卡题库
│ │ ├── engine/ # API 客户端 + 计分器
│ │ ├── hooks/ # 通用 hook
│ │ ├── pages/ # 页面组件
│ │ ├── store/ # Zustand stores
│ │ └── types/ # 类型定义
│ └── server/ # 后端
│ └── src/
│ ├── routes/ # API 路由
│ ├── prompts.ts # AI 评分 prompt
│ ├── llm.ts # LLM 客户端
│ └── db.ts # SQLite 数据库
├── docs/ # 设计方案 + 路线图
└── package.json # monorepo 根配置
- 星级评分:每关按准确率 + 用时 + 提示使用给 1-3 星
- 知识卡片:每关解锁一张本地化冷知识卡,可在图鉴页查看
- 错题本:自动记录答错题目,支持复盘重练
- 结业证书:通关后生成可下载 PNG 证书
- 萌新/专家模式:专家模式无提示、更严格计分
MIT