TEM-8 英语词汇学习系统
TEM-8 Vocabulary Learning System
基于 Node.js + Vue 3 构建的 Web 学习系统:单词背诵、真题库练习、间隔复习闪卡、拼写模式、历史趋势与后台管理。
SQLite 数据库
Node.js + Vue 3
数据可视化
后台管理
开发背景 Development Background
英语专八(TEM-8)是最能检验英语专业学生语言水平的证书考试,词汇量往往是拉开差距的关键。但市面上的背词软件多为通用词表、与真题脱节,难以针对专八真实考题进行针对性复习。
因此我把重心放在"数据"上:将考试材料 TEM8.docx 中的 70 道真题结构化整理入库(试题、选项、词汇三张表),再围绕真题设计"背诵 → 练习 → 复习"的学习闭环。
项目简介 Project
本系统是一个面向英语专八(TEM-8)备考的词汇练习与记忆系统。把考试材料 TEM8.docx 中的 70 道真题解析进 SQLite 数据库、并直接生成 92 条高频词汇(含音标、词性、中英释义、例句),再基于 Node.js + Vue 3 实现单词背诵与练习两大模块。
功能围绕真题练习、闪卡复习、拼写测验、历史趋势、收藏与后台管理等模块展开,全程独立设计完成。
说明:本系统为可完整运行的本地演示项目,目前仅在本机配置环境后使用,尚未公网部署。
用户与场景设计 User & Scenario
目标用户(设计假设):备考英语专八(TEM-8)的英语专业学生;核心场景:碎片时间背词、考前集中强化。
设计取舍:从"通用词表"转向"真题导向",让每一个词都来自真实考题;从"背单词"转向"在真题里反复用词",强化输入与输出两个环节。
功能亮点 Highlights
- ◆真题题库练习:选择填空 + 同义替换两种题型,支持随机抽题、限定题数与题型,作答即时反馈正误并自动计时记录成绩。
- ◆间隔复习闪卡(SM-2):参考 Anki 算法,正面英文翻转中文释义,按"重来/模糊/认识/简单"四档自评自动调节复习间隔。
- ◆拼写模式:显示中文释义,输入英文拼写即时校验,强化单词拼写能力。
- ◆历史记录与趋势图:每次练习自动记录用时、得分、题数,CSS 柱状图直观展示成绩趋势。
- ◆收藏生词 + 后台管理:单词卡片一键收藏并支持字母分组/搜索;管理员后台可对词汇与题库增删改查(admin/admin)。
- ◆暗黑模式 + 键盘快捷键:一键切换亮/暗主题;快捷键换题、A/B/C/D 快速选答。
数据洞察 · 体验设计 Data & Experience
- ◆数据驱动的产品逻辑:系统会自动记录每次练习的用时、得分与正确率并生成趋势图,完整实践了"数据记录 → 可视化 → 辅助决策"的思路。
- ◆留存设计(借鉴):SM-2 间隔复习借鉴了学习产品"对抗遗忘"的留存思路——不靠堆功能,而是让复习节奏本身帮用户坚持。
- ◆体验细节:生词收藏、暗黑模式偏好持久化、四档自评,都在设计上降低上手与回访成本。
界面展示 Screenshots
首页系统欢迎页,展示学习模式入口与总体数据
词汇背诵单词 + 音标 + 中英释义逐词浏览
间隔复习闪卡正面英文 → 翻转中文释义,四档自评
拼写模式显示中文释义,输入英文即时校验
真题练习设置选择题型、题数与抽题方式
真题练习答题作答后即时反馈正误与答案解析
练习历史与趋势柱状图展示成绩趋势,支持清除记录
登录后台管理统一账号 admin/admin
后台管理词汇 / 题库增删改查
暗黑模式一键切换深色主题并自动保存偏好
图为程序实际运行的部分截图。
项目复盘 Project Recap
- ◆目标:把真题转成可练习的词汇系统,跑通"背 → 练 → 复"完整闭环。
- ◆做法:先整理数据、设计三张库表,再把功能拆成六个独立模块,前后端分离开发、边做边测。
- ◆结果:走通"数据 → 产品"全流程,沉淀了可复用的库表结构与交互组件。
- ◆下一步:按题型拆分正确率统计、接入错题重练与打卡提醒,让数据进一步反哺学习。
配套输出物 Deliverables
除了系统本身,我还配套撰写了完整的操作手册,用口语化的方式描述功能,把复杂技术转述成易懂内容。