🎓 Wisdom Squirrel (智慧多学堂)

Wisdom Squirrel (智慧多学堂) 是一款专门针对小学三年级（8-9岁）小朋友量身定制的 AI 互动智能伴学系统。系统支持拍照传图识题、分步卡片讲解、SVG 智能动态教具演练、以及“消消乐”式错题闯关闭环。

通过轻量级本地 Client-Server 架构，家长可以把服务运行在电脑上，让孩子使用平板或手机在局域网内同步访问和互动学习。

✨ 核心亮点与创新设计

🐿️ 1. AI 卡通学伴「智慧多老师」

趣味陪伴：引入了会眨眼、摇尾巴、挥手的卡通松鼠“智慧多老师”SVG 动态形象，拉近与低龄儿童的距离。
草稿气泡流：将 AI 流式的思考和演算过程可视化为精美的“演算草稿纸”气泡，生动展示大模型的思考轨迹，极大降低孩子等待时的焦虑感。

🎨 2. 智能可视化教具 2.0 (Smart Visualizer)

系统会根据 AI 分析的题目类型，智能解析题目数据，并在“看一看”视图中动态绘制精致可交互的 SVG 数学图景：

🕐 卡通时钟 (clock)：智能识别题目中的时间（如 10:30 或 8点15分），渲染带有可微调时针、分针的卡通表盘。
🥧 分数饼图 (pie-chart)：识别题目中的分数（如 3/4），渲染出高对比度的切片分割圆饼图，帮助孩子建立分数几何直觉。
📐 乘法行列网格 (array-grid)：自动识别乘法算式，渲染行列格网。
⚖️ 卡通天平 (balance)：左右放置不同大小的重力物品，天平会根据等式或不等式关系动态倾斜偏转。
📏 动态数轴 (number-line)：动态绘制加减法的弧线跳跃动画。

📷 3. 多模态拍照传图解题

支持移动端或桌面端直接上传题目照片或截图，融合 Vision 大模型能力，孩子不会打字输入复杂算式也能一键识别解析。

📕 4. “错题消消乐”复习闭环

科目折叠收纳：所有错题按照“数学”、“语文”、“英语”三科进行手风琴式智能折叠，界面清爽。
重新挑战模式：孩子可以在错题本中点击“重新挑战”再次作答，答对后触发满屏星星粒子喷射特效，奖励 1 颗 ⭐ 勤学星，并将错题标记为“已消灭”，让复习流实现完美闭环。

🛠️ 技术架构

前端核心：Vanilla JS (原生 JS 模块化) + CSS Variables (精选儿童友好 HSL 配色、毛玻璃微阴影效果)。
构建工具：Vite 8.x 极速打包构建。
后端服务：Node.js + Express 极简服务端，数据安全保存在本地的 data.json 中，支持多客户端（PC、手机、平板）局域网互通。
AI 后端：支持任何标准的 OpenAI 兼容格式接口（如本地部署的 Qwen3.7、DeepSeek、Llama3 等），支持流式传输（Streaming）与 Vision 图像分析。

🚀 快速开始

1. 克隆与安装依赖

# 克隆仓库
git clone https://github.com/AllenCoder/wisdom-squirrel.git

# 进入目录
cd wisdom-squirrel

# 安装后端和打包依赖
npm install

2. 启动服务

项目采用双端运行架构（前端开发服务 + 后端数据存储服务），我们已在配置中打通了局域网共享和代理：

# 终端 1：启动本地数据服务（运行在 http://localhost:3000）
node server.js

# 终端 2：启动 Vite 前端服务（运行在 http://localhost:5173）
npm run dev

运行 npm run dev 后，Vite 控制台会打印出您的局域网 Network IP（如 http://192.168.x.x:5173/）。您可以在手机或平板的浏览器中输入该地址直接进行跨端伴学！

3. 配置您的本地大模型

点击主界面右上角的 “⚙️ 设置” 按钮。
填写您的模型名称（如 qwen-2.5-vt）以及 API Key（本地兼容服务默认不需要 Key）。
默认代理路由已将本地大模型请求路由至 http://127.0.0.1:5000 (OpenAI 格式)，您可根据需要修改 vite.config.js 中的代理端口。

📁 目录结构

wisdom-squirrel/
├── public/                 # 静态图标与 svg 资源
├── src/
│   ├── assets/             # 图片与背景资源
│   ├── components/         # 界面核心组件
│   │   ├── shared/         # 语音及动画公共组件 (audio-manager, celebration)
│   │   ├── input-panel.js  # 题目输入与 loading 思考卡片
│   │   ├── learn-view.js   # 「学一学」分步讲解卡片
│   │   ├── example-view.js # 「看一看」举例与 SVG 可视化教具
│   │   ├── practice-view.js# 「练一练」游戏化答题闯关
│   │   └── report-view.js  # 「查一查」错题消消乐与统计报告
│   ├── config/             # 教师 Prompt 设定
│   ├── data/               # 本地存储防抖同步管理
│   ├── modules/            # AI 引擎核心 fetch 及 JSON 过滤
│   ├── index.css           # 精致儿童友好拟物化设计系统
│   └── main.js             # 主路由控制入口
├── server.js               # 本地 Express 数据服务
├── data.json               # 本地数据库 (自动生成且已被 .gitignore 过滤)
├── vite.config.js          # 局域网服务与接口反向代理配置
└── README.md               # 项目说明文档

🤝 贡献与反馈

欢迎提 Issue 或 Pull Request！我们致力于将 Wisdom Squirrel 打造为最懂孩子、最有趣的原生 AI 教育开源模板。

作者：AllenCoder
许可协议：MIT

AllenCoder/wisdom-squirrel

README