oc-english README

The project's README from github.com/yczz/oc-english. As one markdown file: README.md.

带着OC学英语

创建一只属于你的 Q 版 OC,给它捏脸、换装、布置小家——而赚积分的唯一方式,是认真学英语。

Tauri 2.0 桌面应用 · Rust 后端 + Vanilla JS 前端 · SVG 矢量 Q 版角色 · PixiJS 等距 2.5D 房间 · macOS


📸 界面一览

注册档案 捏脸工坊
注册屏 捏脸
衣橱换装(一键同款蝴蝶少女) 2.5D 小家
衣橱 房间
商店 学习中心(13 册教材)
商店 学习中心
跟练(四选一 + 听力) 单元考成绩单
跟练 考试成绩

截图由 npm run screenshots 自动生成(无头 Chrome + 契约级后端 mock 跑真实前端)。


🎮 游戏介绍

🧒 创建你的 OC(免费 · 不限数量)

起个名字就能迎接一只空白小人。可以创建多只 OC,每只都有独立的脸蛋、衣柜和小家,随时在人物栏一键切换。

🎨 捏脸 + 换装

🏠 2.5D 温馨小家

📖 学英语(人教版同步)

⭐ 积分经济

积分是唯一的货币,只能靠学习赚取,用来买装扮和家具装扮 OC 与小家。

事件 积分
🎁 新手礼包 +200
🎵 跟练答对一张卡 +2
🏆 单元考首次通过 +100
📈 再次通过且刷新最佳 每多对 1 题 +10

🛠️ 技术栈

层 技术
壳 Tauri 2.0(Rust),包体 ~10MB
后端 Rust:存档/商店/题库/出题/考试判分全部在 Rust 侧,数据编译进二进制
前端 Vanilla JS(ES Modules,零框架零打包器)
角色 SVG 矢量分层组装(素体 → 装扮 9 层 → 五官 → 发型)
房间 PixiJS(WebGL)等距 2.5D 场景,SVG → 纹理
存档 JSON,位于系统应用支持目录

📁 目录结构

├── src/                    # 前端(Vanilla JS)
│   ├── index.html          # 单页界面(注册/主界面/学习中心 + 7 个弹窗)
│   ├── main.js             # 交互逻辑(捏脸/衣橱/预设/商店/房间/跟练/考试)
│   ├── styles.css          # 暖色卡通主题
│   ├── lib/pixi.min.js     # PixiJS(本地 UMD)
│   └── js/
│       ├── api.js          #   Tauri invoke 封装
│       ├── character.js    #   素体 + 五官/发型/装扮分层渲染器
│       ├── wardrobe.js     #   50 件装扮 SVG 素材(9 部位)
│       ├── furniture.js    #   18 件家具 SVG 素材
│       ├── room.js         #   等距 2.5D 房间(Pixi,拖拽/吸附/深度排序)
│       └── tts.js          #   单词朗读
├── src-tauri/              # Rust 后端
│   ├── src/
│   │   ├── models.rs       #   存档数据结构(档案/人物/脸型/装扮/进度)
│   │   ├── commands.rs     #   Tauri 指令(注册/创建/换装/购买/摆放…)
│   │   ├── content.rs      #   13 册教材 + 语法卡加载
│   │   ├── questions.rs    #   跟练卡与 15 题考卷生成、判分
│   │   └── shop.rs         #   商店目录(50 装扮 + 18 家具)
│   └── data/               # books/(13 册 JSON)+ wardrobe/furniture/grammar
├── test/                   # 冒烟测试(jsdom 全流程 / 渲染 / 契约)
├── scripts/screenshots.mjs # README 截图自动生成
└── docs/DESIGN.md          # 设计稿

存档位置:~/Library/Application Support/com.zhengzhong.oc-english/player.json


💻 安装步骤

1. 环境要求(macOS)

依赖 版本 安装
Xcode Command Line Tools — xcode-select --install
Rust stable curl --proto '=https' --tlsv1.2 -sSf https://sh.rustup.rs | sh
Node.js ≥ 22 官网下载或 brew install node

2. 获取代码并安装依赖

git clone <仓库地址> OC学英语
cd OC学英语
npm install          # 仅两个开发依赖:@tauri-apps/cli、jsdom(npm 建议配国内镜像)

3. 开发模式运行(日常迭代推荐)

npm run tauri dev

首次会编译 Rust 依赖(几分钟),之后热更新秒级生效。

4. 打包成正式 App

npm run tauri build

产物:

src-tauri/target/release/bundle/macos/带着OC学英语.app   ← 双击即用
src-tauri/target/release/bundle/dmg/带着OC学英语_0.1.0_aarch64.dmg

⚠️ 未做 Apple 签名公证,首次打开若被 Gatekeeper 拦截:右键 → 打开,或执行 xattr -cr 带着OC学英语.app


✅ 测试

npm test
套件 覆盖
test:rust Rust 单测 + 全流程集成(注册→学习→考试→购买)
test:contract 前端 api.js 与 Rust 指令契约对齐
test:render 50 装扮 + 18 家具素材完整性、SVG 合法性(xmllint)
test:ui jsdom 全流程冒烟:注册→捏脸→商店→换装→房间→跟练→考试→登出

README 截图再生成:npm run screenshots(需要本机装有 Google Chrome)。


🗺️ 路线图

oc-english (yczz/oc-english)

Searching Database…

What is this?It's a Chinese virtual-pet raising game where you create and customize a chibi character, decorate a 2.5D room, and furnish it — but the only way to earn the points needed to buy outfits and furniture is by completing real English lessons.
Is this a game, a study app, or both?It's a native desktop game: a Tauri 2.0 app with a Rust backend handling saves/shop/exams and a Vanilla JS frontend rendering SVG characters and a PixiJS 2.5D room, with English lessons woven into the game's economy.
How do I get it running?Clone the repo, install dependencies, then run the Tauri dev command for a hot-reloading dev build, or build it to produce a packaged .app bundle.
Do I need Rust and Node.js before building it?Yes — you need Xcode Command Line Tools, a stable Rust toolchain, and Node.js 22 or newer installed before you can build or run the app from source.
Is the macOS build ready to open right out of the box?Not quite — the app isn't Apple-signed or notarized, so Gatekeeper may block the first launch; you'll need to right-click → Open, or run xattr -cr on the .app.
Does it run on Windows or Linux, or only Mac?Right now it's macOS-only. An iOS version (via Tauri 2's mobile support) is in progress and an Android version is planned, per the roadmap.
What English textbooks does it sync with?It follows 13 Chinese PEP (人教版) textbooks — 8 elementary books from grade 3 to grade 6, and 5 middle-school books for grades 7 to 9 — with in-game units matching the real textbook units.
How do I actually earn points?Points come only from studying: you get +200 as a starter gift, +2 for each correct vocabulary/listening practice card, +100 for passing a unit test for the first time, and +10 per extra correct answer when you beat your best score.
How much can I customize my character?Face customization (skin tone, eyes, eye color, hairstyle, hair color, mouth, blush) is entirely free, while a 9-slot outfit system (hat, glasses, top, bottoms, shoes, held item, back accessory, earrings) with 50 items must be unlocked using points earned from lessons.
Can I have more than one OC?Yes, you can create unlimited OCs for free, each with its own face, wardrobe, and room, and switch between them instantly from the character list.
Creator
yczz
Size
6.5 MB
Stars
681
Updated
CommitSep 05
Age
1mo
Commits · 90 Days